Web design FAQs:

Frequently Asked Questions

Q: What is HTML?

A: HTML is an acronym for HyperText Markup Language and it is a subset of the non-proprietary Standard Generalised Markup Language (SGML) Document Type Definition (DTD). HTML is the standard language of the WWW and Web browsers take a document written in HTML and interpret this language and present the document. The HTML document itself is simply a text document which includes not only the text for a Web page but also information controlling the way this is displayed -- the tags.

HTML has evolved over recent years as a standard language. There are a number of levels of HTML and the current level is HTML 3.2. In addition there are Netscape and Internet Explorer extensions to HTML which are not part of the standard language and are generally only supported by these particular browsers.

Q: Can I use graphics and HTML source that I find on the Internet?

A: Not necessarily! Just because it is extremely easy to copy graphics, HTML source and scripts from the Internet doesn't make it legal to do so. Copyright applies to material you find on the Internet just the same as in any other publishing media. However, because of the way material is published on the Internet, many authors realise that something that is good will be copied, so they're more inclined to allow copying. Most will require that you acknowledge them as the source and undertake not to alter the images or script without permission. In addition, there are many sites dedicated to making, particularly, graphic images freely available to Internet users. The best approach to take if you find something you like is to ask if you can copy it. If the worst comes to worst, then given that copyright exists on the form and not the concept, you can always copy the idea and rework it your own way, as long as you don't copy the actual graphic, source or script itself.

A: No, you don't have to learn HTML to create a Web page or two. Any reasonable Web authoring package, and this includes most current word processors, will allow you to create a straightforward Web page. However it certainly helps to understand the basics if things go wrong and your page doesn't work as you'd like it to, or if you want an effect that your Web creation software can't provide for you.

It also helps to understand what tags and attributes are part of HTML and which are, say proprietary Netscape or Internet Explorer extensions. These latter won't necessarily work in other browsers so you'll want to be aware of this before you use them thinking everybody can view their effect.

The more work you do on the Web, the more valuable you'll find an understanding of HTML will be to you.

A: Quite simply, you need to speed up your Web page because most of us can't be bothered waiting around for it to load. It takes too long, we get bored and go somewhere else. The best thing you can offer your viewer is a lean and mean Web page that loads quickly.

If you do have large files; sounds or graphics, by all means include them on your site, but warn your viewers how big they are and give them the choice of downloading them or not. In the case of graphics, you can do this by using a thumbnail graphic with a link to a larger graphic, for sound, offer a link to the sound -- don't load it automatically.

Also, use the height and width attributes in your graphic tags so that the browser knows how large the graphics are and leaves room for them. This way the text will appear quickly and your user will have something to look at while the graphics are downloading.

A: There are two main graphic formats used on the Web; .*GIF (pronounced jif) and *.JPG (pronounced jaypeg). An additional format *.PNG (pronounced ping) is being introduced but is not yet so widely accepted as the other two.

You can use graphics in other formats but your user will need a plug-in to view it. There are a number of plug-ins available on the Web which you and your users can download to view files in such formats as *.AVI and *.PDF. However, most people won't be too pleased if they spend time downloading a plug-in to view something they could have viewed in a *.GIF or *.JPG format. So, unless you really have to use a format that requires a plug-in to view it, don't!

Essentially, if you have an image in any format, you can use it on the Web if you can convert it to one of these formats. The easiest utility to use is the shareware package Paint Shop Pro, which can read graphics from a number of different formats and allows you to save them as either *.GIF or *.JPG. If you have photographic material, *.JPG is the best option to use; if you have line drawings or simple graphics using few colours, then *.GIF is the better format.

Feel free to experiment with different ways of saving files to see what is the best for a particular graphic. You'll be surprised how a change in format alone can drastically reduce file size, without much difference in quality. These are the results of saving a photo and a line drawing in the two typical Web graphic formats, you can see that while *.JPG is ideal for photographic material, it simply doesn't suit line drawings and vice versa:

A: Even a small graphic can be quite big in terms of download time on the Internet. You should try to keep your graphics as small as possible and this means keeping the file size to a minimum.

To reduce a graphic's size, start by cropping them closely. Make sure that any space around a graphic is removed, particularly if you're saving it as a *.GIF file and this area will be transparent anyway. If you want space between the graphic and your text, create this with the VSPACE and HSPACE attributes not excess pixels in your image file.

Use graphic strips. You can create a vertical graphic strip for your page only one pixel high which gives you a very small file but a neat effect. You should also consider that a black and white image can often work as well as a colour image provided you make up for the absence of colour in the image some other way on the page.

