Vstaff Scalable Software & Creative Solutions

Vstaff Gets It. Take a peak at the inner thoughts of Vstaff to help you decide whether we get it or not.

50 Tips For Solid Web Design, Development, and Usability PDF Print E-mail
User Rating: / 450
PoorBest 
Written by John Kraft   
Tuesday, 09 January 2007

Down Side: Longer than a top 10

Up Side: Shorter than a top 100

Fact: It's sure to save you time, money, and aggravation, while guiding you toward placing your best foot forward in the development of your Web site. Be informed to make good decisions.

The term "expensive Web site" is relative. Whether you pay $100 for Webdevelopment or $100,000, we think this is worth the read. After all, a penny is a lot of money if you don't have one, and we all want the most bang for our buck!

There are certain things you just learn along the way. Webdesign do's and don'ts learned through years of experience, in the course of professional development, or from just plain trial and error.  Hopefully they become a part of a company’s best practices. The knowledge becomes shared and disseminated across all aspects of the company – good Webdesign becomes part of the company culture.

As Vstaff grew, we found ourselves with diverse employees with varied levels of experience and particular specialties – so we decided to write down our Webdesign do’s and don’ts.
Hey, why not the blog?  Vstaff takes acting in your best interest seriously, so whether you choose Vstaff for your solution or not, just knowing these things will better prepare you in achieving your Webdevelopment goals. If you're working with Vstaff already, don't worry, our developers and quality assurance staff knows these.

This is by no means a definitive list but a set of tips we keep in mind when developing Web sites and balancing our partner's requirements. Many are admittedly polemic, however, different Web sites have different purposes.  The most important thing is to be aware and make the best decision possible for your site.

And in no particular order we have....

1. Make the right impact: You want the visitor to have a good general idea about what your site is all about within seconds. The Web is a vast place that is only a click away, so ensure your visitors you know what you’re about before they go elsewhere.

2. Remember the audience: Creating a Web site can be an exciting time, and there are a lot of things that can bog you down. There are endless amounts of bells and whistles that can be developed. There is a time and place for everything - know your visitors and balance the site to meet their needs or convey your message effectively.

3. Think vertical: Horizontal scrolling has its place and time. Vertical is better for the vast majority of situations. 1024 x 768 is the most widely used screen resolution today. So, ensure you get your important messaging in that space, or develop the site to detect and display the ideal resolution for the surfer.

4. Flash fever: We love flash. They love flash. Everyone one loves flash. Flash will not track statistics as effectively as other technologies. Search engines don't like it and, if poorly implemented, it can annoy users. You should also have a static back up for every flash item in the case of users that disable flash or do not install it. This redundancy will certainly increase the cost of development.

5. Music is for radios: Don't play music, especially on the home page. Many people visit Web sites from work and loud music is a sure way to get that browser window closed in a hurry. 1994 will also call you and say they want their Web site back!

6. Sound is ok: If your site must have audio, or you want it for an effect or an instructional "how to" video, you need to implement it correctly. The default should be set to "off" most of the time with clear controls to enable the sound and control it. Leave the control to the visitors.

7. What you can't see can hurt you: There is so much more to solid Web development than your average Joe (or Jane) might think. This is the difference between the professionals and the hacks.  Make sure your meta content is correctly populated and know if you need 404's (page not found) or 301's (page permanently moved). The importance of relevant description titles for images. These three things alone can have good effects for search engines - you want to be found, don't you?

8. Splash page or plop page: Your visitors come to your Web site for your content, directions to your establishment, or to purchase something. Don't force them to sit through an introduction unless it is really well done to keep their attention - what is on the other side is well worth their time, so don’t hold them back.

9. Text pad is your friend: Front Page and other inexpensive entry level HTML editors create bad code. They might appear to work wonders but the code they generate will be too simple and often incompatible with multiple resolutions, screen widths, and browsers -- first impression is everything. If you want the ability to update the content of your site once it is deployed to a hosting environment, a Content Management System is a major requirement that needs to be communicated. All Vstaff Web sites are developed with a built in CMS.

10. Pop-ups are for children's books: Most users have a pop-up blocker of some type installed and they don’t even know it. Even if you want a user-requested pop up, if it is blocked, it is going to look like your Web site is broken, poorly maintained, or that your developers didn't know what they were doing. We won't do that.

11. Be succinct: This can be hard, but remember your audience has a short attention span.

12. Review and review again: This is especially important for Web development as you want to make a good impression on your visitors. This really reflects on the quality and professionalism of the owner and developer of the Web site.

