Design to Establish Credibility

Here are some of the cues that visitors use to determine the credibility of a Web site:

• Place phone numbers and addresses above the foldAll the content that can be seen on a screen without scrolling down.. This assures the visitor that there is a real person behind the Web site and that he or she is in easy reach.
• Create an informative and personal “about us.” Your customers want to see the inner workings of a company and are especially interested in learning more about the head honchos. Include employee pictures or profiles. It puts a face to an organization.
• Feature genuine testimonials on each page. This is a great way to show potential customers what your current customers have to say about your organization. Trust is vital, and this is one way to encourage it.
• Feature logos of associations and awards. If you belong to any relevant industry associations or have won any awards, feature them. Not only does this go a long way to establish your credibility, but it will show that you’re at the top of your game and a notch above the competition.
• Link to credible third-party references. This is a way to assert your credibility without tooting your own horn.
• Keep content fresh and updated. This shows that you are knowledgeable and up to date in your industry.
• Ensure that your site is free of errors. Spelling and grammar mistakes are exceptionally unprofessional, and while the large majority of readers may not pick up on them, the one or two who do will question your credibility.
• Include a portfolio of past work. Give your Web site visitors examples of your previous work to show what you are capable of.

Design also affects the accessibility of a Web site. You need to take into account screen resolutions, as designing for the biggest screen available could leave many of your users scrolling across and down to see the Web page. Subtle shading, background colors to text, and fancy fonts can also mean that many users cannot even see your Web site properly.

Figure 13.6

Figures show that screen resolution just keeps getting higher.

Source: Based on information from http://www.w3schools.com.

Using Cascading Style Sheets

A cascading style sheet (CSS) is defined by W3C (World Wide Web Consortium) as “a simple mechanism for adding style (e.g., fonts, colors, spacing) to Web documents.”“Cascading Style Sheets Home Page,” World Wide Web Consortium, June 3, 2010, http://www.w3c.org/Style/css (accessed June 23, 2010).

In the early days of the Web, designers tended to use tables to lay out content for a Web page, and many Web sites still do so today. However, different browsers, and even different versions of browsers, all support code differently, resulting in Web sites that only work on certain browsers or bulky code needed to cope with all the different versions.

The W3C (http://www.w3.org) was created in 1994 and since then has been responsible for specifications and guidelines to promote the evolution of the Web, while ensuring that Web technologies work well together. The Web Standards Project (http://www.webstandards.org) launched in 1998 and labeled key guidelines as “Web standards.” Modern browsers should be built to support these standards, which should vastly reduce cross-browser compatibility problems, such as Web sites displaying differently in different browsers.

Web standards include the following:

• HTML (hypertext markup language)
• CSS (cascading style sheet)
• XML (extensible markup language)
• XHTML (extensible hypertext markup language)
• DOM (document object model)

CSS is standard layout language. It controls colors, typography, and the size and placement of elements on a Web page. Previously, Web developers have had to create instructions for every page in a Web site. With CSS, a single file can control the appearance of an entire site.

CSS allows designers and developers to separate presentation from content. This has several key benefits:

• Sites are easier to maintain and update and are more accessible.
• Content may be updated easily by someone who is not a Web designer or developer.
• Global changes can be applied quickly and easily.

CSS can also do the following:

• Reduce bandwidth and page-loading times
• Increase cross-browser compatibility

To see CSS in action, visit http://www.csszengarden.com, where you can make a single HTML page look very different, depending on which one of the many designer-contributed style sheets you apply to it.

Using a Content Management System

As the name implies, a content management system (CMS) is used to manage the content of a Web site. If a site is updated frequently and if people other than Web developers need to update the content of a Web site, a CMS is used. Today, many sites are built on a CMS. The CMS can also allow content of a Web site to be updated from any location in the world.

A CMS can be built specifically for a Web site, and many Web development companies build their own CMS that can be used by their clients. A CMS can also be bought prebuilt, and there are many open-sourceUnlike proprietary software, open-source software makes the source code available so that other developers can build applications for or even improve the software., prebuilt CMSs available, some of which are free.

A CMS should be selected with the goals and functions of the Web site in mind. A CMS needs to be able to scale along with the Web site and business that it supports, and not the other way around.

Of course, the CMS selected should result in a Web site that is search engine friendly.

Here are some key features to look out for when selecting or building a CMS:

• Meta and title tag customization. The CMS should allow you to enter your own meta tags and fully customize title tags for each page.
• HTML tag customization. The CMS should allow for full customization of HTML tags, such as nofollow linksNofollow is an attribute of a hyperlink, indicating to search engines that the link is not endorsed by the Web site.. See Chapter 6 "Search Engine Optimization" for an explanation of nofollow links.

• URLs. Instead of using dynamic parameters, the CMS should allow for server-side rewriting of URLs (uniform resource locators). It should allow for the creation of URLs that have the following characteristics:

  • Static
  • Rewritable
  • Keyword rich
• Customizable navigation. A good CMS will allow flexibility when it comes to creating the information architecture for a Web site. For the purposes of adding additional content for search engines, a CMS should not require that all content pages be linked to from the home page navigation. This allows content to be added for SEO (search engine optimization) purposes, without adding it to the main navigation.
• 301 redirect functionality. It is imperative that a CMS offers the ability to put in place 301 redirects to prevent penalization for duplicate content on different URLs.
• Customizable image naming and alt tags for images. A good CMS will allow you to create custom alt tags and title attributes for images.
• Robots.txt management. Ensure you are able to customize the robots.txt to your needs, or that this can at least be managed using meta tags.
• Content search. Make sure you are able to include a useful site search.

Figure 13.7

Joomla! is an open-source content management system (CMS). Here you can see how the CMS allows you to manage the articles on the Web site.

Be aware when building clean, descriptive, and dynamic URLs from CMS content. Should you use a news heading (“Storm” in this example) as part of your URL (http://www.websitename.com/cape/storm) and someone changes the heading to “Tornado” (http://www.websitename.com/cape/tornado), this will alter the URL and the search engines will index this as a new page, but with the same content as the URL that had the old heading. Bear this in mind before adding dynamic parameters to your URLs.

Finally, using a CMS that supports standards compliant HTML and CSS is very important—without it inconsistencies may be rendered across various browsers. It also ensures faster loading time and reduced bandwidth, makes markup easier to maintain, supports SEO efforts, and ensures that every single visitor to a Web site, no matter what browser they are using, will be able to see everything on the site.

Technical Considerations

As a whole, technology should act only as an enabler. It should never be a site’s main focus. Here are some technical considerations vital for a good Web site.