Freelance Writing Jobs | Today's Articles | Sign In

 
Browse Sections

Intermediate HTML

Lesson 2: Intermediate Page Design

The one-wide-column, straight-down-the-page look just doesn't cut it any more. Web page design has evolved to the point that visitors to a website have certain expectations of what a page will look like and how it will be laid out.

In this lesson, you will apply the CSS skills from the first lesson, and combine them with new skills in constructing tables and inline frames to give your pages the professional look of a site like the one you're on now.

It is SO EASY to learn from others!

No one can be 100% original. Even William Shakespeare "borrowed" plots from other writers. Fortunately, borrowing ideas from other people's web pages is easy to do. That's because it's always possible to view the HTML source that goes into making a web page that you see in your browser.

How to view the HTML source for this page

If you're using Internet Explorer, click on View>Source in the menu up top. In Netscape, it's View>Page Source.

Voila! An editable window should open up, displaying the HTML that makes up this page.

Let's look at the components of the HTML source for this page:

  • In the HEAD section is an embedded CSS specification.

  • We know what that is. Of course, if the page were using an external CSS, there'd just be a link in this section.

  • Also in the HEAD section is some programming stuff that starts with

  • <script language="JavaScript">
    
    and ends with
    </script>
    

    This is a brief program, or script, written in Javascript. It's there because it makes the page do some things that HTML alone can't do. We'll cover Javascript in Lesson 3, so let's ignore this part for now.

    Now we get into the BODY section of the page.

    Not counting the text of the lesson itself, this page has sixteen different tables! And that's the secret to creating a professional looking page. TABLES are almost universally used on the web to format pages and partition them into sections.

    In the next section, we will look at how that's done. And don't forget, if you need to ask a question or want to add a comment, visit the Forum.

    Print this Page Print this page


    1  2  3  4  5  6   Next Page

Lessons

Lesson 1: Cascading Style Sheets
Lesson 3: How to add programming to your pages without being a programmer
Lesson 4: Using forms to get visitor feedback