HTML for the Terminally Impatient

/in /by

Can’t wait around reading HTML books or waiting for FedEx to rescue your software from that island it washed up on? Well here’s a fast way to get to started. I’ve designed a simple, 2 column template that you can download and use to insert your own information and start learning about HTML. It includes an HTML 4.0-compliant style sheet, a fast loading header and navigation table, and a content table.

  1. You will need to save the page to your machine.At the command menu, click on File > Save As.Save the page in the “Source” or “HTML” format and name it whatever you like so long as the extension is “.html” (Okay, you could make it “.htm” if you really want).
  2. To start using the template, open it in a plain text editor.Your browser may have an option for editing HTML, such as:Netscape — File > Open > Page in ComposerIE — You need to open the page in Notepad or something similar. Opening in MS Word will result in the addition of new code and reformating by the program and is not recommended.
  3. Now search through the code for two percent signs (%%).Any where that you see two percent signs together (%%) should be some instructions in all caps for what replaces that text.For example, <title> %% THE TITLE OF YOUR WEB PAGE GOES HERE %% </title>Replace “%% THE TITLE OF YOUR WEB PAGE GOES HERE %%” with My Test Web Page so that it now looks like this: <title> My Test Web Page </title>

You’ll also find some comments and examples to help you along. In addition, check out the online resources listed below for additional help in your experiments. I recommend saving your test page with a new name as soon as you load the template into the text editor.

And if you somehow destroy the template beyond all repair, just come back and download another one.

You should be able to get by with just the following HTML code:

paragraph,

<p> – which produces a new paragraph

bold,

<b> – which produces bold text

italic,

<i> – which produces italic text

unordered list

<ul> – which produces a bulleted list of list items (<li>)

order list

<ol> – which produces a numbered list of list items (<li>)

definition list

<dl> – which produces a list like this one with a data term (<dt>) followed by the data definition (<dd>)

break

<br> – which can be used to force a break in a line or used to add extra spacing in a line like I do in my numbered list above

All of the tags need a matching closing tag which is </whatever-tag-letters>. For example, the code for a paragraph with bold and italic text would look like this:

<p>
This is a paragraph with <b>bold</b> and <i>italic</i> text.
</p>

And it would look like this in the browser:

This is a paragraph with bold and italic text.

Additional Online Resources

HTML code tutorials

http://hotwired.lycos.com/webmonkey/authoring/html_basics/

For my money, the best set of introductory HTML articles available. since you have a template, you can start with the “Teaching Tool” or the “HTML Cheat Sheet”.

http://www.2kweb.net/html-tutorial/

An impressive online tutorial with examples. Note that you really don’t need to do any fancy font coding because of the style sheet included in the template.

Cloud Computing and Ubuntu

Once you have your new design ready it’s time to find a host for it. There are several studies done about how peer-to-peer cloud computing can help reduce CPU usage and provide a better reliability.

HTML color guides

http://www.webdesign.about.com/compute/webdesign/library/weekly/aa061598chart.htm

A flat page that displays the colors and their codes for quick reference. It will also allow you to see what the colors look like on your monitor — but remember, each monitor will see the colors a little differently.

http://www.visibone.com/

Home of the Visibone company which sells HTML-related reference cards and software. they’ve greatly expanded their offerings in recent years, so you may want to keep any eye on new products.

http://www.visibone.com/colorlab/

This is Visibone’s online interactive color chart. You can select colors from their hue-based color wheel and see how they work with each other, either side by side or as link or text colors on top of the other colors. Very handy way to find out that you really can’t use that bright blue you love with the dull red.

HTML Definitive Answers

/in /by

There are two books always within immediate reach on my computer desk; one is a dictionary, the other is HTML & XHTML: The Definitive Guide by Chuck Musciano & Bill Kennedy. Following publisher O’Reilly & Associates, Inc. tradition of animal line-art for the covers, this is the koala book. I have no idea why, unless it’s a subtle reference to the slow but methodical coverage the authors give their subject.

This book could be used to learn HTML and XHTML, but like most O’Reilly publications, it’s not a visual book. It’s more like an academic reference and can be a little intimidating looking at a sub-section headed with “9.7.1.1. The rows and cols attributes”. Butwhen you really want to know what’s the right way to code that table attribute or are trying to figure out why your HTML did THAT when you really wanted it to do this, HTML & XHTML: The Definitive Guide should be in your bookshelf.

The authors cover the basics and the actual HTML standard (at the time of publications, of course), as well as providing comprehensive information about browser-specific extensions to the HTML code — both in an overview and as they cover each tag and attribute. They also include the older tags, noting which ones have been deprecated in favor of the new standards, and the now preferred cascading style sheet methods. Yet they are often quite honest about the lack of consistent support even by browsers that support css and encourage coders to consider following a more moderate approach to the protocal support. Whenever I’ve been in doubt about using a deprecated method or following the new standard, these authors have cast the deciding vote. I don’t even bother with a re-count.

The coverage of XHTML and XML explains the advantages — and disadvantages — to Internet businesses in some of the clearest language I’ve found. They quickly persuaded me to meet the new XHTML standard as closely as possible. I only wish the programmers of the HTML coding tools and the professional coders working on the corporate sites would use this book!

The instructions are simple and clear, but if you’ve never touched HTML code, this is not a “learn HTML in day” book, despite it’s best efforts. In their goal to be complete, they sacrifice brevity. On the other hand, if you’re looking for a comprehensive reference to answer those niggling questions or want to progress in your coding to a professional level, add HTML & XHTML: The Definitive Guide to your library.