Monday, June 11, 2007

Hypertext Markup Language (HTML) for the Layman

HTML is the language that deals with the layout of websites. It tells what goes where and how it works. In the past at the birth of the internet and HTML, HTML also detailed the design or the look and feel of websites. However, this trait has become depreciated with the advent of Cascading Style Sheets (CSS). Furthermore, with the advances of technology and programming your old five page website of pure information about a business is going the way of VHS with more and more companies--and customers as well--demanding highly interactive and informational websites. Most server-script languages support the use of HTML internally and many websites you may visit have the suffix ".asp" or ".php" for its respective server-script. That doesn't mean you'll never see the classic ".html" again any time soon. The demise of HTML is way off and even when it gets fully out-moded it will still remain present in modern server scripting languages in the sense that server script deals with information control but HTML will still be required as part of the information network.
HTML and other web related languages are governed by the World Wide Web Consortium (W3C) which governs all such languages in the same manner the World Trade Organization governs international tariffs. There is a standard of code which all HTML documents must reference and adhere to and furthermore the web browsers themselves must abide by. If it weren't for this level of organization, there would be chaos in internet technology. Further, it sets precedent and grapples with the ever changing web design market with the advent of technologies like CSS.
The W3C requires two parts to your HTML document, the doctype declaration and the primary structure. There are four HTML tags which comprise the primary HTML structure and must be present within your HTML document in addition to the doctype declaration. An HTML tag is any command which consists of a word enclosed in ‹›. The four primary tags are the HTML tag, which is the lettering HTML within two ‹› typed ‹HTML›, the HEAD tag, typed ‹HEAD›, the TITLE tag, and the BODY tag all with appropriate closing tags. All html tags are started as ‹TAG› and end as ‹/TAG›. They are called opening and closing tags respectively. You may recognize these from my main pages down the left side and my various links disguised as these tags. If you look back, that is the basic primary structure of a website.
You could think of all HTML tags as a sandwich. You have your first slice ‹HTML›, some information, then your second slice of bread ‹/HTML›. Furthermore, the overall structure of the website is similar. You have ‹HTML›, ‹HEAD›, ‹TITLE›, the title of your site, ‹/TITLE›, ‹/HEAD›, ‹BODY›, the layout and other info of your website, ‹/BODY›, ‹/HTML›. That may look something like the following in a real HTML document:
‹HTML› ‹HEAD› ‹TITLE›AAF Consulting, Web Design‹/TITLE› ‹/HEAD›
‹BODY› Welcome to My Website! ‹/BODY› ‹/HTML›
The doctype declaration tells the web browser which version of HTML you are using and which level of strictness and/or type. There is 1.0 and 2.0 as well as XHTML. Also, each of those has the Strict type, Transitional type, and the Frameset type. The doctype declaration must be the first thing in your HTML document, even before the opening HTML tag. For a list of these doctype declarations, visit he W3C Website and lookup doctype declarations.
If you forget to include a doctype declaration or are not sure what to do with it when you get one, its okay. Most web browsers default to HTML 2.0 Transitional and your website will display fine anyways. However, keep in mind that you may upset your next web designer because this will cause extra work for the designer and increase your final invoice.
If you don't think you're quite ready to hand code HTML on your own, that's perfectly fine. There's a lot more to it than simply laying out the primary structure. There are many simple to use resources out there at your disposal. The easiest but most expensive is to contact your Web Designer or Web Master. However, you may purchase software to aid in your creation. Some of these programs are well designed and you don't ever look at code, only your design, such as Microsoft FrontPage. Others are meant more for the professional web designer such as Macromedia Dreamweaver. Also, if you are using a webhost such as Yahoo! or GooglePages--Google's GooglePages is still in beta--it has free tools for your web design and provides free webhosting.

No comments: