Are you almost ready to publish a web site for the first time? If so, follow this checklist, and you’ll avoid many of the common writing and navigation problems that might prevent your visitors from accessing or fully appreciating your content.
Drag-and-drop editing tools make it notoriously easy for you to create and upload a website that works fine for you, but won’t work for anyone else. Use someone else’s computer to check your site. (Usually the problem is you are including an image or link that points to a specific file on your computer’s hard drive, when instead you should upload a public copy of that resource and point to its public URL.)
Web pages are designed to flow, so that the text fills up a variety of different screen sizes. It’s simply not practial to lay out a web page with the same kind of control you would expect to have over a printed page — but if you learn how to use cascading style sheets it’s possible to alter the layout of your page so that it better fits the size of the page. (The WordPress theme “Responsive” does a pretty good job of scaling a website, so that the content appears in three columns when the page is wide, but a single column when the page is narrow. See stagerightgreensburg.com for an example of a page that responds to the width of the user’s browser; the site also uses WPTouchPro to present a mobile-friendly version of the site.)
You’d be surprised at how many people skip this step. If you have copied your website to or from a USB drive, you may find your links broken — especially if you used a WYSIWYG editing tool.
My former student Grammarissa adds, “Also helpful: making sure that download links are labeled as such. (If I click on a link, I shouldn’t automatically get a PDF or Word document… Tell me it’s a PDF or Word doc before I click!)”
To learn about Rainbow Hector, click here. | |
Visually impaired web users frequently scan web pages by instructing their computer to read aloud all hyperlinks. Sighted readers assess web pages in much the same way.Since web visitors decide in a matter of seconds whether your page is worth reading, when you choose bland, content-neutral words for your hyperlinks, you miss an important opportunity to communicate. | |
Somebody tell me, who is Rainbow Hector? | |
In this case, the linked words suggest what will be at the other end of the link, which helps the reader decide whether to click. |
Another way to make your links informative is to follow them with a blurb.
Blurbs: Writing Previews of Web Pages
A blurb is a short paragraph that previews what’s on the other end of a link. You’re reading a blurb now. If it helps you decide whether you should click the link, then it has done its job.
Hypertext documents are made up of numerous smaller documents joined together by links. Unlike print pages, web pages can be organized in many different ways. Since you don’t know where your reader came from or where your reader is going to go next, simple labels such as “next” or “page 2” are as useless as “click here“. Schools are still mostly teaching the kind of writing skills that produce good print documents, and print documents don’t need navigation. Thinking about navigation is not something most people do when they sit down to write web pages for the first time.
Navigation: an often neglected component of web authorship
To make the best use of hypertext, you should not blindly follow the convention of printed, linear text. Instead, divide your content into logical, free-standing units that can be strung together like beads, in different orders.
Is the title at the top of each page informative enough that a visitor can tell at a glance what your page is about, even if they haven’t seen any other pages on your site?
| My Home Page |
| New Page |
Newbie Web Author Checklist: Before you publish that project… |
Look at the text in the horizontal stripe at the very top of your browser window. This is the “out-out-of-context title.” Does it read “New Page 1”?
If so, change it to something more informative. (See: “Titles for Web Pages: In Context and Out of Context“)
Minimize barriers (time, space, scrolling, clicking) between your users and your best content.
As a writing teacher, I have a pro-text bias, but I’m not the only one who thinks splash pages are evil. Users who have clicked on a link have already chosen to visit your site… they do not need to be shown a fancy image that tells them “Click Here to Enter!” and they won’t appreciate having to wait for it.
Get rid of wasted space at the top of the page, and move the content up higher on the page. Shrink that logo and move that long-winded mission statement to an internal page; use the space you recovered to tell me what’s new on your site, so I won’t have to hunt for what you’re so eager to share.
Most online photos should be no bigger than about a playing card. If your readers like the picture, they can follow a link to a full-sized version.
Graphics can take a lot of time to load. Even if you drag the corners of the picture so that the image looks smaller on your screen, you are still forcing your web visitors to download the full-sized picture.
You can reduce the size of your image files by using a photo editing tool to reduce the number of pixels (colored dots) stored in the image file. Save photos in .jpg format and graphics (like decorative stripes or cartoons) in .gif format.
FrontPage has a very convenient “thumbnail” feature that will automatically create a smaller version of your picture and link it to the larger one. (Look up “thumbnail” in the FrontPage help file — it’s a two-click process.)
While you may feel tempted to upload a sound clip that plays every time your page loads, or add dancing hamsters or falling snowflakes to your background, or a pretty picture that invites visitors to “enter” your site, keep that frivolous stuff on a special “fun and games” page.
If the purpose of your site is to showcase your photography, then naturally you would want to make your photos prominent; however, most readers will want to choose to view or play any large media files, rather than have them start loading instantly.
Was the task “Fiddle around with layout and color for a while, and then publish in whatever you’ve got”? Or did you set out to help your visitors accomplish a specific task? How do you know that your visitors can actually use your website to accomplish whatever you expect them to do on your site? How many times have you found yourself lost in someone else’s website, not knowing which menu option to choose?
Will your website make sense to strangers who are too busy and grouchy to read the instructions? (See: “Usability Testing: What is it?“)
If you chose to create a web site, your pages will join a huge network of existing, interlinked pages — a hypertext. Hypertext requires links. Create meaningful connections between the pages that you yourself created and to pages that already exist on the Internet. (If you have taken an ordinary document, sliced it up into pieces, and strung them together with “next” links, then you haven’t written hypertext.)
Use page titles, section headings, bulleted lists, and bold keywords to help your reader determine what’s important on your page.
“If I’d had more time, I’d written a shorter book.” –Mark Twain
All good writing is the result of a process that includes multiple drafts and revision. Fiddling with fonts and “cool” text effects is fun, but don’t fritter away so much time that your content suffers.
Dennis G. Jerz
Nov 2002 — first posted
Apr 2003 — updated
Jun 2003 — tweaked
24 Jun 2013 — tweaked
Tips & Warnings |
Avoid non-standard “Advanced Features” While web-authoring tools such as MS-FrontPage typically offer such “advanced” features as auto-navigation menus and special text effects, these doo-dads won’t all work on standard (that is, non-Microsoft) web servers. While I repeatedly warn my students about this issue (see the sidebar on myFrontPage tutorial), some simply can’t avoid the temptation to explore what inititally appears to be a cool time-saver. (These students are often frustrated because they later realize that the time they spent trying to get a particular special effect to work might have been better spent on usability testing.)Avoid frames. They may at first appear to be a good solution to certain problems, but frames cause more problems than they solve. (See: “Frames Suck (Most of the Time)“.) |
Technical Help |
Making a Web Site with FrontPage. This document will guide you through the basic steps of creating a web page with MS Front Page 2000.Publishing a Web Site to Geocities. This document assumes that you have already created a simple website with MS FrontPage, and that you want to publish your page in order for the rest of the world to see it.Web Publishing Handouts. An excellent collection of documents from UWEC’s Information and Technology Management group, supervised by Kathy Finder. |
View Comments