07 · 15

Elements of Good Web Development

I recently read a great article on SitePro News about the Elements of a Good Design. While reading that article, the light bulb in my head turned on, shining bright! I said to myself, "How about an article about the Elements of Good Web Development?" Hence, the following article. Okay so you have the design of a website done. Now it is time to move into the development stage (the piecing together of the website; making it functional and search engine friendly). Whether you are developing it yourself or using a company to do it for you, there are many elements that are needed for good web development. I will, in detail, explain the various elements that need to be taken into consideration (actually not into just consideration, but that NEED to be done) when developing any website.

Element #1 - META Tags

We have all heard of META tags but most people don't really understand how important they are. META tags are strictly in use for search engine purposes. They tell the search engine spiders what the website is about, what keywords to use for indexing purposes and so on. Using the right meta description and keyword are vital! When coding the META description and keywords you need to keep in mind the content on that particular page. When you have written content for a particular page within your site, you need to make sure that the keywords that you have placed in the META keyword section are among the text. When the search engine spiders crawl your site, there needs to be those keywords in the content or else the spiders will think you are keyword cropping (basically packing your site with keywords that have no relevance to your site's content - A BIG NO NO!) This will cause your site to be bumped from the search engines. You don't need to take the chance, so make sure that your content is relevant to your META keywords and descriptions.

Element #2 - ALT Attribute

As of right now, search engines have no way to read what is in images. That is one of the major reason why text or content should NEVER be an image. When you do have images, the need for the ALT attribute to an image tag is very important. This is used for people with disabilities that need a screen reader when viewing websites. When a screen reader reads the website and comes to an image, what's going to tell it what the image is or what is going on in the image? That is where the ALT attribute comes in. What the ALT attribute does is provide an alternate description of the image. If you do not have an ALT attribute with the image, the screen reader will be unable to translate to the person, hence he/she will not get the complete benefit of the website. So to be fair to all who come to your site, disability or not, make sure that you use ALT attribute for all images within your site. I know that it may become mundane to do so but it will be well worth it.

Element #3 - TITLE Tags

There are two different TITLE tags (both of which are very important) that is used in development. They are both strongly used for search engine benefits. First, is the main TITLE tag. This is used for the title of the document or web page. This is used for many purposes:
  • defines a title in the browser toolbar
  • provides a title for the page when it is added to favorites
  • displays a title for the page in search-engine results
Second, is the TITLE tag used with in the linking tag. This particular TITLE tag is used to provide the title and information about the particular link that is in your content. This tells the user and search engine spider where that link links to.

Element #4 - Header Tag ( H1 - H6)

The header tag is used to define headings with in your content. There are six different header tags. These range from the largest (H1) to the smallest (H6) and also from the most important to least important respectively. When search engines crawl your website indexing content, they will comes across your heading tags and determine the importance of the text depending on what H tag you use. Make sure that the headings that are most important have the lower number with them. Also make sure to have some keywords that you have placed in the META section in those headings. A BIG PLUS! Also, when screen readers come across those heading tags, they put more emphasis on the phrase when they read it back to the person.

Element #5 - CSS (Cascading Style Sheets)

CSS is the major contributor in the way the website is laid out. It controls what sections are where and the looks of the text (colors, font sizes, alignment, etc.) The use of CSS is the professional and web standard compliant way to develop any website. They make the development of website easy to accomplish. They combine many aspects of the look and functionality of the website into separate files. Ones that you can then link your web pages to. There are many ways that you can use CSS to style and develop a website. Once you are familiar with CSS and learn how to use it, there are endless possibilities!

You Can Do It!

When you use these elements when you are developing web pages, the website is sure to comply with web standards and please the search engines. It will also portray the professionalism and keenness to detail you have.