Web Page Design

Some Terms Cascading Style Sheet, (CSS) –a style sheet language used to describe the look and formatting of a document written in html; to change the appearance of your web page; eg. to label all instances of “KB’s Chooks”, with a descriptive name and associate a font, size, and color with it. –URLs, uniform resource locator or web address of a page

Some Terms URLs can be either absolute or relative –An absolute link is the full address of a web page or file –Relative link, used when the page doing the linking is on the same website and in the same folder

Design Choosing conventions applying to the web page format Name the home page, index.htm; (these files regarded as special files by web servers and automatically deliver the file in the site’s main folder Names of files, short and meaningful Limited to 16 characters, and contain only letters, nos. or underscore

Design Choosing conventions applying to the web page format –Screen Size Note some users have smaller screens, bottom of index pg should contain recommended screen size Length of line of text, no longer than 60 characters

Design Choosing conventions and applying formats –Index page Should contain contact address, date of last modification and author or company’s name & contact details –General Tips Place text & images within dimensions of screen size so don’t have to scroll down Limit scrolling to two average screen sizes Use bold and italics sparingly Avoid underlining words Each page with consistent navigation buttons Each web page a button that links to home or index page

Design Choosing conventions and applying formats –General Tips contd Images, save in appropriate format, eg. gif, jpeg Reduce image size by compression, jpeg or gif Rule of thumb, all images < 30 kb to ensure quick loading Raster graphics, eg. bmp, larger files Vs vector graphics, mathematically drawn, smaller files Color; –choose contrasting colors for background and tex –Avoid reg and green –Allow ample white space –Limit the variety of colors

Design Elements of design –Easy to obtain relevant information –Website that doesn’t take too long to load –Navigation needs to be clear and concise –Use of thumbnails as pictures –Use different browsers to check appearance of website –Color of visited links changes if a visitor has clicked on it before –Clear consistent presentations –Backgrounds need to be plain