August 13, 2007
@ 04:16 PM

Step 1: Learn the (Source) Code: ABC’s of HTML

Ask a web designer about Da Vinci and his code and you’re apt to get a blank look in response. But ask a web designer about source codes and you’ll fill your notebook.

Why not? Knowing your source code can mean the difference between a polished, professional web site and one that that your audience might think a kindergarten student slapped together.

Seven Keys to Understanding HTML Code

HTML is the Universal Web Language

Knowing HTML gives you much more control over how your web site looks

How HTML works

Knowing HTML Files

Knowing HTML Tags

Knowing HTML Tools

Other key Web languages

What is HTML?

While there a several languages you can use to design a web site, far and away the most prominent, productive and popular code is HyperText Markup Language, or HTML. The building block of web site design, HTML code is the primary language on the World Wide Web – virtually all web sites are created using HTML. It’s the quintessential web language code, giving all you need to create and manage the text, images, sounds, and links that will make up your company web site. HTML’s uniformity and user-friendliness is its calling card. Its code is so easy to use that you can apply it to your web site on any kind of computer and any kind of operating system. Changing or adding colors, managing text size and inserting photos and images pictures on your Web site are at the top of the list of advantages gained from learn basic HTML.

A note: don’t confuse HTML with Uniform Resource Locator, or URL. While the former is the universal language used to create web site code, the latter is the standard address that leads you to a particular document or location on the World Wide Web. While you don’t need any advanced web design certification to use HTML, knowing how it works and how it’s composed gives you the foundation you need to build a stellar web site.

The HTML Process – At a Glance

HTML = Hyper Text Markup Language

An HTML file is a text file that is comprised of small markup tags

HTML markup instruct the Web browser how to display the page

Each HTML file should include either an htm or html file extension

HTML files can be generated using a simple text editor

How Does HTML Work?

In a word, HTML applies pre-set series of tags to manage and format text format text, establish hyperlinks to separate web sites, and create and place graphic images.

These tags exist in HTML files, which reside on a web server that are either managed by an Internet server provider (ISP) or by your own company. The Web server is plugged into the World Wide Web. When a web user calls up your web page by typing in your web site address (your URL), that opens the HTML file residing on the Web server.

Consequently, after a Web user asks for your HTML page, the Web server transmits a single, unbroken thread of ASCII text throughout the Internet where it is sent to the  Internet to the user’s computer. In turn, the web user’s browser transfers the thread of text into the web page the user sees on his or her computer.

HTML offers myriad technology tools to manage the web design process. 

Primary among those are:

Cascading Style Sheets (CSS) -- Enables web users to create unique language presentation formats  for your web site.

JavaScript – A scripting language that enables you to build more interactive elements to your web site.

Dynamic HTML (DHTML) – Gives your audience, the web user, more control over how the web page is viewed the page dynamically

Another technology toolset that enables you to add more applications and functionality to your web sites are called “plug-ins”. Rich with graphics, voice, and video images, plug-ins can enliven text-laden web sites and give readers more incentive to bookmark your web site 
once they visit it.

Examples of plug-ins include:

Adobe's Acrobat

Macromedia's Shockware and Flash

Apple's QuickTime and QuickTime VR

Real Audio's streaming audio

Understanding HTML Tags

While HTML is often referred to as a computer “language” in actual truth HTML is more a series of “tags” that frame key elements like words, terms, paragraphs, and graphics. Each HTML document includes a  head and a body

The process for generating an HTML file is simple and  straightforward. In designing your web site, begin with a starting  HTML tag <html>, and finish with an ending HTML tag, </html>. The text that lies between your starting and ending HTML tags is your 
actual web content, i.e. what your readers see when they bring up your web page.

Remember that HTML tags aren’t case sensitive, so you don’t have to worry about turning your “CAPS” button  on or off when inserting HTML code. You will, however, have to leave a single space between your tag and your text.

Essentially, your web tags direct the browser and provides instructions on what it should do when creating your web site. Tags number well into the hundreds so there is no real point in learning the definition of each one. Most web design packages insert tags automatically, exactly where they belong, without your having to tell the software to do. Just know that tags are important  -- you need them to create and change text, insert graphics and images, or link to another web page. In short, web tags are the traffic cops of the World Wide Web.

Understanding HTML Tools

When working with HTML, you really don’t need any special software or programs – plenty of web designers use MS Word, for example, to create HTML content.

Basically, the only real technology tool is a basic text editor that can save your web file as an ASCII text – an acronym for American Standard Code for Information Interchange. The most popular standard for encoding text documents on computers, ASCII documents are text  documents that are easily viewed and managed for content use both on basic computer word files and on Internet web pages.

Since HTML is platform independent, saving your HTML files in ASCII text format is the easiest and most effective method of doing just that.

Common text editor tools that work easily with ASCII files are Simpletext and Notepad. But even Microsoft Word or Word Perfect files can be easily saved as ASCII files and used to create web-based HTML files. In MS Word, for example, you are given the option when saving a file to save it as “Text” or “Text Only”. By saving your file in either format, you’re converting that file to ASCII text.

For More Information

If you have a yen to learn more about HTML code and web design, there is no shortage of web sites that cater to the topic.

Some of the best include:

EchoeEchoe.com

PageResource.com


WebSiteTips.com