The internet is full of websites in each category that you might think of. Each one is unique in its own, its markup, content, functionality and features. Although each one differs in many ways, there are certain things and specific needs that should be dealt with in regularity regardless of their distinction. These common denominators among websites are the basic elements that make them function and behave in compliance to the user’s preference over the years. These are the basic things any website needs in order to function well.
Good Navigation Menu
Every domain in the internet that has more than one page and a lot of menus needs navigation. This is clear and evident fact for a website, however, there are sites that you often encounter while browsing along the internet that is inaccessible because they require such things as Java Script or images for it to function. They call it enhancement on the part of the web owner, though not a requirement. Easy and accessible navigation menu is a must for every website.
There are certain things to consider when building a proper and workable navigation menu such as the link styling, the focus, the hover and the active pseudo elements. Also, the uses of semantic lists are being utilized to properly organize links into menus.
Well Formed Title
A meaningful title rest on the title element itself, it is the word that is shown in the title bar of your browser. The standard set up should be the content title comes first before the site. This will help searchers to look for what they want within the title itself and not the title of your site repeatedly appearing. Each page should have its own title for the effective utilization of the title element.
<title> Twelve Things Most Sites Need | Web page Design For Designers © </title>
A hyphen separator is preferred, but the vertical bar or pipe may be used as well.
The Contact Method
Putting your email address on your site is not advisable, as it is not always that secure. But it is important to offer a means to contact you and the right way to do to be of service to your visitors. To implement this, it is better to offer an address and a phone number. Or better yet, a contact form is a very good option instead of the link mailto: email. Since most of your visitors are people up to no good or robots, it is best that you use a very secure contact form. Some say that the client-side spam filtering reverses the need to protect your email address on the internet, but still your email address can still be produced and be used altogether. Nobody still wins this war, not as long as the most common email account names like contact@domain.com or admin@domain.com may be used as soon as you register a domain name. This does not mean we should take it easy.
Existence of a Site Map
Not all visitors of a site are given a site map and not all sites require such. If you have a site, say with five pages, that is clear and consistent and have an easily navigated menu, you do not probably need a site map. But normally a site doesn’t end in five pages. It does multiply over the years and of course, new needs will sprout and will further inspire new pages or even applications. It is better to start your site map as early as possible or add it to your site right from the start. At first, link your site map from the footer and then you may move it to a noticeable area as your site expands, since this link will be more useful in the end to more visitors. On small sites, the site map is advisable to be incorporated into a “site help” or a “site info” page, thus the copyright statements, accessibility and the privacy policy, among others are indicated in the same page.
Making a site map is simple as making a web page with a not so order list. Maintaining it is also simple by adding a new list item whenever a new page is added. The most difficult part is remembering to update the site map. Don’t fret about it. Applications like WordPress, for instance, gives choices to the users to make everything from simple to complex site maps with just a simple function call. Plugins in WordPress are available to make the process easy for beginners. If you want to go up the next level, you may also offer an XML site map, but actually it is an HTML site map that is referred to. Bear in mind that people should come first, and not the spiders or robots.
Accessibility in a Passive Manner
This is a most important aspect of a website: your website should be accessible whether it is for yourself or your visitors. If you plan to satisfy your very own needs, your visitors will benefit as well. Therefore, it is all for the better.
Markup in a Standardized Manner
Making use of the correct markup for its selected purpose and without going over by widening its usage, it is very useful indeed not only for its usability and accessibility, but also the practice of making use of a semantic markup. This will ensure forward compatibility. Better use of the CSS and valid HTML 4.01 or even the XHTML 1.0/1.1 if you are planning to build a new website for your client and he will appreciate it.
A Functionable Page Weight
Encountering the internet during the past years was a very miserable experience. Most people before use dial-up and require always an add-on or plugin to make a site work. Well this has been upgraded on some levels. Most of the operating systems nowadays are pre-loaded with all the needed support so the need for the add-ons and plugins were lessened. But noticeably some people still use dial-up. So if you have a sight with lots of heavy graphics, it is going to take some time for those people with dial-up to open your site. You’ve just got to keep the weight down.
You should always consider your visitors and how they navigate your site. Let your visitors navigate to the graphics and do not offer such on the starting page load. Better warn the users also that something big is coming. It is just fair to give them a choice if they want to opt out of the opportunity to do so.
Maybe it is better to have a goal of upper limit of 100kb per page of embedded images and combined background. You can purchase more for a 100kb. To get the most out of what you are getting, lessen the number of images, compress your files, optimize the images, and just pre-size embedded images for their location. It is safer to add the height and width attributes to the img element. It is wrong to have images with the size of a thumbnail that are 900kb with no styles at all.
Helpful Error Page
Aside from offering a site map to pave the right way for your visitors, you may offer an error page with a friendly style or even pages if more errors are covered. The error page should offer the link to your home page, or even a navigation menu, or even a link to your site map. It is also possible, if you want to put on one page all your navigation tools. The perfect 404 page offers a site map on the page, contact information, search and much more.
This is an easy thing to do, and you may ask your web hosting company about this. The custom error pages may be inquired from them since you want to give something useful and the most default, and even the styled server error pages are not really that helpful at all.
Good Headings
Heading are important and the use of it is logical. Styling such is also wide open; better use your imagination. The headings offer semantics and ordering, a benefit in search indexing, separation between the sections, greater access, and also a navigation source for some of the users of assistive technologies like the screen readers.
Presence of Jump Links
Skip or jump links are very useful especially to those who are making use of a pointer or a mouse. A jump link gives the users the opportunity to jump down the page to the navigation or content, bypass the long or even the redundant sections, access the help content or even jump back up the webpage if you are considering a top link or back to the menu link a jump link. It is a repetition of the browser behavior offering links such as these one.
If you are going to offer jump links on your site, make these links visible, although this is not necessary. There are other ways not to show jump links while maintaining still a high accessibility level and a high usage percentage of the users. Take note that if you display the jump links, it will increase the percentage to 100.
Focus Styles
There are times when you will use the keyboard on the web, and bounce from one link to another and tab from one page to another page following the natural order flow of the page. But, at times, depending on the site, this is really difficult. For instance, you will be tabbing along, and then all of a sudden, you are lost and you don’t know where you are on the page. The reason may be the developer was not able to offer the simplest accommodation of all: link focus.
To offer a link focus, nothing more is involved than a simple style sheet entry, such as this:
a:focus, a:active { color : blue; background-color : green; }
Internet Explorer makes use of the a:active and provides the when-activated styling on other graphical browsers. You can get more creative, but the ones stated above may help your web pages be easier to navigate for keyboard users.
Robots.txt File
Robots.txt file is considered so ordinary but is very helpful to have one. It gives out instructions to honest indexing spiders and robots like the GoogleBot, stating that they need to avoid certain directories you don’t really want.
Some people thought that if they will disable the right-click on their sites they will stop the people to copy their images from their site. That can’t be done since they do not have a file of the robots.txt excluding their images directory. Robots.txt file are easy to create and there are tools to help you make one.
You May Also Be Interested In:





{ 9 comments… read them below or add one }
A great reminder, my mistake is not putting a site map when needed and an error page.
Very handy infomation thank you the section “Markup in a Standardized Manner” I take you are talking about e.g. w3validator ??
Nice article, my friend.
Stumbled!!
P.S. Do you think the symbols used in titles have any baring on SEO? Vertical bar, hyphen, dash, etc.
Another very important thing is to have an English editor to check for grammar and readability.
{ 1 trackback }