html crash course

html crash course
kevin ko, vp electronic communications

Have you been thinking about creating your own webpage and just aren't sure where to start? You don't feel you have the time to learn another programming language, right? Hey, that's understandable... if you're an Arts student (no offense to any Arts students reading this). Really, creating a web page is as easy as opening Netscape Composer, and typing in text where ever you want it to appear, and doing the same with images. Nevertheless, coding in Hyper Text Markup Language (HTML) is where the heart of "writing" web pages lies. Javascript, Java, Dynamic HTML, using Shockwave/Flash, etc. definitely help to make your page more flashy, but you can worry about that after learning the basics. Any monkey (or smart bear) can create a web page - making it look good requires a little more. If you know any basic HTML, you may want to skip onto the next article. Perhaps I'll get into more advanced HTML when VP Publications forces me to write another Enscquire article another month.

Let's say my login ID is vpgeek (i.e. my email address is vpgeek@sfu.ca). Now every SFU student as a fraser account. Each student has 5 MB (soft limit) to 10 MB (hard limit) of space in their accounts to waste. Might as well use some of it for a home page. Using the mkdir command, create a directory in your root called pub_html (i.e. unix - mkdir pub_html). This directory is where all web-accessible files will sit. Be sure that the permissions (use chmod - view unix manual for more info) are set to 744 (at least). If that doesn't work, try 754 or 755. In this directory, the first HTML file should be index.html (case sensitive in unix, of course). This is the file that loads when the URL www.sfu.ca/~vpgeek/ is entered in a browser.

Most of the things I touch on here can be explored in more detail at a good online tutorial at http://wdvl.internet.com/Authoring/HTML/Tutorial by Selena Sol (a 3-day introduction to web design course that can be done in about 1.5 hours). Other tutorials can be found on the web by doing a search for "Basic HTML" or "HTML Tutorial" at your local internet search engine.

Alright, so the first thing to mention about HTML code is that it is CaSe InSEnsITiVe — you should, however, develop a consistent coding style. HTML tags are commands between '<' and '>' symbols. They let the browser know important things about the document, as well as how to display the body of the document. Such an example is <center> which centers text in the browser window.

Basic Tags Are:

<!DOCTYPE>
This defines the HTML specification of your document. Example:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
This goes before the

tag.

<HTML> </HTML>
Specifies that the document should be interpreted as an HTML document. This tag should either be the first line in an HTML document or should be directly after the <!DOCTYPE> specification. Likewise, the closing tag should be the last line in an HTML file.

<HEAD> </HEAD>
Specifies an area where the browser can look to for general information about the document.

<TITLE>TITLE</TITLE>
Clearly, it's the title of the document. This is what appears on the top left corner of the Netscape window. This should go inside the "head" area above.

<META>
Embeds information about the document. You can use the tag with several attributes provided you use them within the bounds of the <HEAD> element.

<BODY>TEXT</BODY>
Specifies the beginning and the end of what will be displayed in the browser window. This is the document itself.


Place comments not to be displayed by the browser between the

Basic Body Tags Are:

<B> </B> Bold
<I> </I> Italic
<U> </U> Underline
<H1> </H1> ... <H4> </H4>Headings (1 being the largest)
<HR> Hard Rule (horizontal bar)

<BR> Break (end of line)
<P> Paragraph break

Centers text
<BLINK> </BLINK> Blinking text
<STRIKE> </STRIKE> ~~Text with line struck through~~
<BLOCKQUOTE> </BLOCKQUOTE>

Indented paragraph

<IMG SRC="imagenameandlocation"> Image
<A HREF="http://yourlink”>Link</A> Link to another webpage
<A HREF="mailto:vpgeek@sfu.ca">Email me</A> Opens viewers to compose email to specified email address.

Remember that all documents need sufficient permission to be accessed from the internet (so make sure that the permissions are at least 744).

Again, this is just a brief introduction to HTML coding. For more information on HTML, search the web, consult a geek, or borrow a book. Tune in next time when we’ll be covering tables and frames (maybe).