Quick navigation bars. If you're creating a navigation bar, take a look at the Microsoft pages to see a neat way of doing this. You'll find each navigation strip is a series of graphics not simply one big one. So, when you move from page to page, only the graphic representing the selection you have made needs to alter to show which is selected. As the others should already be in your browser's cache, the navigation areas will load much faster than if an entire bar had to be loaded each time.

A: If there weren't domain names, an Internet address would simply be a series of four numbers (each separated by a period and each less than 256) and you would find identifying and remembering them would be a nightmare. Quite simply, domain names are a friendly front end to the Net's navigation system. When you type a URL containing a domain name such as http://www.microsoft.com.au, this is passed to the Domain Name Service which locates the IP address that matches the domain name. From there you are moved to the computer that this address represents.

If your ISP offers you a homepage service, you'll generally find that the URL for your homepage is something like: http://www.supernet.com.au/users/~janeb/. This is acceptable for personal use and it's certainly the cheapest way of having an Internet presence. However, if you are a company or business, you may prefer to shorten this by having your own domain name such as Microsoft's (www.microsoft.com) and PC User's (www.pcuser.com.au). These names are easier to remember and they're more professional than 'hanging' off someone else's domain name.

You don't have to own your own server to have a domain name but if you don't, someone will have to provide you with a virtual server. They will generally also apply for the domain name for you. Although you can apply yourself by filling out a form at http://www.aunic.net/. You'll also need to register and delegate your name which is how the link is made between the IP and your domain name. If your ISP provides you with an Internet address that they supply and manage, then they'll do this for you. If you have your own server you can do this directly yourself. Our advice is to shop around, though, as the prices can vary significantly.

When you have your own domain name, you can move from one server to another more easily as your domain name will stay the same -- only your IP address will change. Put simply, you won't have to tell everyone who accesses or is linked to your site that you have moved.

You'll find more information on Domain names on this month's CD-ROM Web section.

A: There are a number of online validators that will take your HTML source and validate it. They check each tag and make sure that it complies with the HTML standards. Generally, you'll need to have the page already loaded on the Internet and the validator will check one page at a time. In a future HTML column we'll have a step-by-step look at using a validator to check your source. In the meantime check out these sites:

1. WebTechs HTML Validation Service: http://cq-pan.cqu.edu.au/validate/
2. And this, kinder gentler validator which incorporates WebLint: http://ugweb.cs.ualberta.ca/~gerald/validate/

A: Unless you use colours from the 'browser safe' palette, you can't be sure that the colours you see on your screen will appear the same way on other people's monitors. On-screen which, say, is only displaying 256 colours, colours not from the browser safe palette will be dithered, ie, made up of dots of a combination of colours which best approximate the colour which cannot be displayed.

If you're creating backgrounds and simple line-drawn graphics, buttons etc, then you would do well to only use those colours from the browser safe palette. You will recognise these from their RGB (red/green/blue) codes which will each be some combination of hex: 00, 33, 66, 99 CC, FF or decimal: 00, 51, 102, 153, 204, 255.

You'll find a great explanation of the 216 colour palette at http://www.onr.com/user/lights/netcol.html

A: Your first step for a makeover is to go out and have a look at other sites and work out what you like and don't like. Gather together lots of possible ideas and try to understand why some things work and why others don't. The more you understand about Web design issues, the more you can make proper choices when planning your site.

Like any design project, start by drawing a grid on paper and work out what will go where on your pages. With a grid you can plan the items on your page that will be repeated on each page (such as navigation bars and buttons) and where the variable information will go. If it doesn't look good on your grid then it won't look good on the screen. The work you do with pen and paper away from the computer will repay itself tenfold when you come to write your HTML source. When you have your page layout, pick a typical page and mock it up so you can see what it actually looks like. Don't do anything more until you've got this page looking and working properly with your final selection of colours and fonts and correct placement of logos and navigation areas etc. When this is done, the page will become a template for the rest of the pages on your site.

A: You should update your site as often as you have promised people that you will. For some people, once a month will be sufficient for some organisations, daily update is required. You should remove any "this site is always under construction" references as most people assume that the Web is an area where "hard hats must be worn" at all times and everyone's site is only hours, days or weeks from being updated or completely madeover. It's a good idea to add a "new" graphic to any new areas so regular visitors can see quickly what might have been added since they last visited. But make sure the "new" signs are down when the information is no longer fresh.

When you do update, check all your links to make sure they are current, before and after you update. You'll be surprised how many tiny errors can slip in when you update a site, so check everything is working correctly.

Every site should have a major makeover every 12 to 18 months to keep abreast of changes in what's hot and what's not on the Web. When tables and frames came in, many people madeover their sites using these new features, and now with Java and Javascript support becoming more universal, you can expect to see makeovers that take advantage of these too. And for the future? Well, style sheets may be all the rage.

