15 Essential Checks Before Launching Your Website

Advertisement

Your website is designed, the CMS works, content has been added and the client is happy. It’s time to take the website live. Or is it? When launching a website, you can often forget a number of things in your eagerness to make it live, so it’s useful to have a checklist to look through as you make your final touches and before you announce your website to the world.

This article reviews some important and necessary checks that web-sites should be checked against before the official launch — little details are often forgotten or ignored, but – if done in time – may sum up to an overall greater user experience and avoid unnecessary costs after the official site release.

Favicon

A favicon brands the tab or window in which your website is open in the user’s browser. It is also saved with the bookmark so that users can easily identify pages from your website. Some browsers pick up the favicon if you save it in your root directory as favicon.ico, but to be sure it’s picked up all the time, include the following in your head.

<link rel="icon" type="image/x-icon" href="/favicon.ico" />

And if you have an iPhone favicon:

<link rel="apple-touch-icon" href="/favicon.png" />

Description

Titles And Meta Data

Your page title is the most important element for SEO and is also important so that users know what’s on the page. Make sure it changes on every page and relates to that page’s content.

<title>10 Things To Consider When Choosing The Perfect CMS | How-To | Smashing Magazine</title>

Meta description and keyword tags aren’t as important for SEO (at least for the major search engines anyway), but it’s still a good idea to include them. Change the description on each page to make it relate to that page’s content, because this is often what Google displays in its search result description.

<meta name="description" content="By Paul Boag Choosing a content management system can be tricky. Without a clearly defined set of requirements, you will be seduced by fancy functionality that you will never use. What then should you look" />

Description

Cross-Browser Checks

Just when you think your design looks great, pixel perfect, you check it in IE and see that everything is broken. It’s important that your website works across browsers. It doesn’t have to be pixel perfect, but everything should work, and the user shouldn’t see any problems. The most popular browsers to check are Internet Explorer 6, 7 and 8, Firefox 3, Safari 3, Chrome, Opera and the iPhone.

Description

Proofread

Read everything. Even if you’ve already read it, read it again. Get someone else to read it. There’s always something you’ll pick up on and have to change. See if you can reduce the amount of text by keeping it specific. Break up large text blocks into shorter paragraphs. Add clear headings throughout, and use lists so that users can scan easily. Don’t forget about dynamic text too, such as alert boxes.

Links

Don’t just assume all your links work. Click on them. You may often forget to add “http://” to links to external websites. Make sure your logo links to the home page, a common convention.

Also, think about how your links work. Is it obvious to new users that they are links? They should stand out from the other text on the page. Don’t underline text that isn’t a link because it will confuse users. And what happens to visited links?

Links

Functionality Check

Test everything thoroughly. If you have a contact form, test it and copy yourself so that you can see what comes through. Get others to test your website, and not just family and friends but the website’s target market. Sit back and watch how a user uses the website. It’s amazing what you’ll pick up on when others use your website differently than how you assume they’d use it. Common things to check for are contact forms, search functions, shopping baskets and log-in areas.

Graceful Degradation

Your website should work with JavaScript turned off. Users often have JavaScript turned off for security, so you should be prepared for this. You can easily turn off JavaScript in Firefox. Test your forms to make sure they still perform server-side validation checks, and test any cool AJAX stuff you have going on.

Javascript

Validation

You should aim for a 100% valid website. That said, it isn’t the end of the world if your website doesn’t validate, but it’s important to know the reasons why it doesn’t so that you can fix any nasty errors. Common gotchas include no “alt” tags, no closing tags and using “&” instead of “&amp;” for ampersands.

Valid

RSS Link

If your website has a blog or newsreel, you should have an RSS feed that users can subscribe to. Users should be able to easily find your RSS feed: the common convention is to put a small RSS icon in the browser’s address bar.

Put this code between your <head> tags.

<link rel="alternate" type="application/rss+xml" title="Site or RSS title" href="link-to-feed" />

