Your First Web Page

General HTML TOPICS

• Web-HTML Preamble - learning preparation, images, color, Internet-What is this thing?
The Internet or World Wide Web is nothing more than a mass of computers situated around the world that are connected, but not directly.

If you have an Internet account (you have access the the Internet) you will be aware of ISPs or Internet Service Providers. They are no more than people or companies with computers connected one step closer down the line to the interstate or international telephone lines. In the work place the network is controlled or overseen by a master computer that keeps an eye on who is trying to do what and controls who can do what. These master computers are called Servers and the first server encountered on the Internet will be your ISPs computer.

When You check the path taken by the electronic digital name that Your computer calls out to the rest of the world (the URL that You type into the browser - or the URL that is sent when You click on a button or Hyper linked text), You find that 20 or 30 and more servers recognize the ID I have called and know they can send the name on out to others that can then ..... and so forth. A computer somewhere (a Server) says to it self, You have got that file that he/she is looking for on my hard drive, and responds by sending an acknowledgment back to You and the conversation begins (computer conversation).

In the case of general browsing, probably around 98% of Internet usage at a rough guess, once the computer conversation is established the contacted computer sends the file that I asked for and that file will be nothing more than a simple! file of text based information - as apposed to image files and Java applets etc that are complex binary data files.

Back down the line of servers comes the file until browser is given the file, by Your computer system connected to a modem. The browser is a clever piece of software that can "read" the text and recognize special groups of characters we call Tags, and it is the tags that tell the browser how and where to place plain text objects, lines and any images that are to follow. When the browser notices a reference to another object, it then sends a request all the way back to the source computer again and that distant server hopefully obeys by returning the object file to Your browser - which in turn already knows where to display the object on the page because of the tag information.

Hopefully you will appreciate the technological complexities involved, no science degree necessary, and keep calm when things go haywire. For your part, if you intend to create pages to pass around via the internet, best you observe and learn all the little issues that can ensure the correct and efficient displaying of your pages.

What is a "Site"?
Even with a minimum of computer experience you should be aware of folders or directories that reside on the hard drives of the computers you use. They are structured with first level folders containing not only computer program files but perhaps second and further folders within. A server computer, i.e. your ISP might also offer a Hosting Service which allows persons or organizations to store their Internet files and make them available for world wide access. The "site" is little more than a structured set of folders (directories).

However because the ISP will carry hundreds of individual "sites" for many clients, their (the ISP) server controls permissions etc. just as the work or college servers control who has access to what etc.. When you open an account for your own site, you will be given an amount of hard disk space where all the HTML and image files can be stored, but you do not get access to any of the other "sites" residing on the Host Server. How your site is managed depends on the agreement made with the hosting company or what they offer - whether you want to / are allowed to do it all yourself etc.. It is usually an expensive exercise, but for just a few pages and images and as a way to learn there are some very good deals around.

So the only way we can virtually reproduce a strength of a given color somewhere between nothing (black) and white is use lots of tiny solids so small that they appear to the human eye as one tone. The small solid colors used for web images are laid out in a set pattern - images for the web have to be pixeled as a controlled mass of the tiny dots.

Each pixel is capable of representing one of the 16.77 million colors we can display on our televisions and computer screens and the color system is called RGB. If we need to display or appear to display colors with a palette of less than 16.77 million, then the areas where many color should be are "dithered" with a mixture of obtainable colors. Combined, the mixtures give the illusion of the unobtainable. Look closely and you will find colors missing, replaced by the closest average color in the reduced Color Palette.

The sample above displays a "diffused" dither pattern applied to the image on the left where the number of available colors is reduced dramatically. On the right the image appears smoother because a wider range of colors is available. By moving back from the monitor a harshness in detail should become more evident.

The WWW or Internet uses two types of bit mapped images, GIF and JPG, and both use an array of pixel information as described below. However, because GIF images contain a color palette of 256 colors or less, to obtain the apparent inclusion of other colors they can have a dithered or random pattern of 256 existing colors applied to them to try and achieve the 16million+ colors that are missing. ie A combination of red and yellow will give the impression of an orange area. JPG bitmaps on the other hand use the full RGB palette of 16.77 million colors but have another purpose.

