25 Pieces That Make Up a Solid Web Site
When putting together a web site, we’ve put together 25 items that should be a part of every web site. Included are items on basic design, meta information, page layout, alternate content, navigation, page structure and linking. Follow these items and you’ll ensure a well layed out, well built web site for your company. During the month of June, we’ll do an indepth article on each of these aspects helping you get a better understanding of these items and their importance to your web sites success.
- Doctype
When developing a new document, you need to define which version of (X)HTML your document is using. This is a vital piece of information needed by browsers to parse the document.By using a doctype declaration you will make the browser’s job easier, and the browser will use a “traditional” parsing mode, where the understanding of the document is not only faster, it is also consistent and free of any issues that can come up when a doctype is not specified. - Language Declaration
After setting your doctype, you’ll want to declare the language you are using within the document. This tells all browsers, text readers and speech synthesizers what language to read this page in. This is a fairly basic item, but really quite important in the scheme of things and something you should be sure to include. - Title Attribute
Arguably the most important piece of information within a web page. The title attribute is the eye catching headline of the page. Each page should have a unique title that matches perfectly with the content of the page. Optimally, this should be kept to less than 70 characters. - Meta Description
Frequently used by search engines as the detailed description of the page, the meta description tag inside the pages header is an important optimization tool. A well written description will help your site by improving search rankings and click through rate of potential visitors. Take the time to write this description as well as you possibly can. - Meta Keywords
While this is becoming a less important tag to many search engines, it is still recommended that each page should have a set of “keywords” to let robots know what can be found on the page. Keep this short and sweet and don’t spend forever on this tag, but make sure to include it. - Author Declaration
The Author Declaration is a small tag that lets visitors know who is responsible for the document. While not a factor in Search Engine Optimization, this tag is a basic tag that should be added for all web sites. This tag is most important in terms of basic accessibility and usability. - Jump To Sections Navigation
At the core of accessibility is the ability to allow visitors to jump to various sections of the page. At a minimum we recommend three key sections on a page. First, your main navigation, then your main content, then your secondary navigation region. This navigation can be most easily achieved through the use of an unordered list and CSS. This should be the first piece of information available in your HTML. - Logo
The first visual element on your page should be your logo. This placement is generally expected by most visitors, and users also expect it will be a link that will return them to the home page of the web site. Keep the image size small, include alt text and link to your home page. - H1 Tag
Following your logo each and every page on your web site should have a unique header tag. This is the H1 tag and should be used to define the content of the page. This should be displayed as prominently as the site will allow. Ensure that this is the largest font on the page and very eye catching. - Main Navigation – Text Based
Immediately following your logo and header tag should be the site’s main navigation. Best practice is for this to be a text based menu that is accessible to all users and visitors including the search engines. If at all possible, avoid Javascript or DHTML menus for your main menu. Using lists visually managed by CSS is your best bet for optimal internal linking. This practice also allows search engines to easily find the core sections of your site. - Main Content Area
This is the meat of your specific page. Your bread and butter so to speak and the reason why people are coming to the page. You’ll want to ensure this information is well written and that as much of it is text based as possible. Search engines look for content…new content…fresh content…on topic content to rank for specific search terms. Pack this area with as much content as you can, link to other content within your site and build a quality piece of information for your visitors. Remember, in the end, it is solely about your visitors. - Breadcrumb Navigation
Breadcrumb navigation offers the visitor a quick way to backtrack into the higher sections of the site. This should be placed at the top of your main content section and link back to the categories and pages above the one the visitor is on. Home > Category > Sub Category > This Page is the structure we recommend, and as a side note it allows you to increase the internal linking structure of your site which is never a bad thing. - Sub Navigation – Text Based
Should your page lead to more information in the same category, it should contain a sub navigation section using text based links to drive traffic to pages within that section. This area should be used to improve ease of navigation for the site. As a side benefit, you’ll find that this is a great way to build internal linking without appearing spammy. - Valid HTML
Valid HTML is one of the most important things you can do for your web site. Benefits include improved accessibility, usability and cross browser friendliness. While there is some discussion on this, I believe that properly formatted validated HTML can improve your web sites Search Rankings. While not a major factor, every little bit can help. - CSS For Page Layout
With the ever changing world of web today, it is absolutely critical that you begin to seperate content from style and this is achieved using CSS or Cascading Style Sheets. There are a few benefits to moving to CSS for your styling including reducing HTML file size, improving Content to Code Ratio and quick and easy site wide visual changes. - Page Structure
We’ve found it best for both your visitors and search engines if your web site uses a proper semantical structure in your page layout. By using header tags, H1 for example, to break up areas of your page you can guide all visitors to the content they need, while showing the search engines what the important sections of your page are. Done correctly, you will ensure accessibility and usability for your web site. - Internal Linking
Internal linking on your web site is one of the best ways to increase link counts with search engines and drive traffic from established areas of your site to new and informative information. There are three key pieces to internal navigation and success is dependent on these being done properly. You have your Main Navigation, Sub-Navigation and In-Content links. With a little work, this is a great way to gain exposure for new content on your site and build a solid reputation within the search engines. - Alt Attributes for Images
After a decade of web design, I would have thought this was a given for many designers but this is still an item that needs to be addressed. Each and every image on your web page needs an Alternate Attribute or ALT. This lets users know what the image is while it’s loading, or what information is contained in the image if they are unable to see the image due to limitations. - Title Tags for Text Links
While not a mandatory thing, Title Tags for Text Links are a way of improving the accessibility of your site for all visitors. This will give visitors more information on a link before they visit it. At it’s most basic form, it’s an ALT tag for text links. - Contact Information
This is a major thing, that too many sites skip or don’t input enough information. If you are a business, have an address, phone number, and email address at a minimum for people to contact you. You can have forms, and live support if you’d like but you should have some basic contact information available to all people, a PO Box is not enough. - About Information
An About Us section allows visitors to get a basic understanding of what your web site is about, what your organization is about and little history on the team. This should be deep enough that people can feel comfortable with you and be willing to trust you. - Footer Section
Each page should have a footer section. This can contact basic contact info, a link to your sitemap, copyright policy, privacy policy and any other pieces of information visitors might need. This is not an area to dump 100 links to every section of your site as a linking strategy. - Sitemap HTML
This page is a visual representation of the layout of your web site. Allowing visitors to quickly and easily find a specific page on your web site. - Sitemap XML
This file is for search engines. This allows them to get information on the pages in your site including the importance of the page on your domain and the frequency of when this page is updated by you. It is a must have resource and should be a file named sitemap.xml in your root directory if at all possible. - Web Analytics
Each and every page on your web site should have a type of web analytics incorporated. Web Analytics is used to give you a general understanding of how many people are visiting your web site, where they came from, what pages they are visting and how long they are staying. Depending on your specific needs, a well structured Web Analytics package can be used to do some serious analysis of seperate sections and pieces of your web site. - Visual Appeal
Finally, your web site should be visually attractive and appealing to your visitors. Visual appearance is one of the most important things when it comes to successful conversions on a web site. If your web site does not appear professional and trustable, then you are behind the 8 ball right out of the gate.
Through the month of June we’ll be discussing each of these topics in more detail and helping you plan the success of your web projects. Stay tuned.
