While some of what’s in here boils down to personal preference, there’s enough in Harry’s guide that speaks to my own experience that I’ll be paying close attention to those that don’t (yet). It’s also a great example of how OOCSS, SMACSS, and BEM best practices can work together.

Continue reading...

A superbly useful list of front-end performance best practices, but what sets this apart is that each is meticulously followed by a demo, reference, or JSPerf example so you can see exactly how or why performance improves.

Continue reading...

What do you have to say? If you don’t know, there’s not much use in adding all that other cruft. Just start with one page, with a single focus. Write it and publish it, and then iterate on that. Every time you’re about to add something, ask yourself: does this help me communicate better? Will that additional styling, image, or hyperlink give my audience more understanding? If the answer’s “no”, don’t add it.

Like Justin Jackson, whom I just quoted, I too was impressed—no, that’s the wrong word, maybe “inspired” in the sense of being literally filled with fresh air—with Jason Fried’s homepage for 37 Signals’ new service, Know Your Company. One page, with lots of words, and they’re great ones. We’ve become so obsessed with connecting things by collecting and liking and associating that it’s easy to forget how people have been connecting for all time: by talking to one another. The internet’s still pretty damn good for that, even as it becomes good for so much more.

Via Jeremy

Continue reading...

A useful post by Roger at 456 Berea St. on proportionally scaling images even when they have width and height attributes hard-coded in the HTML (such as WordPress does automatically). I’d been using a PHP function to remove them on WordPress sites:

Continue reading...

Paperclip is a great gem for handling file uploads in your Rails app, but there are some important steps you need to take to ensure the best performance when serving images.

Continue reading...

I love Heroku for deploying Rails apps. If you use Heroku too, you may have noticed a line of output when deploying:

Continue reading...

I’ve long struggled with how best to implement dynamic error pages in Rails. The default solution, simply rendering static HTML files from the public root, is appropriately simple for 500 errors where your app may not be capable of rendering a dynamic page, but falls short for less grave errors, especially the common 404. I’ll often want to render a 404 using my application’s layout so as not to confuse users, include partials such as for a search form, and I recently worked on an internationalized app where I wanted to translate the 404 message. Rails will serve localized static pages (e.g. 404.en.html, 404.de.html), but I’d rather keep everything in my locale YAML files and render it with I18n.t('not_found').

Continue reading...

Aside from being inelegant, having your pages accessible both with and without a trailing slash is an SEO no-no because search engines can treat them as separate pages, diluting your page rank. For this reason, it’s best to choose one and redirect the other to it.

Continue reading...

Modal dialog boxes (those pop-up boxes that steal the focus from the rest of the page) can be terrible for accessibility if mishandled. Fortunately, ARIA roles make it pretty simple to get right.

Continue reading...

Dan Cederholm’s favorite website is his local soup joint’s soup of the day page. It isn’t fancy or even pretty, but it gives him what he wants with minimal fuss.

Continue reading...