175: Rapidfire 48

We've got another RAPID-FIRE for you this week! Nothing but questions and answers. That's what you like, right? Ohhhh, yeah.

We answer questions about fonts on Windows PCs, CSS frameworks, carousels, organizing SASS files, deploying with rsync, unicorns, managing Gulp files, and more!


, , , , , , , , ,


Chris Coyier and Dave Rupert in silly sunglasses and a sign that says Shawp Tawlkk Shough DOT COM

Chris Coyier and Dave Rupert

This episode is with just Chris & Dave, ShopTalk Show's hosts. Chris is the co-founder of CodePen and creator of CSS-Tricks, and Dave is lead developer at Paravel.

Time Jump Links

  • 2:27 After designing and creating a website on a Mac and getting everything looking pretty, I always get a bit disappointed when I come to look at the site on a PC. I find the font smoothing and colour management on OS X make everything look substantially nicer, particularly @font-face fonts. Adding a subtle text shadow to everything helps a bit but are there any plugins or other tools to improve font smoothing on the users’ screen? If not, is there anything you take care to avoid at the design stage to make the difference less apparent in the end product?
  • 6:30 I'm used to building websites from scratch, but I'm getting into HTML5 frameworks. What is the best way to customize one of those frameworks?
  • 11:55 How do you feel about condensing information into swiping carousel on mobile devices? Basically, if a site has 3 columns of informational text on desktop it will turn into a 1 column carousel with swiping functionality on mobile. Some of the designers like it because it provides more interactive/fun experience on mobile, as well as helping balance and shorten the page length. I feel like this has the same principle of regular hero sized carousels and the fact no one uses them. Also, hiding content like that is just bad right?
  • 17:35 So my question for you sort of open-ended, I just was hoping to get a little window into what your organization style and workflow is like with SASS. Do you keep separate stylesheets and import them all? Do you keep everything organized in one file like classic CSS? I’d just like to get some advice from someone who’s been through the ropes a little bit and can help me write code I won’t cringe at when I look back at it years from now.
  • 21:55 I want to be able to select <li>’s like how I would files my desktop. It looked like I could use jQuery UI, but…it doesn’t support the Shift key for multiple select. Do you have any suggestions for a plugin, Code Pen (plug), etc. that could help me out?
  • 26:04 I have a question about uploading a site to the web. I work locally with localhost etc, and then put my files online via FTP. I have heard you mention this is now outdated and not best practice. What are the best alternatives to FTP and what are their benefits over FTP?
  • 29:22 I have always styled the default state for links using the type element selector on the anchor element like a { styles… } but I have always wondered about the pseudo-class :link since it’s function is to style links that are in its default state maybe I should just be styling using :link { styles… } instead of on the anchor element? Then I wouldn’t have conflicting styles and the need to overwrite styles when using an anchor for wrapping divs and getting rid of those link styles.
  • 33:12 I graduated with a comp-sci degree but found that I love to design as well as develop on the back end. Is there anyone out there that does this? Or is there always a clear cut break between the front end and back end? Is it good to blur these lines?
  • 36:37 I would like to know if there are any workarounds for pixel rounding as-well as floating point rounding in browsers? My problem occurs when I make fluid grids. All browsers seem to round floating points differently which makes them inconsistent across browsers.
  • 40:15 The agency I’m working at is starting to move toward more modular SCSS, following the SMACSS model. Jonathan Snook says that media queries should go next to the module that they affect. I think this approach will be way easier to maintain, since all the code for that module will be in one spot, but I’ve also heard people mention that this will lead to massive code bloat and performance issues. Are there performance issues with this? What kind of organizational model do you all follow with your SCSS to help with maintainability?
  • 44:46 I work for a small design/development agency. We are planning on redesigning our archaic website. How we build it is primarily up to me. The content will consist of media-rich case studies. It is currently on Wordpress. Keeping it updated becomes so overwhelming and cumbersome that it never seems to happen. I am considering using Jekyll or perhaps some other static site compiler. Everyone in the company knows how to write markdown, and I feel that keeping the content updated via YAML or JSON would actually end up saving time. The whole site could be stored in a git repo and in my mind be much more flexible moving forward. Are there other compilers like Jekyll that I should consider? Is there anything you have found overwhelmingly difficult with this approach? Static files seem unprogressive yet in many ways they feel like a breath of fresh air.
  • 51:01 What are best practices when using Gulp on a team? Should everyone always be running the latest versions of Gulp, NPM, SASS, etc? How should I deal with old Gulp files? Should I update them as I come across them, or maintain the same Gulp file across all projects? Do you have any other best practices for maintaining development environments between team members?
  • 55:43 If you have a huge database driven web app, is it better to have an incomplete sitemap, or none at all? Do you see sitemaps themselves potentially becoming obsolete as search engines get smarter/better at finding their way around?