Web Site Design Tutorial


This tutorial web site was created with and is specific to Claris Home Page on a Macintosh. However, most web authoring tools work pretty much the same. With a little intuition and fearlessness you can figure out the differences and make it work. The courseware is designed to be used in conjunction with a hierarchical structure of HTML and image files referred to as the "webclass folder". These files facilitate the ease of learning for students in a classroom environment. To use the courseware with out this set of files you must download the images off the web pages to your computer and recreate the original filing structure, or create your own and change the relative links. You will also have to copy and paste the text off the web pages and into your tutorial document. Go to this page for instructions on how to use this courseware without the class files. Eventually the webclass files will be available via FTP and a password when the course is finished and refined.

This web site tutorial is for the private use of the clients of its creator Martin Dunn/Artefx and not to be used in a professional environment without express permission of Martin Dunn/Artefx.

Lesson 1 The Basics
  • Creating and saving a new document
  • Menus, toolbars and shortcuts
  • Entering and editing text
  • Copying and pasting text between documents
  • Inserting images
  • Creating line breaks AKA soft returns
  • Inserting special characters
  • Spell checking
  • Using online help
Lesson 2 Formatting
  • Overview of various text styles
  • Formatting headings
  • Paragraph indents
  • Bullet lists
  • Editing HTML source code for text formats
  • Image borders
  • Image alternative labels
  • Document options
  • Text and link colors
  • Setting page colors and backgrounds
Lesson 3 Linking
  • Email links
  • Web site links
  • Page links
  • Image maps
  • Anchor links
  • Anchor link image maps
  • Removing image map borders
  • Using clipart
  • Dragging and dropping
Lesson 4 Table Layouts
  • Creating tables
  • Table editing (cells,rows and columns)
  • Mapping tables to hold complex images
  • Testing your layouts
  • Copying pages to use as templates
Lesson 5 Creating Web Sites and Page Layouts Quickly
  • Application Templates
  • Page Templates
  • Web page frames
Lesson 6 (Review Exercise) Creating an Online Resume

Lesson 7 Site Management

  • Using a Site Editor
  • Consolidating your files
  • Verifying links
  • Testing your web site with the dominant browsers
  • Accessing web server folders/directories
  • FTP (File Transfer Protocol)
  • Uploading your site
  • Testing your web site online
Lesson 8 (Optional) Create a Links/References Page

Start lesson 1

View the finished tutorial web site

For more information about computer
training and web design services visit


Please send your suggestions and comments to training@artefx.com