HTML Navigation Bar Starting Backgrounds Debugging Netiquette Tables Text Tips Image Maps Graphics Frames Resources Help Hosting Sounds JavaScript Books E-mail Jim

jim hanson's
Starting Your Page
Themes Templates Style Sample Page Adding Pages Editing Preview


To Web Basics Page

style

TO SAMPLE HOME PAGE

Best experienced with
Internet Explorer
CLick Here to start.
THEME

The first thing you should do is to decide what kind of theme you want for your page. Then you need to decide what kind of layout you want for your page. As an aid in doing this, you should familiarize yourself with examples of home pages that look like the type of page you want to create.

You can do this by browsing through the Web. You can start with Geocities neighborhoods, where pages with a similar theme are grouped together. When you find a page that you like, pick View then Document Source (with Netscape) or View then Source (with Internet Explorer). You will get a separate window opened with the source of the page you are currently viewing. You can then familiarize yourself with the HTML that was used to create the effects that you like.

TEMPLATES

If you think that a page you have seen will have some use in the creation of your own pages, you can select File, Save As... to save a copy of that page's source (but not the graphics) on your own computer. (You have to copy the graphics one at a time, if you want them, although Firefox will save all graphics at once.)

Then you can view and/or print the source from any text editor. You can use it as a template for creating your own page if you want (change the format and colors, at least). If you can, get permission to copy art and design from the page author, and put a reference (link) to their page on yours as a way of saying thanks.

WEB PAGE STYLE

Before starting on your Web Page creation journey, it's a good idea to understand a little about HTML style. Visit the Style Page now and then come back when you've started on your page. Using a "formal" style as you develop your page can help you as you refine your page.

(NOTE: With some versions of Netscape you can specify your HTML editor to be the default source viewer. This makes it quite convenient to view, copy, and save source that you may like to include on your pages.)

SAMPLE PAGES TO HELP YOU GET STARTED


SIMPLEST WEB PAGE

Just for practice, go to the simplest web page. It has no graphics or special formatting, just the basics needed to have the page display.

To edit the file you have saved, start with one (or more) of the freeware or shareware HTML editors (see links on the low cost editors page). After editing for a while, save your HTML and use your browser to preview it.


SAMPLE PAGE

For a slightly more complex HTML example with a graphic and some example links, go to this sample page. By viewing the document source you can also see comments I've added about the HTML tags that were used. Samples of most of the text formatting options you can use on your page are found on my HTML Basics Page.

OK, Now that I have a page, How do I add more pages to my site?

All HTML pages have the same basic format. All you need to do is save each page with its own unique name (like bio.htm or pictures.html, etc.). Most hosts require that your main page be named index.html, but that is the only naming restriction you will have. Remember, once the page is saved on your server, you need only specify its name in a link to access it. You don't need to use the full site name for your "local" pages (stored in the same directory as the index.html file). Just put the page name in the <A HREF= ... tags to access the pages.

EDITING

To modify or add to a web page, you need to use an editor. Basic editors, like Windows NOTEPAD, can be used, since HTML files are just text files.

You are better off to use an HTML oriented editor, though, since they have special functions to support creation of HTML tags, to insert images and links, and for building tables (to name just a few functions). These range from free editors, like Arachnophilia or Netscape Composer, to low cost editors like Homesite, to much more expensive editors (which I won't name). The basic editors let you add to or modify your page any way you like. The more expensive editors often provide a WYSIWYG (what you see is what you get) interface that appears to be an easy way to create pages. However, the translation from the HTML text to the displayed graphic is complex enough that those editors often have to resort to very inefficient HTML to build the page you want. More often you can achieve the same results with far less HTML than the WYSIWYG editor generates. If you are working with an Intranet in a company, the extra load time may not be of consequence, but over the web, you want to have your HTML be as good as it can be.

Homesite Starting Template

Some of the editors (like Ray Bradbury's Homesite ) include a starting template (shown here) when you select a New page (a basic HTML page that you can then build on). Homesite also includes a pretty good browser like view of what you have created. You don't have to switch to Netscape to view your edits, but that capability is present in the editor. (It doesn't really handle transparent or animated GIFs or JPG images, but it does show most GIF images as well as showing text colors and backgrounds in a near real view).

Other editors can be used on your HTML without having to start over. Each editor has some features that may fit with your own skills better than others (such as different schemes for selecting HTML tags, building tables, inserting images, or getting help). There are a number of free or shareware editors available for downloading over the web (like the Windows 95 HTML editors from NONAGS).

You must observe caution if you use different editors to edit a page you started with another editor, though. Save your file with a new name until you are sure of the eccentricities of the new editor. You don't want to have to re-enter your entire page if you make a simple error. Some WYSIWYG editors will filter all the tags when it reads a new file, sometimes changing your source for the worse.

Preview your page before you make it public!

You should always use a real browser (like Internet Explorer or Netscape) to view your work in progress. Select File , Open File... to look at your saved file or, if your editor has the feature, PREVIEW or VIEW IN EXTERNAL BROWSER to send the updated page to the browser. Look at your HTML before it is sent to a hosting service.

Please make sure your page displays on a real browser as you intend. Read your page. And, if your editor has a spell checker (like HomeSite does), check and correct spelling errors. As soon as your page is on-line, check and make sure that all links are valid and go where you intended before setting your page loose on the world.

For more references to beginning HTML, you can visit Netscape's Creating Net Sites page.

NOTE: If you click one of the "CLICK for" icons in the tutorial, a new browser window will be opened for viewing these pages. To return, you can just select this browser (from the task bar in Windows 95 or click your mouse somewhere on this window). You can also close (or File, Exit) from the new window when done, leaving only this window.

Internet Link Exchange
Member of the Internet Link Exchange Free Home Pages at GeoCities

Copyright © 2006 Jim Hanson Last update: March 2006
.
This page hosted by GEOCITIES Get your own Free Home Page