13. Block spam, not users: If your site has forms or registrations, you use CAPTCHA filters to protect them. Make sure a human can still read the letters and numbers easily. Ensure it is easy to see and provide a button to request a new CAPTCHA image if the user still has troubles reading it.

14. Display link destinations: Ensure your site is developed with clear anchor text and the visitor can clearly see where the link will take them. Leave the control with the visitor. If you hide links for any reason, even if they are really affiliate links, your site loses credibility. Turn your affiliates into positive co-branders.

15. Clearly display PDF files: If you have PDF files within your Web site, make sure they are clearly marked as PDF files. Many visitors will misinterpret the slight delay in starting Acrobat Reader for a shady link, an access attempt, or a bad link and shut down their browsers to leave the site. Web site analytics clearly show this. Leave the control with the visitor.

16. Leave the launching to NASA: Well, NASA and Vstaff. Avoid homepages that launch other browser windows. Users find links that launch new browsers annoying and it adds an unnecessary step for the visitor trying to access your content.

17. You want people that want you: Do not subscribe users without their consent, or trick users into subscribing for something other than what has been represented. This will quickly devalue your mailing list when people start to get things they didn't request. It will also get your IPs banned, or have your newsletter and marketing partners drop you with no refund. A list of people that want what you are sending them is the most valuable thing. Instead of spending time, energy, and money tricking your way into subscribers, spend it getting QUALITY subscribers.

18. Your visitors are not Degama, or Pizzaro: If you have a search mode on your Web site, ensure it searches the entire site to make it easier for your users. There is a reason why Yahoo and Google are the top dogs.

19. Don't over-complicate navigation: Try to avoid, JavaScript drop down navigation. Text navigation links are the best from a number of standpoints. If image buttons are used, ensure they have the proper descriptions attached to them for the search engines and your visitors. Clean and clear navigation that makes it easy for visitors get to where they want to be, know where they are and have the ability to find their way back are priceless.

20. Implement animated gifs correctly: For the most part, animated gifs are tacky and annoying to visitors. They do have their place. Correctly implemented in advertising banners or as a type of flash back up, they can work well and complement the site.

21. Use the footer correctly: Visitors that know exactly what they want or have trouble finding something in the Web site will likely go straight to the footer. At a minimum, provide a link to the home page, major sections of the Web site, and a contact us link.

22. Browser compatibility: Ensure your Web site displays correctly in all browsers, taking into account multiple versions of browsers. This is basic and you should not be charged for it. Not all browsers handle the data and formatting of a Web site the same way. Vstaff uses tools to test the displays and functionalities for each browser with multiple versions being supported.

23. Resolution and monitor compatibility: There are a number of services that will automatically check for browser compatibility. These services will also check your Web site at different resolutions, but it is always good to double check all the CSS classes on an actual widescreen.  Widescreens can cause some weird things to happen. At least 75% of all laptops sold in America are wide screens.

24. Help the Visitor Navigate: Ensure that links change color, or have some type of indicator of where the user is, and when possible within the design, where they have been.

25. Click here is not relevant: Click here is bad -- ensure you make correct usage of anchor text on links. Give the visitor a description of where he or she is going. This has an enormous search engine optimization benefit that adds value to your site.

26. Leave your room messy, not your Web site: Try to avoid banners and flashy items unless they have a specific purpose or add some type of value to the site. SSL certification seals, Hacker Safe seals, Partners, and Technology badges can all add a good perceived value as long as they are deployed correctly. Different situations will dictate page positions. For instance, e-commerce sites want these badges above the fold, others may not.

27. Leave the browsers alone: Do not alter the default function of a user's browser. They have it set the way they like it for a reason. This includes removing the address bar and disabling the back button.

28. Allow right click: Many visitors will want to right click and open items in new windows, or tabs. If you are worried about someone seeing your code, or taking a picture from your site, there are much better ways to deal with that. Leave the control with the visitor.

29. Correct usage of CSS and tables: Use CSS whenever possible. It can be difficult and time consuming to master, but it is the standard for a reason. CSS results in faster load times. In addition, CSS makes maintaining Web sites more cost effective. Use tables only when they are needed.

30. A universal version: Try to avoid making multiple versions of your Web site. It is ok to offer the user options such as low and high bandwidth, but there is no purpose for versions to support 56kbps, 128kbps, 256kbps, flash or html. Try to use auto-detection to render the content appropriately.

31. Attention is a premium on the Internet: Avoid writing novels. Use information snippets that are easy to look over quickly and be succinct. There are times when more content is appropriate, such as a blog, but for most sites, visitors want to quickly find what they are looking for and move on. If you have a lot of content to offer your visitors, make sure it is in a dedicated section.

