Presented here are overviews, examples and links to tutorials covering many of the technologies involved in web development and design.
RESOURCES - HTML OVERVIEW:
Hyper Text Markup Language (HTML) is the core of the Web. When a page is sent from the server on which it resides to your computer's browser, the first thing that is read are the letters
HTML inside angled brackets. They tell your browser what to do with the data that follows.
The next element is
Head, which holds a variety of information including
Title which is the name of the document (as it will appear at the top of your browser's window) and of other items such as JavaScripts and Metatags.
Head and
Title are followed by the
Body element. It has two functions, first, it tells the browser that what follows is what will appear in the browser window. Second, it contains some specific data that controls the color of on-screen text and the color of the page itself. The default color for all pages is gray. This is the "background color" and it can be controlled by either using specific codes (white is "#FFFFFF" for example) or by calling for a specific background image (usually repeated or "tiled" to form a seamless effect). All but one of these elements shown in bold are required (the page will not load properly without them), with the single exception being
Title. These are the basic, essential elements of any Web page.
Once the page has been defined, the position of text and images is controlled in a number of ways, with the main options being
Tables and
tags.
Tables (boxes containing "cells" that are arranged in columns and rows) are often invisible. By placing text or images within one particular cell and adjusting the attributes of cells around it, it is possible to achieve a high degree of control over the positioning of items on a page.
Tags are commands that effect a specific aspect of an item. They can make text bold, italic or determine its color or font. They can also set the width of a table's cells very precisely. For vertical positioning, if you need more control just "top", "center" or "bottom," the
P and or
BR tags are very useful.
P creates a vertical space equivalent to one line of text. Its primary use is to create breaks between paragraphs of text.
BR does the same thing, except that it represents a line break, causing lines of text or images to appear above/below each other, but without such a large space as a
P would create. Combining the two will provide fairly tight vertical control. These two
Tags are among a very small group that do not require an identical closing command that begins with
/ inside the angled brackets. These are the basics of HTML code. It is just the tip of the iceberg, (with another 95% that we won't go into here) remaining unseen. This is only intended to de-mystify the concept of HTML so that even novices will know that it isn't all done with smoke and mirrors.
Nearly all of the HTML produced here is done by hand. The code we write minimizes load time and is absolutely dependable, rendering the same way every time, on any browser, on any platform.
There are any number of programs available that will write code and allow even novices to create a page and put it on the Web. Regrettably, some of these "editors/generators" won't allow users to alter what they create, and all of them generate extra, unneeded code.
When loading a page, browsers start at the top of the HTML and work their way down, interpreting each and every character. The more data that has to be processed, the slower the page loads, it is as simple as that.
Our clients want to communicate a message in the most efficient and attractive manner possible. People will bail out of slow-loading pages, even if they were looking for content they need and want. The Web is a boundless resource of information but if a page or a site is slow there is an almost automatic reflex to hit the "Back" button and look for another, better resource elsewhere. Speed is second only to content and ease of navigation in site design. For that very reason, we strive to produce the tightest and cleanest code possible.
For those interested in learning the details of HTML, we offer the following links: