Headline, lists and image tips


Previous columns have discussed how to change the size of text by using the FONT command. For example:

<FONT size="5"> Text here </FONT>

You can achieve the same result using 'heading' tags while also reducing the amount you need to type. There are six heading tags - <H1> to <H6> - the first being the largest. It is used as follows:

<H3> Text here </H3>

The text contained by the opening and closing heading tag will take on the size associated with the tag. Additionally, the browser will incorporate a paragraph space before and after your tagged text. Using heading tags is not only a lot quicker than the FONT command, but it is also easier to maintain uniformity because of the ease of recalling previous settings.

Lists allow you to replicate the familiar look of bullets and numbering as used in word processors. There are two types of lists in HTML: ordered and unordered. In ordered lists, the items are automatically preceded with a number; unordered lists replace the digit with a bullet point. An example of an ordered list and its coding is as follows:


So far you have learned:

   1. Formatting
   2. Images
   3. Links


So far you have learned:

<OL> tells the browser that an ordered list has begun, and that every list item is to be sequentially numbered. The browser automatically places a space equivalent to a <P> before the list begins. Additionally, the list is indented to the <BLOCKQUOTE> position, and a routine space is inserted between the number and the item.

<LI> indicates each separate List Item. These are individually closed off, as is the <OL> once the list is completed. If you replace the <OL> with a <UL>, indicating unordered list, then the numbers will be replaced with a bullet point •.


In previous columns we have looked at inserting images into your Web pages. We shall now expand upon that and discuss some trade secrets with regards to images and how to enhance them on your site.

Images on the Internet

If you want to work with a graphic that is already on the Internet, hover your mouse over the image and right-click your mouse. You will then see a menu that allows you to do several things, the most popular being to save the image onto your own computer with the "Save Picture As" option. By selecting this, you can place the image anywhere on your PC for future use. You must be careful to save only images that are legally available.

When right-clicking on an image, you can also access information about the image such as width, height, file size and type: simply choose the Properties option.

Image Properties

You can insert an image into your Web page with the following code (assuming the graphic is in the same folder as your HTML file):

<IMG src="picture.gif" alt="This is a picture">

There are additional properties you should always include: width and height. By attaching these attributes to your image, you can force the browser to change the graphic to specified dimensions. Although this can be handy, if you really want an image to be a different size you should instead recreate it in a graphics program; every time the browser remasters a graphic, it takes more time for the page to load.

Even if you want to insert the graphic with its default size, you need to specify in your coding what this is. Graphics are generally slower to load than text, therefore if you don't reserve this space for your image to occupy, you may find that your text and images overlap upon loading.

Supplementary properties that may be included are hspace and vspace. By using these, you can insert horizontal and vertical buffer space around your images. Lastly, you can also align your image by including the appropriate code. An example of how to apply these tags follows:

<IMG src="picture.gif" alt="Picture here" width="200" height="150" vspace="5" hspace="5" align="right">

Join the PC World newsletter!

Error: Please check your email address.

Our Back to Business guide highlights the best products for you to boost your productivity at home, on the road, at the office, or in the classroom.

Keep up with the latest tech news, reviews and previews by subscribing to the Good Gear Guide newsletter.

Heidi Woof

PC World
Show Comments

Most Popular Reviews

Latest News Articles


PCW Evaluation Team

Azadeh Williams

HP OfficeJet Pro 8730

A smarter way to print for busy small business owners, combining speedy printing with scanning and copying, making it easier to produce high quality documents and images at a touch of a button.

Andrew Grant

HP OfficeJet Pro 8730

I've had a multifunction printer in the office going on 10 years now. It was a neat bit of kit back in the day -- print, copy, scan, fax -- when printing over WiFi felt a bit like magic. It’s seen better days though and an upgrade’s well overdue. This HP OfficeJet Pro 8730 looks like it ticks all the same boxes: print, copy, scan, and fax. (Really? Does anyone fax anything any more? I guess it's good to know the facility’s there, just in case.) Printing over WiFi is more-or- less standard these days.

Ed Dawson

HP OfficeJet Pro 8730

As a freelance writer who is always on the go, I like my technology to be both efficient and effective so I can do my job well. The HP OfficeJet Pro 8730 Inkjet Printer ticks all the boxes in terms of form factor, performance and user interface.

Michael Hargreaves

Windows 10 for Business / Dell XPS 13

I’d happily recommend this touchscreen laptop and Windows 10 as a great way to get serious work done at a desk or on the road.

Aysha Strobbe

Windows 10 / HP Spectre x360

Ultimately, I think the Windows 10 environment is excellent for me as it caters for so many different uses. The inclusion of the Xbox app is also great for when you need some downtime too!

Mark Escubio

Windows 10 / Lenovo Yoga 910

For me, the Xbox Play Anywhere is a great new feature as it allows you to play your current Xbox games with higher resolutions and better graphics without forking out extra cash for another copy. Although available titles are still scarce, but I’m sure it will grow in time.

Featured Content

Latest Jobs

Don’t have an account? Sign up here

Don't have an account? Sign up now

Forgot password?