You’ve completed your design, coded all the pages and implemented the content management system… now what? Launching a website involves many details that are often (in my case) forgotten in the last minute scramble to finish before a deadline. I thought I would share this list of things to remember before launching a website.

1. Cross Browser Testing

Testing in Different Browsers

Browser testing is quite possibly the least ‘fun’ aspect of web design. But, like the dentist its a necessary evil. As web designers we need to test our sites across several browsers depending on what your target audience uses. Make sure the site appears relatively the same and functional in the lesser-privileged browsers.  Consider using progressive enhancement for browsers that can handle nifty things like border-radius and text-shadow.

Browser Testing Resources:
Adobe Browserlab
NetRenderer

2. Set Up Web Analytics

Web Analytics

Web Analytics can provide you with a wide array of statistics and information about your website and its users. I use Analytics to track searches, popularity of articles and to watch users visit the website in real time. Analytics can also be used to inform future design iterations and help make decisions based on visitor behavior.

Web Analytics Resources

Google Analytics
Woopra – Live web analytics.
Crazy Egg – Heatmapping Analytics

3. Create a Favicon

Favicon

Take your branding one step further and create a favicon. This helps with adding a little pizzaz in the menu bar next to your URL. It also helps with reinforcing your brand image when users bookmark your page.

Favicons should be simple and memorable. In the past I have used ‘N’ of my logo as a favicon. I have also used this icon on twitter and as my gravatar for posting comments on other blog sites. This may not apply to all websites you make, but its a great idea to be consistent.

Favicon Resources:

Favicon Generator
How to create a favicon

4. Removing Borders for Links and Images

Unless the default border is part of your design its a good idea to remove the outline and border from links and images. This can be done with a few simple lines of CSS:

img a { border:none; }
a { outline:none; }

5. Testing Forms

Testing forms

Sometimes I get so into getting the design to work across all the browsers that I forget to actually TEST the contact forms. Another thing I forget to do is specify with the client what email you want the results of the contact form to deliver to.

6. Spell Check!!!!

Spell Check

Spelling is my downfall as you have probably gathered by now. Always take time to spellcheck and re-read emails and text on websites. Heck… we should be reading out clients copy, not just cutting and pasting it into the CMS or webpage. Catching grammar or spelling errors in your clients copy it just one way to go the extra mile.

*NOTE* I’m not talking about going all out proofreading on copy, but if you catch something… let them know, or fix it. They will be happy you did.

Spelling Resources:
Web Based Spell Check

7. Check for broken links

In the rush of finishing the design and functionality of a website broken links are often overlooked. Taking a quick visit through all the page of the site can prevent this. Another option is to use the built in link checker in Dreamweaver. With your website open go to File > Check Page > Links. There are also several 3rd party link validators on the web.

Broken Link Resources:

W3C Link Checker

8. Meta Information

Don’t forget to add meta information to each page of the website. Although I’m not sure how much of an effect on SEO this has, it couldn’t hurt to read through your clients content and pick out a few keywords and throw in a page title and description. It’s also a good idea to have these keywords in the heading tags as well.

9. Set up a 404 page

404 Page Not Found

Sometimes broken links are unavoidable. In that case you need to have a backup plan. Setting up a 404 page ensures that users have some sort of direction if they follow an old or broken link.

404 Page Resources:

Smashing magazines list of beautiful 404 pages
404 Best Practices from CSS-Tricks
How to set up a 404 page on a static site – CSS-Tricks

10. Setting up 301 redirects

If you are re-launching a website you need to set up redirects for the old URLS. Its literally quite as simple as adding a link to your .htaccess file like so:

Redirect 301 /oldpage.html http://www.yoursite.com/newpage.html

What Else?

If you see something missing from this list leave a comment and let me know! I’d love to hear about common things you tend to forget when launching websites.

Now if you will excuse me I have some websites to go update! :)

Pass 642-691 exam with high quality JK0-702 prep materials and HP2-E31 guides available on Testking.

[61] Comments
Posted in design, Web 2.OH, Web Design