Today’s internet is all about pleasing everyone. With responsive this and fallback that, how do we account for everything as web designers and developers with so many facets to a single, simple web page?

JavaScript

Ensuring a good user experience with or without JavaScript can be a pain in a large project. I’ll be honest, not everything is on my site pre–launch list for personal projects, and browsers without JavaScript is usually one of those things. Sometimes I wonder why anyone would install a modern browser and then disable 90% of the functionality…

How does one combat against <noscript>? Design as much as possible in HTML & CSS. Keep your head and body clear of scripts until your site is fully operational. Make JavaScript additions the last thing on the list only after everything else is fully functional. I have used this method with success, but it can always get tricky ensuring updates later on do not interfere with scriptless site functionality.

Do I need to ensure a good experience for <noscript>ers before launch? Not for every project. For instance, I do not expect visitors to a web design and development blog to have disabled JavaScript. I certainly want such visitors to be happy, but it just simply is not a priority over getting the site up and active. (It is my next order of business, of course.)

Retina

Visitors riding the wave of the future can be difficult to take into consideration during the creation of a responsive design. Sure we can make the entire site in SVG files and scale everything, but that is not always practical. Checking display quality can also be difficult if one does not own a retina display.

On the bright side, there are plenty of resources to help with this task. There is a cheat sheet for Retina media queries over at CSS-Tricks. There is also a great book with more information on this topic at Retinafy, though the flowchart recently published by Thomas Fuchs should be a great start for the CSS savvy. Using Icon-based Fonts (check out Fontello for a minimal approach), fewer images in general, and utilities such as Retina.js can make all the difference in getting Retina–ready.

Older Browsers

Testing against older browsers can be done relatively easily with virtualized apps (such as Browsers at Spoon.net or BrowserStack), but at what point do we stop supporting IE6? IE7? IE8? Personally, in regards to IE, I shoot for IE8 compatibility for client projects, and IE9 for personal projects, while watching analytics to see if I need to revise my decisions at any point in time.

In comparison to older version of IE, older versions of Firefox and Chrome tend to not require in–depth changes for compatibility, and users of those browsers are also more likely to update their software occasionally.

Ultimately the browser compatibility of any particular project should be tailored to that project. If you are designing a site for a company doing business in China, you will probably want to support 360SE, SugouExplorer and MaxThon. A new startup catering to the tech savvy may stick to more recent and localized browser versions.

Rules of Web Design

There are so many “rules” to web design today, but not all of the gospel–like rules must be adhered to for the launch of your site. Every web site is a constant work in progress. If I need to support something, I will. If I need to support time travelers running Windows 95, I will suck it up. The above points are just things to keep in mind, certainly they are not required of all websites regardless of size or audience.

If your website can be launched tomorrow but support for retina is delayed, by all means launch the site. If you cannot possibly support a scriptless browser in your new JavaScript–MVC based application, no one should fault you for that (however, they should turn on JavaScript). Sometimes you just need to relax a little and design something simple, and then work your way through the refinements later on.