RSS

Analytics

Installing some sort of analytics tool is important for measuring statistics to see how your website performs and how successful your conversion rates are. Track daily unique hits, monthly page views and browser statistics, all useful data to start tracking from day 1. Google Analytics is a free favorite among website owners. Others to consider are Clicky, Kissmetrics (still in closed beta yet), Mint and StatCounter.

Analytics

Sitemap

Adding a sitemap.xml file to your root directory allows the major search engines to easily index your website. The file points crawlers to all the pages on your website. XML-Sitemaps automatically creates a sitemap.xml file for you. After creating the file, upload it to your root directory so that its location is www.mydomain.com/sitemap.xml.

If you use WordPress, install the Google XML Sitemaps plug-in, which automatically updates the sitemap when you write new posts. Also, add your website and sitemap to Google Webmaster Tools. This tells Google that you have a sitemap, and the service provides useful statistics on how and when your website was last indexed.

Analytics

Defensive Design

The most commonly overlooked defensive design element is the 404 page. If a user requests a page that doesn’t exist, your 404 page is displayed. This may happen for a variety of reasons, including another website linking to a page that doesn’t exist. Get your users back on track by providing a useful 404 page that directs them to the home page or suggests other pages they may be interested in.

Another defensive design technique is checking your forms for validation. Try submitting unusual information in your form fields (e.g. lots of characters, letters in number fields, etc.) and make sure that if there is an error, the user is provided with enough feedback to be able to fix it.

404

Optimize

You’ll want to configure your website for optimal performance. You should do this on an ongoing basis after launch, but you can take a few simple steps before launch, too. Reducing HTTP requests, using CSS sprites wherever possible, optimizing images for the Web, compressing JavaScript and CSS files and so on can all help load your pages more quickly and use less server resources.

Besides, depending on the publishing engine that you are using, you may need to consider taking more specific measures – for instance, if you are using WordPress, you may need to consider useful caching techniques to speed up the performance.

Yahoo Best Practices

Back Up

If your website runs off a database, you need a back-up strategy. Or else, the day will come when you regret not having one. If you use WordPress, install WordPress Database Backup, which you can set up to automatically email you backups.

Print Style Sheet

If a user wants to print a page from your website, chances are she or he wants only the main content and not the navigation or extra design elements. That’s why it is a good idea to create a print-specific style sheet. Also, certain CSS elements, such as floats, don’t come out well when printed.

To point to a special CSS style sheet that computers automatically use when users print a page, simply include the following code between your <head> tags.

<link rel="stylesheet" type="text/css" href="print.css" media="print" />

Download the Ultimate Website Launch Checklist!

Just recently Dan Zambonini has published a very detailed checklist that covers both the pre-launch and the post-launch phase of the web site life cycle. Among other things his Ultimate Website Launch Checklist contains checks related to content and style, standards and validation, search engine visibility, functional testing, security/risk, performance and marketing.

Ultimate Check List

The pdf-version is available as well. The checklist is a very useful reference that may help you in your daily projects and will help you to prevent errors and mistake once the site is released.

You may also want to consider the Quick Usability Check List by David Leggett that highlight some of the more common problems designers should address on their own sites in a Usability checklist of sorts. Not all of these items will apply to every website, these are just suggested things to look for in your own site design.

Quick Usability Check List

What other checks would you list?

Make yourself a to-do list and keep it handy to check over before making any website live. Are there any other points you would add? Share them in the comments!

(al)

