Site Design

Let's assume you will use the cheapest site host, the "free" space you have as part of your ISP (Internet Service Provider) dialup, cable or DSL (Digital Subscriber Line) account. These are the folks you pay for your e-mail account. Your URL will be whatever your ISP assigns. Usually in the form http://www.mindspring.com/~workshop. You need to look at their web site or call and ask. This will also tell you the procedure for uploading your pages (placing them on their computer). If you want to take money, get your own domain or look into other site hosts, see the appendix.

Web pages consist of HTML (Hyper Text Mark-up Language) code. You can write HTML using any word processor that come with your computer (including Wordpad or Simple Text). This is often difficult for people who aren't into computers and especially so for visually oriented folks. www.usability.gov is a great reference for what works and what doesn't. Also see www.webpagesthatsuck.com for things to avoid.

Look at what others are doing. Some conventions make displaying certain types of information easier. If you find a page you like, you can always save it to your hard drive (While viewing page choose File, Save as, Web or HTML file type) and take out their stuff and replace it with yours: Please respect their copyright: you are tying to learn from their structure, not duplicate their art.

Software for creating web sites:

Many ISPs have their own free site creation software. It is often limited and painful to use but they are getting better. Other choices include:

It's easy:

Open editor, type text, insert graphics, make links, save page (the first page of your site should always be named index.html or index.htm.), upload to server.

Parts of a page

Header:

Body:

You can't control exactly what the user sees (and shouldn't: vision impaired folks often browse without graphics or set their font size large). If you want control use Adobe PDF format and include a button to download the free reader (www.adobe.com). This is good for catalogues and newsletters that people will probably want to print (the IRS uses it for their forms). PDF of this Handout.

Tables, frames and cascading style sheets are ways to control placement of text and graphics: each has drawbacks. Tables are best right now but cascading style sheets are the coming method (only modern browsers support them, see audience comments above).
The CQA site uses cascading style sheets. The Getting started page of this site uses tables, the Design page (this page, if viewed properly) uses frames; see it without frame.

Graphics formats: Getting graphics into your computer can be by CD, scanner or digital camera. Use fast loading appropriate graphics. 72 DPI (dots per inch) and not larger than about 500 pixels tall and 600 wide; try not to exceed total size of 70K. Use thumbnails (75 to 100 pixel square miniatures) to link to the larger image for those who want it. JPG is the format to use for photos and GIF for drawings (although other formats are being discussed, they are not universally accepted). The software to do this often comes with your scanner or you can buy Adobe Photoshop Elements, the $99 cheaper version of the software every graphic artist wants to play with.

Links to other URLs: make it clear when a link will take a user off your site to someone else's. Use links to "bookmarks" called anchors further down the page to make a long page easy to navigate. (go to the bottom of this page)

Sketch out your pages and their links before sitting down at the computer.

Remember, not everyone will enter your document from page 1. You want them to easily figure out who you are and what kind of page it is wherever they enter. Beware of frames for this reason: if you use them, have a home button at the bottom of each page.

Maintenance:

Summary: Order of Tasks

1. Decide purpose

2. Develop page layout

3. Write code

4. Test with different browsers

5. Upload to server

6. Test again, especially links and overall feel (loading speed etc.)

7. Advertise address, submit to search engines

8. On-going maintenance and evaluation to keep site from going stale.

(go back to links section)


Getting Started
Appendix
(hardware and costs)

A talk given on 1/12/02 to the Contemporary QuiltArts Association of Seattle by Karen Seymour, The Computer Workshop

Copyright 2002, Karen Seymour