A: It is important that users know what is available on your site and how to get around it. A sensible approach is a navigation area at the top, bottom or left side of the page allowing the user a choice of areas or pages on your site. If your site is complex, then dual navigation areas such as on the Microsoft site allow you to select major areas from the top bar and subareas from the left one. Whatever you choose, you should always offer text alternatives to any graphic navigation system so that users who cannot view graphics or who have turned off graphics can still move around your site.

In addition, depending on the depth of content on your site, you could include menus, tables of contents, site maps and search engines to help your users find their way around more easily.

A: META comes from the Greek word for "about" and it's an optional element that provides a place to put meta-information that is not defined by other HTML elements.

The <META> tag should appear in the header of your HTML source and it can be useful in a number of ways. One use is in providing a description of the page such as:

<META name="description" content="The Home Page of Helen Bradley, freelance journalist (PC User Magazine), author and consultant from Sale, Australia">

Including this in your header will mean that popular search engines, such as AltaVista, will pick this up and use this as a description of your site when they display search results. Without this, they'll simply use the first words of your site which could be anything, including portions of scripts etc.

If you use the keywords attribute, you can provide keywords for the search engine so that anyone searching for these words will locate your site. For example:

<META name="keywords" content="journalist, PC User, computer journalist">

will mean that the site is picked up by a more general search.

There is a good description of how AltaVista uses the META tag on its help page at http://www.altavista.digital.com/

<META> can also be used for fancy "client pull" Netscape animation tricks such as automatically loading a new page after the first page is loaded. For example:

<META HTTP-Equiv = "Refresh" content = "20; URL = page2.htm">

placed in the header of a Web page will load the document page2.htm, 20 seconds after the current page starts to load. You can use this to good effect if you have a fancy front page to your site and wish to move your users into your site quickly and automatically a few seconds after it has loaded. You should add a hyperlink to page2.htm in case a user has a browser that does not support this tag and be sure to allow plenty of time for the first page to load or your user will be moved on before the page is fully loaded.

A: Until recently, Web pages were displayed using the browsers default fonts. These were typically Times New Roman for proportional text and Arial or Courier for fixed width text (usually created using the <TT> ...</TT> tags) but that was about all. Most browsers have pushed these boundaries back and now allow the user to specify which proportional and fixed width fonts are to be used by the browser with simple Option settings. Microsoft has made additional fonts available including Impact, Comic Sans, Verdana, Georgia and Trebuchet. You can download these even if you aren't using Internet Explorer from Microsoft's site at http://www.microsoft.com/truetype/

You can specify a font face in your source using the <FONT FACE> ...</FONT> tag. This allows you to specify a range of fonts that the browser can choose from. For example, <FONT FACE = "Comic Sans", "Arial", "Times New Roman"> ...</FONT> instructs the browser to use Comic Sans as the first choice; if this isn't available then Arial and if that isn't available then Times New Roman. If none of the listed fonts are available, then the browser's default font will be used.

Make sure you type your font names exactly as they are shown and be aware that the fonts available on the Macintosh are not always available on the PC and vice versa. For example, the font Arial is not generally available on the Macintosh and you should specify Helvetica as an alternative for Arial as a sans serif font for Macintosh users.

A: What book you use depends on where you are in your HTML learning. If you're a beginner, then one of the simpler 10 minute guides is a good start. You can then add to your library by sourcing information online as you need it. There are a number of great tutorials on the Web, so if you're looking for information on Frames, for example, use AltaVista or Yahoo to find the available Web tutorials. Increasingly, the Web should be one of your first ports of call for HTML information.

Helen Bradley's personal favourites are:

• Teach Yourself HTML Publishing on the World Wide Web by MacBride, Hodder & Stroughton.
• Creating Killer Web Sites, The Art of Third-Generation Site Design, by David Siegel, Hayden Books.
• Web Concept & Design, A Comprehensive Guide for Creating Effective Web Sites, by Crystal Waters, New Riders.
• HTML Web Magic by Ibanez & Zee, Hayden Books.
• Whiz Bang Web Site F/X by Tom Lockwood, Que.
• HTML Help by The Web Design Group, http://www.htmlhelp.com/
• Dmitry Kirsanov's Top Ten Web Design Tips, http://www.design.ru/ttt/
• Absolute resource -- From Webbie to Webmeister: http://www2.southwind.net/~miked/resource.html etc
• We thank Robert Eldridge for his advice and assistance on this column.

by John Hilvert & Helen Bradley

Top of page

|What's New | Net Guides | Web Workshop | Net Sites | About PC User |
| Games | Education | General & Business | Online Tools | Utilities |
| Patches & Support files | PC User Interactive |

All text © 1997 Australian Consolidated Press - PC User Magazine