How to make sure your website doesn't suck

First published: April 20, 2012
Last updated: March 17, 2013

It's amazing that the web has been well known and widely used by the public for around 15 years now and it is still full of websites which suck in very obvious ways. This document is a list of necessary but not sufficient conditions for your website to not suck. Most of the advice seems like common sense to me, but apparently it isn't because these rules are broken all the time.

Provide useful content and provide it fast

Putting useful content on your website and making it find is the single most important requirement for your website to not suck. The most important thing you can do is to think about what information people are actually going to be looking for when they land on your site and make sure that information is easier to get to than anything else. Some specific advice:

Don't alienate newcomers

Make sure people who are coming to your website for the very first time are not left bewildered and confused. Your homepage should have a large, clear easy-to-find link somewhere near the top which lets people know what the website is about - something like "About", "About us", "What is XXX?", etc. There are plenty of websites out there put this link right down the bottom in a tiny font. This sucks.

Essential content for websites about stores

All of the following pieces of information should either be on your homepage, or should be accessible from your homepage by clicking one obvious link:

The majority of visitors to your website will be looking for some of this information: give it to them quickly and easily. They care about these things far more than things like the history of your store or who founded the company. It is ridiculous that somebody should ever be in the situation of not knowing if a store is still open or has closed when they have the store's own website right in front of them, but this has happened to me plenty of times. Use your website to communicate the information people actually want first and foremost.

Essential content for websites about restaurants

Follow all of the advice for websites about stores given above. Furthermore, your entire menu should be available on your website. It should definitely include prices for everything. It would also be really nice if you provided nutritional information.

Essential content for websites about software

All of the following pieces of information should either be on your homepage, or should be accessible from your homepage by clicking one obvious link:

Put dates on pages wherever it makes sense

If your website contains a collection of pages written over a span of time, like blog posts, news articles, reviews of books/films/games/music, technical tutorials, etc. then every individual one of those pages should have the date it was published clearly visible, ideally somewhere near the title. Knowing when a news article was written can provide essential context to understanding whatever it is about. Similarly, tutorials or "how to" documents about software or other rapidly-changing topics can be as good as useless if they are too old, so help people not waste their time by making the document's age clear straight away.

Do not paginate long articles

Many websites break long articles down in to many pages (typically between 3 and 5). It's no secret why they do this - by making people load 3 to 5 pages instead of one, they potentially get 3 to 5 times as much advertising revenue. I am sympathetic to websites costing money to run and needing to recover costs, but this solution frustrates users, wastes their time and encourages them to stop reading articles before the end unless they are really interested. Compromises in user experience may need to be made to pay hosting bills, but a good website degrades the user experience to the absolute minimum required to get the money needed. Use excessive pagination only as a last resort.

Do not speak until you are spoken to

Under no circumstances whatsoever should your homepage begin playing any music or any video of any kind without being explicitly told to. Yes, even if you are a musician or band. Breaking this rule is possibly the rudest, most obnoxious thing a website can possibly do, especially when it's done just for an advert. I and many other people will immediately leave your website if you break this rule unless we absolutely need to keep using it. Maybe your visitor is already listening to music they enjoy when they visit your website, or maybe they are trying to get information from your website while on the phone, or maybe they're in a quiet room with other people in it and haven't muted their laptop because they're not expecting it to make any sound. Never assume that generating any sound is appropriate. Just make it clear where a user has to click to get sound when and if they want it, and then leave it up to them.

Do not put text inside images

Under almost no circumstances should you put text inside an image file, even if it seems convenient. Do not combine photos and captions into a single image! Do not combine maps and address or directions into a single image! When you do this people can't copy that text to the clipboard which means they can't do things like paste text into Google translate so they can understand it, or paste an address into Google maps so they can get directions, or paste anything into an email or instant message so they can share it with people. Don't make it difficult for people to use or share the information on your website! Text in images also won't be found when someone uses Control-F to search your pages for things they are interested in. Don't make it difficult for people to find the information they want on your pages! Furthermore, search engine crawlers will not to be able to read text which is inside an image, so people doing relevant searches may not even see your site in their search engine's result listings. Don't make it difficult for people to find your website!

Do not break the back button