32. They have to know it's there: Try to make links stick out as links. Let the visitor know they might want to click on it.

33. Eyes should blink, not text: There is simply no reason for blinking text, unless the purpose of your site is to display antiquated, old school ways of getting attention.

34. Keep it simple: Avoid complex URL structures when possible. Focus on keywords and ensure the URL is relevant to the content contained on the webpage.  This will be something that your visitors might notice - for sure the search engines will.

35. Separate content from advertising: No one likes to be confused. Don't mix content with advertising -- it looks cheap, and the vast majority of visitors will see it for what it is. It will only lessen the credibility and professionalism of your Web site.

36. Make contact easy: Always include contact information that works and is easy to find. People that call disconnected or unanswered numbers will more than likely be gone forever. If you have a small business and can't attend to your phones every minute, or afford a service that's ok, just let visitors know it upfront and they will respect you more for it.

37. Avoid JavaScript links: JavaScript links can be problematic for site visitors. JavaScript can also be disabled in their browser settings. This can be a challenge when using the AJAX technology.

38. There is more to the IM ages than what you see: It is time consuming but important to ensure that you make the correct usage of the ALT and Title attributes for your images.  This will help blind users understand your site in addition to having an important positive effect for search engine optimization.

39. Don't force users to register: Try to focus on having a quality site with good relevant content.  If the user likes what you are about, they will contact you. Needlessly forcing the user to register for something might make them just go elsewhere. If a user is required to register, do your best to make sure what they register for is worth it.

40. Drops down are no good: A visitor should see all the navigation all the time. They should be able to look around and orient themselves. Drop down menus are not new, they just have a tendency to confuse a large amount of visitors.

41. Know the font: Make sure your developers know what safe fonts are. Try to always use one of the default safe fonts that are pre-installed on most operating systems. Your visitor comes to you for content, so make it easy for them to read. Off the wall fonts are often hard to read and well, they don't look good.

42. Small fonts strain eyes: Avoid using font size as a substitute for trimming down content. You want to ensure that the majority of your visitors have a pleasurable experience at your site and don't have to work or strain to get it.

43. Bad color combinations: Try to avoid bad color combinations, or harsh colors. Design your site so that things go together and complement each other. Create an atmosphere that conveys a mood or a feeling through your use of colors.

44. Don't guess at SEO: If you think reading a few books or browsing the Internet for an hour is going to make you an SEO expert, you are dead wrong. SEO is a specialty in itself. Most Web development companies and individuals have varying degree of knowledge and expertise that can augment the services of an SEO specialization company, but very few can implement it to the point that it seriously impacts your page ranking. Bad SEO can get your site banned from search engines - good luck resolving that. This is the only thing that Vstaff subcontracts - a Dutch company with proven results.

45. Telling search engines you are there: Hmmm, doesn't this defeat the purpose of a search engine?  Companies that charge a low or nominal fee for submitting your site to search engines or are almost a complete and utter waste of money. Your site will be naturally found in a few weeks, if it was built by a semi-competent person. What page you will be listed on is another story.

46. Know your site: Know the technologies you are using in the development of your site. Be informed on how the different technologies interact with each other, and their dependencies.  Different technologies have different native operating environments, limitations, and a number of other dependencies. If you don't know these things, make sure your developers shoot straight with you.

47. Americans with Disabilities Act: If you are developing a Web site for a state or government institution, be sure you are familiar with the Americans with Disabilities Act, and how it pertains to Web development. There are normally special color combinations and requirements for these sites.

48. Visitors from mobile devices: If you are lucky enough to have people attempting to visit your site from their mobile devices in the middle of their busy days, make sure it works on a mobile device. This is commonly overlooked by restaurants and small businesses but these are the types of content that people are trying to find on the go.

49. Accomplish the mission: Be reasonable about your Web development. Take into account budgets and timelines. Divide your Web development into phases if necessary to meet your budgeted timeline. Know your own technical limitations and that of your developers. You don't want your site to become one of the many half-developed incomplete sites that litter the Internet.

50. Avoid super long pages: That is unless there is relevant and interesting content on them or they exist in a blog environment where people are prepared to deal with longer articles and lots of information. If you are reading this last tip, I guess we did an ok job. :)

This is by no means a definitive list but rather a set of tips we keep in mind when developing Web sites and balancing our partner's requirements. The most important thing is to be aware and make the best decision possible for your site.

Last Updated ( Wednesday, 21 November 2007 )
 
Adobe Java PHP Macromedia Flash MySQL HACKER SAFE certified sites prevent over 99.9% of hacker crime. Network Solutions VisiStat