With less color value references .GIF image files can become very small compared to their RGB originals. .JPG files, although based on 16.77 million colors, are "compressed" with complex algorithms that basically average blocks of pixels so reducing the amount of color value references and again produce smaller image files. .JPG compression can be varied depending on the quality desired, but once compressed should never be opened AND saved again because further picture information is permanently lost every time.

The name of the game is to transfer information down telephone lines as quickly as possible. That and only that is the reason why we cannot just use our normal RGB bitmap images in all their original glory. (Also keep in mind that monitors have a fixed resolution so any bitmap resolution can be used as long as it is 72 pixels per inch!!)

In many complex ways objects of the universe emit light (our solar sun for instance), and creatures have developed the ability to define shape and form by detecting much of this light. We, as humans, are primarily concerned with the observance of what is called Visible light. That is, our eyes can detect wave lengths of natures Primary visible light components of Red, Green and Blue. Simply, different amounts of these components reflecting off an object give us the perception of a single color. Portions of the three components may be absorbed by objects giving us variation, where as 100% reflection of each RGB component will appear white and 100% absorption will appear black).

When we try to imitate nature, we can not get it quite right. Our ink pigments, television and monitor phosphors and laser printer waxes etc. are no where near perfect. Instead of an infinite variation of color our television and computer monitors can only reproduce around 16.77 million colors.

To add to our problems we must understand that different computer systems use different system color palettes (Mac, Windows, Unix etc). An accepted standard is the Web Safe color palette. This palette has only 216 set colors that are relatively safe to view on most systems. A 256 color palette (Indexed Colors) can have any 256 colors from the 16.77 million color RGB system. However, the web safe color palette is fixed. We should keep using these colors where ever possible for a few years yet, although they produce very poor full colour pictures.

Many corporate, college and home computers do not have 'wizz bang you beaut' video and hardware systems and because so many people only want information, try to design pages that will download as fast as possible, but still look fairly good. The dreaded Java applets and the number of colors in image files have the biggest impact on transmission speed - besides your host servers efficiency.

Pixels and Bitmaps (pictures for computers)

In order for a computer system to create, manipulate and output an image, whether the image is scanned, photographed with a digital camera or created from a blank canvas in a Painting program like Photo Shop, the image must be digitized into tiny solid color areas called Pixels. The pixels don't actually exist, your hard disk does not contain tiny individual pictures of each pixel, but they are represented on the computer screen for identification and manipulation from saved Red Green and Blue values.

When a bitmap image is created, the first thing that must be established is the bitmaps Resolution. That is, how many pixels or areas of individual colors there will be per inch (ppi) horizontally (or per centimeter), and this will also be the same vertically. If an image has a resolution of 200ppi and will be 3 inches wide when output at same size, there will be 600 different color blocks across each row. If the image is 4 inches high then there will be 800 rows, and the total number of pixels or individual color areas in the image will be 480,000. If the resolution is high enough we will not see a pixelised affect when output, similar to but exaggerated in the sample above. This sample showing the individual pixels also shows separate rows of pixels that help make up the whole.

The Color Depth of a bitmap image refers to the number of colors that an individual pixel could represent (only one of those colors per pixel) and the value is based on Bits , the lowest value used by a computer system. Because an image is an horizontally and vertically based array of information, they are called BITmaps. TIFF, GIF, JPG, PIC, BMP and a host of other file types are all bitmap formats where the name describes the patented algorithms used to save the pixel and array information on to your hard disk.

• Software & Hardware? - about computers and software
• What on earth is a CGI-BIN - and is it important?
• How to UPLOAD / Manage my site?
• About using HTML 4 / DHTML and CSS Style Sheets
• What's this thing called MS FrontPage?
• Web Pages & Multimedia - understand the audience
• www.Your-Domain.Name - information for obtaining your own domain