ICT tutor: A M Higgins
link to home pagelink to touch sensor programlink to light sensor programlink to screenshot explanationlink to notes on learninglink to related images

image of red tack

Web design do's and don'ts




These web pages may assist you in completing the Lego assignment which is worth 95% of your mark in Educational Technology.

Before getting started please follow the instructions e-mailed to you on 9th September 2005. To access them directly:

Click here for preparatory work

Let me know if there's anything else you'd like me to add to these pages. AMH



The folder you submit at the end of October will look something like this:

screenshot of folder contents

The last file on this list is the robot program which you will probably already have saved into the 'vault'. Doublecheck that you've saved it to the assignment folder too.

You may prefer the file names to resemble the Page Titles and reflect the contents of each page e.g. reflection.html or credits.html or learning.html (NB Lower case, no gaps)

The home page MUST be called index.html

ZIPPING: Remember, if you do not send e-mail through Outlook Express, just save the zipped folder to a location where you'll be able to find it (- it usually defaults to My Documents -) and attach it to the e-mail you're sending to Kevin.

back to top



  • Do reduce images before they are placed in the images folder.
  • Do save images in gif or jpg format.
  • Do let the user know what images are linked to. You could use a caption as well as Alt text.
  • Do make the border around linking pictures = 0 if you want to avoid a blue square around an image that is used as a link.
  • Don't use bitmaps.
  • Don't stretch small images to 200 by 200 - they become distorted.
  • Don't include images in the folder that are not used on the site. Only include the images you're using. Remember the folder can be a maximum of 500k in this assignment.


  • Do save the home page as index.html. You may call the next one page2.html (lower case, no gap).
  • Do make the page titles (as opposed to the file name) more descriptive than index or page 2 and reflect the theme of the page.
  • Do make the links go to the stated pages i.e. home goes to the index.html page
  • Do use a colon and not a semicolon in the e-mail link i.e. mailto: (not mailto; )
  • Do remember that a mail address is not http (e.g. http://www.homersimpson@yahoo.com ).
  • Do include the full date of your last update.
  • Do place your name, the date and the copyright symbol on all pages.
  • Do insert copyright as follows: Insert characters and symbols -
  • Do let the user see what page they are on.
  • Do have a text link to the other pages, not just images.
  • Do avoid serif fonts such as Times New Roman. Use sans-serif fonts such as Verdana, Arial or Comic Sans
  • Do include your name on the folder - or call it by your student number
  • Do avoid having several different fonts on the one page.
  • Do check out the colours in different browsers e.g. pink text and link colours. (Try Netscape Navigator as well as Interent Explorer.)
  • Do keep the pages looking consistent - same text size and font for doing the same activities e.g. links. Aim for same background colour on each page.
  • Do make pages as short as possible. Look how tedious this page is. All that scrolling. Use 'back to top'. (Requires a link to an anchor at the top of the page.)
  • Do make the table border= 0 if you don't want people to know it's a table
  • Do consider using the table to control the whole of each page in the Lego assignment e.g. to prevent the text from going the whole way across the screen.
  • Do make sure the sites you link to aren't questionable. Adding .com to something doesn't always land you in the correct spot.
  • Don't link to an address you made up. It'll look as though you made a mistake in the process.
  • Don't have Page1.html.html or Page2.html.html
  • Don't undeline text as users will think it's a link.
  • Don't leave spaces in the file names as they'll end up as %20 when linked. Causes problems.
  • Don't make the text blue if the links are blue as well. This is a convention.
© A M Higgins
Disclaimer: A M Higgins accepts no liability for any loss or damage arising as a result of use of or reliance on this website, nor for the accuracy or integrity of material accessed via links from this site.
back to top