Text small medium large Contact us TheProduct.com

What is Web business? Marketing Strategy Web Commerce Launching Your Site

The Business Idea Business Models Business Plans Buyer Behavior Marketing Mix Statistics and Privacy Shopping Carts Payments and Security Order Fulfillment Service and Support Promotion

Hello World Page First Business Page Images and Links Page Layout Site Navigation Original Graphics JavaScript Features Forms Browser Compatibility Hosting and Going Live

Site
Navigation

All Web sites require a scheme for navigation between the pages that make up the site. While there are countless ways to design site navigation, only a few styles are practical and useful for e-commerce.

All modern Web sites use style sheets (see the tutorials on CSS at W3 Schools). But this, like CSS for layout, is beyond the coverage of our tutorials. Nevertheless, we add a style sheet for the home page developed below for illustration.

The tutorials rely on the best reference HTML and related Web site coding available: W3 Schools. If you follow these tutorials along with our sample pages you will gain the same skills as the students enrolled in the college course.

Goals

HTML Coding

Learn how to create site navigation.
- Home page navigation
- Interior page navigation
See an example of a style sheet

Viewing HTML

View the pages from your computer and/or upload the page to a server.

Steps

HTML Coding

View the source of the Fourth Business Page
Go over the topics in the W3 Schools HTML tutorial that deal with the code you see on the Fourth Business Page (our sample pages follow the HTML tutorials in order)
Modify the page to make it personal adding whatever links or images you wish.
Notice that the content for the all of the interior (placeholder) pages is in tables.
Notice that the home page navigation is on the left and the interior page navigation is on the top, although it need not be.
Notice that the logo is a lonk to the home page.
Open the style sheet fourth.css in your text editor.
Notice that the <body> statements and font coding have been changed to illustate a simple use of CSS. (You do not have to do this. If you don't, your Fourth Business page and interior pages will use the same code as your Third Business Page.)

Viewing HTML on Your Computer

Open Notepad or any text editor.
"Copy" the HTML code from the Fourth Business Page and interior pages (write the code line by line)
Save your six-page Web site as fourthpage.htm, content1.htm, content2.htm, content3.htm, about_us.htm and contact_us.htm.
Rename your home page index.htm.
Change the home page links on the interior pages from fourthpage.htm to index.htm.
Open the index.htm file in your browser (in Internet Explorer, File, Open, Browse to the subdirectory where you saved the file, Open)

Viewing HTML on a Server

If you have access to a server (perhaps through your Internet Service Provider), you can upload your Fourth Business Page to the server using File Transfer Protocol (FTP)
Try the free SmartFTP program
Open your Web page as you would any other Web page
Remember to upload all of the HTML pages and all of the graphics to the server.

Accomplishment

You have created your third business Web page, one that uses tables for layout.

Top of Page

< Previous Page Next Page >