Let’s Talk HTML Basics

HTMLHTML documents are plain-text, also known as ASCII files, that can be created using any simple text editor like Notepad or WordPad on Windows. It is best to create your code with these simple text editors as opposed to Word or WordPerfect, which may reformat your code as you create it. You are probably wondering how any lowly text editor could design such sophisticated-looking Web sites. Well, it’s the Web browser that determines how the page actually looks. The browser reads the text, looks for HTML markings, then visually displays the page according to the instructions.

The only drawback to this is that it is impossible to know what your page will look like when it is done. Fortunately, you can do a test run on a browser before you actually publish your page. It’s not a perfect scenario, but it works.

You will also need access to a Web server to get your files on to the Web. Contact your local internet provider to see if you can post your files free of charge.

TAGS

The tag is a code that describes how the images and texts are going to appear on your site. For example, if you want a certain word or block of text bold, you would type it as follows: (the tag for bold is <B>)

<B>Welcome To My Web Page</B>

The first <B> instructs the browser to make anything after it appear bold. The second </B> (notice the backslash to denote an ending bracket) tells the browser to stop the bold instructions.

Tags denote the various elements in an HTML document. An element is a basic component in the structure of a text document. Elements can be heads, tables, paragraphs, and lists; and they may contain plain text, other elements, or a combination of both.

An HTML tag is made up of a left angle bracket (<), a tag name, and a right angle bracket (>). They are usually paired to begin and end the tag instruction. For example, <H1> and </H1>. The end tag is similar to the start tag except that a slash “/” precedes the text within the brackets.

Some elements may include an attribute, or additional information inside the start tag. For example, if we wanted to create a table using HTML, we would use the table tag, <table>. We could add attributes to the tag to define the border and width of the table, as in: <table border=2 width=100%>.

Mark-Up Tags

* HTML–This announces to your browser that the file contains HTML coded information. The file extension .html also indicates that this is an HTML document and must be coded. The final tag in your document will be </HTML>.

* Head–The head element identifies the first part of your HTML-coded document that contains the title. The title is shown as part of your browser’s window.

<head>

<title> my web page </title>

* Title–The title element contains your document title and identifies its content in a global context. The title is usually displayed in the title bar at the top of the browser window, but not inside the window itself. The title is also what is displayed on someone’s hotlist or bookmark list, so choose something descriptive, unique, and relatively short.

</head>

* Body–The second and largest part of your HTML document is the body, which contains the content of your document (displayed within the text area of your browser window).

* Headings–HTML has six levels of headings numbered one through six, with one being the largest. Headings are usually displayed in larger and/or bolder fonts. The first heading in each document could be tagged <H1>.

<body>

<H1> This displays a large font </H>

Additional code here

* Paragraphs–You must indicate paragraphs with &lt;P&gt; elements. Without them, the document becomes one large paragraph. Your browser doesn’t acknowledge carriage returns, so when it comes across a spot where you pressed Enter, it will just keep reading the text until it comes to &lt;P&gt;. You can also use break tags (<br>) to identify a line break.

</body>

* Lists–Sometimes you’ll want to present your information in the form of a list. HTML lets you create unnumbered, numbered, bulleted, and definition lists.

* Tables–You can also set up data into tables. HTML reduces multiple spaces to a single space, and doesn’t pay attention to tabs. You can use rows and columns, however, and that will work in most situations. Refer to your selected text for more information.

ADDING IMAGES TO YOUR WEB PAGE

When you display images on your Web page, they don’t actually appear on your text editor. All you do is add a tag to the document that basically says “add image here.”

Use the image tag and define the source, which is the location of where the image is located.

<IMG SRC=”A:myimage.gif”>

This HTML tag will display the image named myimage.gif, which is located on the A: drive.

CREATING A HYPERLINK

This is the backbone of all Web pages–creating the ability for your user to link to other locations, whether it be relative (within your own Web site) or absolute (to some other Web site). Here is an example.

<A HREF=”HTTP://www.google.com”>GO TO GOOGLE</A>

This bit of HTML code will display the words “Go to AOL” on your page, and will be linked to the AOL Web site. The user can click on these words to complete the link.

YOU’RE ON YOUR WAY

Although there is much more to know about decorating” and designing your page for optimum beauty and presentation, hopefully you understand what HTML is about and how to go about making use of it. The concept isn’t too far out-once you grasp it you should zip through the basics in no time.

Leave a Reply