Lee Munroe is a freelance web designer from Belfast. You can see his other writings on web design on his blog.

  1. 201

    Very helpful post.Thanks

    0
  2. 202

    I’m looking for a internet marketing forum that has no spam on it and that has an active community. I’ve tried several in the past such as DP and they just have to much spam. Can anyone suggest an internet marketing forum that has no to very little spam and helpful insightful internet marketers on it? Thanks!

    -3
    • 203

      Catherine Anderson (@SparkySparkler)

      May 7th, 2012 6:05 am

      I would try the marketing groups on LinkedIn – I find those very useful and full of professionals who are all there for the same reason – to learn and contribute.

      0
  3. 204

    Nice post, I guess it covers most of the technical and usability problems. But there’s one more thing to plan maybe : you should have a marketing plan before even thinking about putting your website online.

    +1
  4. 205

    You forgot server load test… need to emulate traffic…

    +1
  5. 206

    Still accurate! + cross platform + cross resolution check!

    0
  6. 207

    Thanks for the great checklist. I’m getting ready to launch my first website sometime this month. I’m a novice, so this is very helpful.

    0

  1. 1

    Over 30 million people have downloaded the NoScript extension for Firefox, people working in government buildings or secure corporate offices often have javascript disabled by default, most search engine spiders are analogous to users browsing without javascript, etc.

    You can’t simply say something as baseless as “it’s 2009! who doesn’t have javascript enabled” if you are serious about making your site accessible to as many people as possible using different technologies.

    +3
  2. 2

    Incredible how some people cannot see past their ignorance.

    Sites should work without Javascript. Maybe not every little feature, but main content of the site should be accessible without Javascript. Main menu that relies on JS is fail. Search that relies on JS is fail. Etc.

    Why?

    Because most mobile phones today do not support JS, or at least complex JS. There are TONS of users, at least in Europe, that check some small info on website via mobile phone. I book tickets for cinema via mobile phone. I do not BROWSE that website, because it is impossible, but i just manage somehow to click through to book tickets. If at any point JS is required, i would not be able to do so.

    Also, on multiple occasions, i used mobile phone to visit website of some company to check their contact phone number / call center. I did not BROWSE website with mobile phone, rather i just checked something really fast.

    So stop that nonsense complaining about good point SmashMag made, and realize that if you can reach 3% more of people with your website – that’s 3% more of potential revenue for site’s owner at the end of the year.

    +3
  3. 3

    Another smashing magazine post to pass on to my bosses to show how we should be doing things!

    +2
  4. 4

    Thanks for the 9rules screenshot! When it first popped up in my RSS reader I thought you were showing 9rules as an example of a site that didn’t do something right and I got real nervous, then I clicked over to read the article and I saw that wasn’t the case. Good thing!

    +2
  5. 5

    Having a favicon in place for your site is important. Not *the* most important thing, but definitely something you don’t want to overlook. Not having a favicon in place will cause a 404 error in many browsers. And the 404 error has a negative impact on load time. Browsers handle favicons in different ways.
    IE7 will usually (but not always, for reasons unknown) follow the link in the head and download the image as specified. It’s best to actually include a second link in the head for IE: . If IE7 finds not link(s) in the head, it will try to fetch /favicon.ico.

    IE6 will ignore the link(s) in the head and always try to download /favicon.ico, but only actually show the icon after the website has been added to the Favorites of the browser. Weird stuff, but fits the profile…

    Firefox is a good boy: look for link in head and download the .ico file in the link. If no link is present, try to fetch /favicon.ico.

    IE browsers will not show .png files as a favicon. Only .ico files.
    So this for example will not work in IE:

    Last note: webservices such as Delicious and Google Toolbar will always look for /favicon.ico and ignore the link in the head.

    Conclusion: put the favicon.ico file in the root folder of your site and place two link tags in the head.

    +2
  6. 6

    Great ;-)

    +2
  7. 7

    This is an excellent list. If every site did these things first, the Internet would be a much happier place.

    One comment: Progressive enhancement might be a better approach than graceful degradation. The two are really the same thing (making pages look good in trimmed-down browsers), but take different approaches. Graceful degradation designs an insanely awesome site for the latest browsers, then hacks the stylesheets to not look awful on older browsers. Progressive enhancement designs a tasteful site for basic browsers, then hacks the stylesheets to look insanely awesome in the latest browsers. This way, backward compatibility is a step along the way rather than an afterthought.

    +2
  8. 8

    All this talk about functions disabled in the browser. How about checks for human users with disabilities? Color blind testing, vision impaired users?

    +2
  9. 9

    Other items on my list include:

    - Checking the layout on small screens
    - Testing Microformats if used
    - Minifying CSS/js
    - Testing accessibility with Total Validator, aDesigner, WebAIM etc.
    - Checking colour contrast
    - Checking for unused selectors with Dust Me Selectors (FF extension)
    - Checking robots.txt
    - As well as Google Analytics, also signing up for Google Webmaster tools, Yahoo Site Explorer, and Live Webmaster Center

    +1
  10. 10

    You can detect if a user has JS turned off and serve them alternate content, and this is exactly what I do for a website that relys heavily on JS.

    For pages that absolutely won’t function without JS, the user gets a nicely designed and worded error message and not simply a broken page.

    +1
  11. 11

    Amitay Horwitz

    April 8th, 2009 12:42 am

    I would also advise to optimize -> minify scripts and css, gzip etc.
    http://developer.yahoo.com/yslow/

    +1
  12. 12

    For testing your site’s performance, you can use the free Page Test tool – this is a web based application: type in your site’s URL and a remote machine starts Internet Explorer, measures how long it takes to load the web page and presents results.
    You can test from two locations to see load times from different parts of the world:
    East Coast USA
    New Zealand

    +1
  13. 13

    Thank you, this is very useful.

    +1
  14. 14

    Just a small thing, but if you are spending time and money launching and promoting the site/URL, it helps to set yourself up to catch the inevitable mistakes people make, so:
    - set up DNS so that domain.com, w.domain.com, ww.domain.com etc work as well, preferably using 302s to correct them gently.
    -If you have a server that is case sensitive, be consistent in how you use case, and work out what happens when people type things in the ‘wrong case’.
    - On larger sites, if the budget allows, register similar or common typo domains and use 302s as well. This not only helps get users who mistyped, but forestalls competitors or unrelated sites from getting your traffic by accident.

    +1
  15. 15

    thanks so much that

    +1
  16. 16

    Great idea for a post! This is very useful and informative.
    Thanks Lee

    +1
  17. 17

    Shouldn’t the iPhone apple-touch-image be a png file? I’ve never seen an ico file working on an iPhone before.

    +1
  18. 18

    This is a fantastic post! I strongly feel that there needs to be a post specifically on the speed optimization section of this checklist. There are so many loose resources out on the net, and to pull that all together would be great. Otherwise, this is a great complilation, Thanks!

    +1
  19. 19

    SmashingMag, you never cease to amaze! Thanks for the awesome post!

    +1
  20. 20

    These things may come under proof read, but still good to mention:
    * check for junk data and meta data, inserted by the CMS/application/developer/designer
    * double check that contact info is correct and forms reach the correct mail id.

    For optimizing YSlow (http://developer.yahoo.com/yslow/) and http://www.smushit.com are worth mentioning.

    And John Faulds’ comments are notable.

    +1
  21. 21

    Just to clarify, this isn’t a list in order of importance, it’s simply a quick checklist as a reminder.

    Agreed all of these things should be checked throughout the process (along with a lot of other checks) and not left to ’5min before going live’. This is just a useful final reminder checklist to make sure everything has been covered in case there is something you overlooked.

    To back up gareth hunt’s point, unfortunately there are users who do have JS turned off even in this day and age. Usually coming from government buildings where they have it turned off to stop pop-ups and the likes. Other platforms, e.g. some mobile phone browsers, may not support JS also so it’s important to make sure you have these scenarios covered.

    @Elijah: You’re right, well spotted. The favicon for iPhone should be favicon.png

    Thanks for all the comments.

    +1
  22. 22

    I agree – graceful degradation is dead. I use the mighty noscript addon myself but when something doesn’t work – I turn it on. 95% are using JS by default, the 5% that doesn’t are most likely doing that in a similar aware fashion. Still.. Basic stuff like registration and navigation should be working anyway but not because of the end-user, but because of the site’s best interest, that’s correct. It’s the same rule we apply to the IE6-compatibility right now – “let them know it’s not worth using it”. And of course Steerpike is right: that’s an early development stage, not final. Same with optimization, etc. I agree with you t in most cases except using lorem-ipsum (not the idea behind it), which should rather be replaced with some real text likely to appear in particular areas (which – yeah – is a must-do).

    Daemon: should we really care about the mobile phone users? NO – UNLESS they’re an important part of your target. In most cases they are not. In addition, soon all mobile phones will have webkit-based browsers or some IE and then what? You’ll be rewriting your sites, adding tons of new stuff you suddenly realized could or should be there from the beginning? Creating mobile versions, if you really care, is way better. You make them download much lighter, faster, minimalistic version with the most important stuff while not limiting the whole projects because of your naive idealism. “Equal to everyone” – we’ve seen countries falling because of this idea. It’s impossible to make everyone comfortable and usually it’s not best to. There is no general rule like that – it’s about every project individual needs. Will you throw out all your graphics because I’m gonna watch your site in some text-based phone? You get the point. Everything progresses. If you watched the mobile phones market closely, you’d see soon it won’t really matter. 0,5ghz cpus are standard for PDAs now, next year it’s gonna be 1ghz. And as for normal phones – again, mobile versions are best the solution. And if you wanna use your phone for web most often, you’re more likely to have an iPhone, HTC, or whatever PDA already. If not, then you’re an idiot. You don’t buy acoustic guitar to play heavy metal.

    +1
  23. 23

    If you don’t want to find yourself in court, ensure that you properly cited copyrighted and trademarked products! And if you think that you can use the little icon–that really well-known icon–to indicate the flavor of the document that the user is about to open, you’d better read the fine print on the owner’s website. If you can’t find it on their site, shame on them, but CALL their legal department to get a very clear directive.

    And you’d better be darn sure that your company either created their own images or appropriately paid for images from a stock shop…. Or be prepared to receive a bill from them–and yes, they do that.

    Keep all of this documented so that if anyone from your legal department comes knocking on your door, you’ll have that CYA you deserve.

    +1
  24. 24

    Great list! But I really don’t think validation is necessary. If it works in all the browsers (IE6 – 8, FF, Chrome, Safari, Opera, etc) then you’re fine. Using Strict doctype has its quirks, like you can use _target in links. What’s the deal with that? Screw validation. And, I’d add a focus on security. Preventing XSS, injection, overflows, etc.

    +1
  25. 25

    Marcus Nelson

    April 8th, 2009 10:58 am

    One part is missing from this article —
    Create an easy way to get feedback from users & thrive off that feedback. Nothing will build your reputation faster then showing users that you’re listening and building for them!

    +1
  26. 26

    Great list!
    I was suprised that so many people are defensive of javascript. I guess I’m one of the “1 or 2″ people that leave JS turned off. This stops new window pop-ups, and some annoying windows that ask if you’re sure you want to leave the site. Sometimes I’ll turn JS on if a site needs it to function, but I can’t stand sites that don’t work without JS or Flash enabled and don’t provide alternatives.

    +1
  27. 27

    Nice post, I guess it covers most of the technical and usability problems. But there’s one more thing to plan maybe : you should have a marketing plan before even thinking about putting your website online.

    +1
  28. 28

    You forgot server load test… need to emulate traffic…

    +1

Leave a Comment

Yay! You've decided to leave a comment. That's fantastic! Please keep in mind that comments are moderated and rel="nofollow" is in use. So, please do not use a spammy keyword or a domain as your name, or it will be deleted. Let's have a personal and meaningful conversation instead. Thanks for dropping by!

↑ Back to top