Free Software at Freebyte!
Free Service; HTML;

Examples of HTML tags

Images, Links, Lines


Starting from the standard document (as seen on the Writing HTML page) you can add different lay out features to your Internet pages. Here are a few examples. For a full and more tutorial-like document please take a look at the HTML reference list


Some examples


The HTML tag should be put before and after the letter(s), word(s) or part(s) of a page you want to look different.

<H1>Header Size=1</H1>

<H2>Header Size=2</H2>

<H3>Header Size=3</H3>

and so on ...

<B>Bold</B> looks a lot like <strong>strong</strong>

<I>Italic</I>

<P> = A paragraph skips a line>
<BR> = A break starts on a new sentence
The very annoying <BLINK>Blink</BLINK>

<CENTER>Center</CENTER> speaks for itself

Note:
  • As you see most of the HTML tags speak for themselves. Writing HTML does not give you the freedom of keyboard errors, one wrong or missing character can ruin your page!



IMAGES


You can say that there are two kind of images; inline images or outline images. One great feature of HTML is that you can view an image within your text. You then have to make a reference to the image within your text. The Internet browsers, at the moment, can only view .GIF and .JP(E)G images, because they have a low density (dots per inch).

Inline Images

An inline image is an image seen within an Internet page.

welcome

Looks like<IMG SRC="misc/welcome.gif" ALT="welcome" WIDTH=92 HEIGHT=49 BORDER=0 UNITS=pixels>

Outline Images

An outline image is nothing more than the same image but then viewed on it's own by the browser. There is no text or HTML tags next to such images.

Try me!

This link looks like an ordinary page link (see below)

<A href="misc/welcome.gif">Try me!</A>

Note:
  • It is important to put down the width and height of an image in your tags. The browser reads text first and defining the size enables the browser to leave the exact space for the picture, instead of first having to download it.
  • The border=0 tag leaves the line at the edge of the image out, any other figure will show it again.
  • The alt text tag explains viewers who took the option not to load images what kind of picture they are missing.



LINKS


As you would have figured out there are different kinds of hypertextlinks. We can distinguish, page, local, interlocal and inline image links.

Local Link

The local link; is within your own website (the references are similar tor the DOS\WINDOWS TREE on your harddisk,

like <a href="directory/filename.html">local link</a> (note the slash/ instead of a backslash\).

Interlocal Link

A link to Netscape's home page

looks like <A HREF="http://home.netscape.com">Netscape's home page</A>

Interlocal (Internet) links are always put down with full URL's

for instance; <a href="http://www.etcetera.com"> interlocal link</a>.

Inline Image Link

You can also combine these tags by making the inline image itself into a link:

This inline image link like: welcome

Looks like<A HREF="http://home.netscape.com"><IMG SRC="misc/welcome.gif" ALT="welcome" WIDTH=92 HEIGHT=49 BORDER=0 UNITS=pixels></A>

Page Link

The page link is used within one page or to a place on another page. You have to do two things to make it work. First you have to "tag" the place where you want to link to. Let's say go back to the beginning of the links paragraph.

  1. make a name reference <A NAME="links"> next to the word(!) you want to go to.
  2. make a normal link to that place: <A HREF="#links">Go to the beginning of the links paragraph</A>.

Note:
  • The important character here is the #. You can also make a name tag to another page. Just be sure to put the name before the page. Example:<A HREF="writing.html#tags">Writing HTML page</A>



LINES


<HR> makes horizontal line in your page.


add size, width or align, noshade and your line will adjust
<HR size=1>

<HR size=10 width=50%>

<HR NOSHADE size=10 align=left width=50%>

Stop
  • Before I do not keep myself to my words, and do start inventing the wheel again, I will stop this introduction to HTML. Besides, I didn't develop it myself, so the credit should not go to me. The big fun of HTML is that sometimes when you experiment with the tags, you can find "new" ways of writing.
  • There is much more to HTML, you can make frames, forms, lists, META's, embody JAVA and JAVAscript, animated gif's, use sounds and moving pictures within your pages. At the moment (August 1996), "they" are making the standard of HTML 3.0. If you're interested in developing your own webpages, please take a look at the HTML reference list and keep up with the latest.


HTML References

Home
All programs, pictures, images, and URL's found on or through this web site are properties of their creators and respective holders. Always read the readme.txt before using software. Freebyte, 1996.