Designing Web Pages Getting to know HTML...

What is HTML? Hyper Text Markup Language HTML is the major language of the Internet’s World Wide Web Web sites and pages are written in HTML

Getting Started... By learning HTML you’ll have more control over how your web pages look, and you’ll more easily discover ways to make your pages look better. HTML is platform independent, meaning it can be viewed on any type of computer. The program Notepad in Windows is one of the easiest ways to write HTML.

Finding a Host Service (Web Server) You need to find a company that’s willing to host (serve) your web site. You can use a free home page host. Most of these show banners on your site so they can pay for their servers. When signing up for free host you get to choose your own username and password. Your username is generally the directory people type to get to your site, so choose wisely!

Writing your Files... Create folder to keep files in, BE ORGANIZED! Windows 3.11 or older, can’t save a file as.html because they can only use a 3 letter file extension -.htm. acts exactly the same as.html Caution - you can have one file called mycat.html and one called mycat.htm on your host and they are 2 completely separate files!

Using “index.html” Your main web page file MUST be titled index.html, because this is the way almost all hosts’ servers are set up to handle the main page of your site. WINDOWS 95/98 users: notepad will automatically name file index.html.txt To get around this when you save an html file type quotation marks around the file, “index.html” this tells notepad not to use the default.txt extension.

What are tags... Tags make up the entire structure of an HTML document. “ ” When you place something within these you are making it known as a tag. Tags define what is within them. For example: the tag is saying to start bold text, and the tag is saying to stop bold text. The tag with the slash (/) is known as the closing tag. This text is bold Tags in HTML aren’t case sensitive

Document Structure... HTML documents have 2 parts, the head and the body. The head contains the document’s title and similar information (this info does NOT show on your page). The body contains most everything else. Example of basic HTML document structure: Title goes here Body goes here *TYPE structure on your page

Headings... Headings are some of the most important tags within the body of your HTML document. Usually use headings to tell what the following section of your page is about. The opening tag for a heading is and the closing y being the size of the heading…from 1 to 6. (1 being the largest and 6 being smallest) Headings

Sample Headings... Today is a good day. H1 Today is a good day. Today is a good day. H2 Today is a good day. Today is a good day. H3 Today is a good day. Today is a good day. H4 Today is a good day. Today is a good day. H5 Today is a good day. Today is a good day. H6 Today is a good day. *Include this on your page

Horizontal Ruled Lines... Horizontal Ruled Lines are used to separate different areas of a web page. The tag is IT DOES NOT HAVE A CLOSING TAG! You may add width=n (for setting pixel width) OR width=n% for a certain percentage of the screen width. Size=n to make the line a certain pixel amount thick, and NOSHADE to turn the line’s shading off. A plain with no attributes will make the line the full width of the screen. *Place a few on your page.

The Line Break... If you want your text to start on the next line (like when you press enter to get to the next line) you need to insert a Line Break. Tag is There is NO ending tag! Example without Line Break: Sentence one. Sentence two. Sentence three. Example with Line Break: Sentence one. Sentence two. Sentence three. Add to your page.

Paragraphs... You will often use paragraphs in HTML, just as you do when you’re writing stories. The tag is The closing tag is not always needed, but be safe and use it anyway. Place two on your page. Notice the difference between a and a