During the past weekend my mind was occupied with what to not forget for a site that’s not too far from launching. No, I don’t mean raw functionality. I mean those little things. The things that no client will ask for but most people will be expecting to just be there. Without those things your site would be a big buggy mess so let’s get it clean.
Here is the list!
Working links
Sounds obvious but I noticed that a lot of new sites are failing at this. Of course it’s not enough to just click randomly and have a feeling that you got it covered. Have a real tool (there are free ones) go through your site and report back.
Old content
If the launch of your new site means you are going to dump old content you should make sure you got that covered with some 301. Links can live for a pretty long time in peoples bookmarks and on Google.
Error-pages
Having default server-error pages are simply embarrassing and some people might even think they broke something if they come by one. The default .NET-error-page for one looks like you just got a virus.
A minimum of at least a 404 and a 500-page that fits the look and feel of the site and have some good informative text is a must.
Print-styling
Save the trees. Yep. But as for today your site will seem broken with bad usability if you can’t print it without losing content. Add some print-styling just in case. If you want to go a step further add a print-link on your site and display some tree-saving message when people click it. Or offer to convert the site to a pdf. Yea, dirty. I know. But that is how it is.
Retina
Screens are not what they use to be. Make sure to have it covered. Icons and other images must look crisp. You will be looked down on if they do not. And remember it’s not only min-device-pixel-ratio 2.0. We also have 1.3, 1.5 etc. Read up on it!
Phones and tablets
I don’t care if you are building responsive or an old-fashioned “desktop”-site. People will visit it with whatever device they got. There are no excuses today for not testing on multiple devices.
Browsers
You probably did cover the most common desktop browsers already and hopefully you did match your test with some stats from a current site. But don’t forget the new browsers that are starting to gain popularity. I’m thinking Chrome on iOS and Firefox on an Android-device. Probably these browsers are way outdated when people read this but you get the point. Do your research!
Favicons
Add them all. To rely on the browser default-icon is just unprofessional. An old-fashioned .ico and a .png at least. If you add some for apple-devices and others you are being good.
Meta description
You know that text that shows up on Google beneath the link? That’s hopefully your meta description. If the text makes no sense at all you probably forgot to add one. Because if you didn’t Google pick random (not really) text for you. Worse case the text might look like spam and people will avoid visiting your site.
Page titles
Make sure they are descriptive. The way I prefer it is putting the title of the page first and after that the title of the site.
URLs
Are they logical? The should be readable and not a kilometer long with weird parameters. Try making it as clean as possible.
Sharing on Facebook is another thing that many people think just works out of the box. It doesn’t. To make a shared page looking good and not displaying weird stuff you need to uglify the head of your page with some og. Don’t know what og is? Read up on it!
RSS
Another thing that people think comes by default. If you have any kind of blog or even some news-list you need to make sure there are some RSS-feed that people can pick up. Make sure to not just add it but also test it! A site with updates that you can’t subscribe to in some way is broken.
Robot.txt
This always sounds soo much cooler than it is. Texts for robots! (Huge robot wandering the earth picking up pieces from text with instructions from humans…) Anyway. Make sure this one is correct! It’s important! (As @uppderdog can tell you…)
Updated libraries
Maybe you started working on your site a couple of months ago. Maybe the libraries you included back then where really fresh. Do a double-check that they are still up to date. You don’t want to miss out on bug-fixes and new functionality. And when I’m at it make it a habit to always look for updates every time you touch the site in the future.
Screenreader
Do test with a screenreader. No, it’s not something that you can just skip. If you’re on a Mac you have it built in. If you’re on Windows you can download NVDA for free. No excuses! Test!
View source the site
How does it look? Correct headers? Use of markup? Dirty comments gone? The previous test with screenreader will do a lot to improve the result of this test.
Analytics
A feature yesterday. A must today. Without stats how can you tell how people uses your site? More importantly, how can you improve it? Include Google Analytics or the like. In a smart way.
Sitemap
Another thing that’s easy to forget. I’m talking of an xml sitemap. Help them crawl your site.
Optimize images
Make sure your users aren’t downloading unnecessary things. Smush and optimize where you can. Talk to the people putting in content (if it’s not you) and tell them how to save images in a optimized way.
Minified resources
Kind of like the song of Monty Python every request is sacred. It’s not ok to have multiple scripts and stylesheets. Fix your build-process so that it takes care of concatenating and minifying your resources.
Caching
Add it where it’s logical. Make a plan for it.
Total pages size
Go through your pages. Is it possible to cut down on something somewhere? Did you miss anything?
Performance in general
Check Google Page Speed and YSlow. If the site doesn’t get a good score fix it.
External resources
A lot of cool things (like fonts) can now be included via an external library. You just put a link in the head. Well if you do you better be pretty sure that that resources loads and that it loads fast. Otherwise your users will be stuck with a blank page. We all know that the browser takes a break when it comes by a script in the header. I, personally, wouldn’t want to rely on an external resource being loaded. Please do an extra check for this!
Validate your HTML
Sounds old school? The reason that it will impress other people is, well, old. But validating is still a good tool to spot errors.
Lint your JS and your CSS
Same here. Spot the errors and defects. Fix them.
Colors and contrast
Do some tests. If you can get hold of a real person having some sort of colorblindness and/or bad sight: even better! Don’t forget to do a crappy screen test! It’s real dangerous to have a screen that is a little too good when you are making a site for other people.
Proof read your code
Don’t just clean the site on the outside. Do it inside out. Remove old bad comments. Add new where it’s needed. Make sure things make sense, refactor. Remember that clean and logical code will help your site get fast updates in the future.
Accessibility
Yea, I know lumping things together here. But do a general test. Check alt-attributes. Is it easy to navigate with the keyboard? Do some checks and remember that accessibility changes constantly and it’s not just about a checklist and being trippel-A.
Read the content
Last but not least. Read the content. As many times as you got time. Sloppy and misspelled content is just so euuuuw.
Longest list. But I didn’t just write it for you. I actually wrote it to remind myself.
Let’s act like pros people ^.^