1. 44212: Web-site Development Web-Site Design Ian Perry Room:C48 Extension:7287 E-mail:I.P.Perry@hull.ac.uk http://itsy.co.uk/ac/0607/Sem1&2/44212_WSD/

2. Ian Perry44212: Web-site Development: Web-site DesignSlide 2 Where to begin?  Define your Business Goals: decide which business processes are best supported (or replaced?).  Be clear why you are creating this site: by deciding what you want your Web-site to Be and Do.  Make sure that you: Know your Audience!

3. Ian Perry44212: Web-site Development: Web-site DesignSlide 3 Audience Analysis  Who do you want to reach: why might they come? where are they in the E-business Supply Chain?  Based on your business goals: what action do you want them to take?  Web-site design is very different for: a news/newsletter site. a information/technical support site. a product/services sales site.

4. Ian Perry44212: Web-site Development: Web-site DesignSlide 4 Why & How Often might they Visit?  Why? to read company/product/service descriptions; with detailed up-to-date information. to communicate, by; filling in on-line forms, participating in on-line discussions, completing on-line surveys, requesting that someone e-mails/phones them back. to purchase products/services. which often need to be delivered in the ‘real’ world.  How Often? infrequently, weekly, daily, more often.

5. Ian Perry44212: Web-site Development: Web-site DesignSlide 5 Where do they come from?  A number of technical constraints might apply, e.g: Bandwidth not so relevant these days. Browsers not everyone uses Internet Explorer. Video & Sound don’t expect everyone to have a top of the range Graphics Card, or to have their sound turned on.  All too often: Designer = High-spec Computer. Customers = Lower-spec Computers.

6. Ian Perry44212: Web-site Development: Web-site DesignSlide 6 Design Decisions  What are your assumptions about user preferences? Will information be consumed on screen or printed for later?  How patient will your audience be? Simple, static, mostly text-based Web-sites will be fast and clear; but can seem dull. Complex, interactive, multimedia Web-sites may be more interesting; but might be slow & confusing.

7. Ian Perry44212: Web-site Development: Web-site DesignSlide 7 More Deign Decisions  Balance of Text & Graphics lots of text with few graphics. lots of graphics with little text.  Typography big & bold, youthful, elegant, artistic, etc.  Media Mix static images, animation, sound, video, etc.

8. Ian Perry44212: Web-site Development: Web-site DesignSlide 8 Yet More Design Decisions  Design & Graphic Style award winning, avant-garde, friendly & reassuring, ‘in your face’, etc.  Colour Palette earth tones, psychedelic colours, soothing pastels, etc. try to use contrasting, non conflicting, colours!  Logos & Branding style, location & frequency.

9. Ian Perry44212: Web-site Development: Web-site DesignSlide 9 Remember your Audience  You are NOT designing for yourself: design is no substitute for functionality.  Make it easy to find what matters: snail-mail addresses and telephone numbers should not always be easily found!  Have realistic expectations: even if they are modest ones.  Start small, but design for scalability: Web-sites suit a phased development, but “Under Construction” notices are BAD!

10. Ian Perry44212: Web-site Development: Web-site DesignSlide 10 Things NOT to do on a Web Page  Here are what I believe to be the most important things to avoid.  Don't crowd images. Too many images: can be confusing, may not ‘fit’ on a screen set to a low resolution, and will make your Web pages slow to download.

11. Ian Perry44212: Web-site Development: Web-site DesignSlide 11 Things NOT to do!  Don't be inconsistent with structure. Inconsistent structure leads to confusion: where the hell am I? is this the same Web-site? Consistent structure is comforting: a nice place to visit. easy to navigate. easy to find things.

12. Ian Perry44212: Web-site Development: Web-site DesignSlide 12 Things NOT to do!  Don't have too much information on a single page. Too much information(?): becomes data; i.e. may not be read, or understood. Keep it short & snappy: break things up into a number of short, hyperlinked pages.

13. Ian Perry44212: Web-site Development: Web-site DesignSlide 13 Things NOT to do!  Don't leave the important stuff for the bottom. Say what needs to be said at the top of each Web page: Your audience may not make it down to the bottom of the page. Another reason to keep it short & snappy: Web pages are meant to be read on a computer screen, which is a totally different ‘shape’ to the ‘usual’ A4 document.

14. Ian Perry44212: Web-site Development: Web-site DesignSlide 14 Things NOT to do!  Don't violate white-space balance. This can be tricky. A matter of personal preference? Too much white space And you are ‘wasting’ the limited resource that is the computer screen. Too little white space And your Web pages look ‘crowded’.

15. Ian Perry44212: Web-site Development: Web-site DesignSlide 15 Things NOT to do!  Don't forget other platforms & browsers. The person viewing your Web Pages is very unlikely to have the same Computer and Software that you have: and even if they do, the chances of that Computer and Software being set-up in exactly the same way are remote. When evaluating your Web-pages: always ask yourself, what if someone was looking at this; using a different browser, on a different computer, at a different resolution?

16. Ian Perry44212: Web-site Development: Web-site DesignSlide 16 “Keep it Simple”  And your Web-site will be: easier to build; consistent structure, common ‘look-and-feel’, easier navigation, etc. easier to maintain; no Web-site is ever complete, they are always ‘under construction’, so NEVER say so!  And remember that “less is definitely more”: except when it comes to testing!

17. Ian Perry44212: Web-site Development: Web-site DesignSlide 17 Before Next Week’s Workshop  Please explore the; ‘Web-site Design Links’,  on the ‘Other Resources’ page of the ‘WSD Web-site’; in order to find out what is considered to be “good” and/or “bad” with respect to Web-site Design.