Don't build websites or web applications where the "Back" button does not work in least surprising way possible.

Do not break Control-F

Some webpages use Javascript to let you expand and/or collapse individual sections of the page. When a section is collapsed, it is invisible except for a heading: jQuery's Accordion is an example of the kind of thing I'm talking about. This sort of functionality should be used with caution! The reason is that text inside collapsed sections can be invisible to the browser's Ctrl-F text searching functionality, making it hard to find. In some contexts this may not be an especially big deal, but I have seen Accordioned FAQs, where each individual question is collapsed when the page is first loaded. This is a terrible idea. People often come to FAQ pages from Google search result pages, looking for some very specific piece of information. Do not make it difficult for them to find that information by breaking Ctrl-F. Accordion-like functionality, or anything else which renders parts of a webpage invisible to Ctrl-F, should not be used for pages like FAQs, articles, etc.

Degrade gracefully in the absence of Javascript

In general, it's acceptable to use Javascript to improve or extend your website's functionality. However, in most cases it's not acceptable for your website to depend on Javascript for core functionality. If I visit your website without Javascript enabled it's okay for your website to be uglier or slower or less convenient, but it's not okay for it to outright stop working. Complicated web applications, like word processors etc., are obviously an exception to this rule, but most websites aren't complicated web applications and so they should follow it. I've seen websites where you can't even click on a "search" button or tick a checkbox without Javascript. This is absurd.

Use RSS and/or Atom wherever it makes sense

If your webpage has a "news" section, or any other section which is updated on a regular basis, it should have an RSS and/or Atom feed associated with it. These technologies are over a decade old now. Expecting people to manually check your website for updates on a regular basis in light of this is ridiculous. It will not happen, and you will lose traffic.

Avoid gratuitous Flash

There is a time and a place for Flash. Streaming video and music are examples (although you should keep an eye on HTML5 alternatives and migrate away from Flash as soon as it becomes feasible), and so are games. You can use Flash for these things if you must. Do not use Flash for:

Not only does this needlessly exclude people who can't use Flash and needlessly waste bandwidth and memory of those who can, you are actually breaking your website. Text inside Flash websites often cannot be copied to the clipboard so that it can be easily sent in emails or instant messages. Don't make it difficult for people to share the information on your website! Furthermore, search engine crawlers will not be able to read most of the text on a Flash website, and so people doing relevant searches may not even see your site in their search engine's result listings. Don't make it difficult for people to find your website!

Don't deceive people into signing up to your site

Go to twitter.com while not logged in to Twitter. You could easily be forgiven for forming the impression, based on this page, that you cannot see any content at Twitter without having an account. The only prominent content are the login and sign up forms. You can't see trending hash tags or popular Tweeters. You can't search the website. You basically can't do anything - from that page. In fact, you can use Twitter extensively in a read-only fashion without having an account of your own, all you need are direct links to people's accounts etc. Twitter have very obviously and carefully designed their homepage to trick people into thinking this isn't the case so that they'll sign up. You can tell this is their intent because the one link on the home page which actually leads you in directions of tweets (the "Directory" link) is literally the last link on that page. It's right at the end of a long list of boring things that people usually won't even read to the end of. This practice is dishonest and your website should not make use of it. Either make your content only available to account holders and make that obvious, or make it available to everybody and make that obvious. Don't deliberately try to trick people.

Put non-essential cruft at the bottom of your HTML document

Most websites today have a certain kind of structure. All the actual content that people actually want to see is in one large <div>, the main navigation links to major parts of the site are in another <div> and then there is a huge sea of <div>s containing non-essential cruft. For example, links to every tag that has ever been applied to anything on the site, ever, links to content from every month of every year that the website has been running, links to "popular" or "related" pages at the same site, links to other websites, links to copyright notices, privacy policies and other fine print, etc. The location of this cruft on a reader's screen is controlled by CSS and is not affected by the cruft's location within the HTML document. This means you can put stuff that actually matters - like your pages real content and your main navigation links - at the top, and all the extra crap at the bottom. Doing this has positive consequences for your users. The stuff they actually care about will load faster than the stuff they're probably not going to look at anyway. People who use screen readers or simple and/or text-based browsers won't have to listen to / scroll past several pages of crap to get to the important stuff.