Web Design Plundered from Lynch and Horton. © 2004the University of Greenwich 2 10 x don't use Frames Leading edge technology Scrolling text, marquees,

Slides:

Advertisements

Similar presentations

3.01D Design Multimedia Presentations

Advertisements

Website Design What is Involved?. Web Design ConsiderationsSlide 2Bsc Web Design Stage 1 Website Design Involves Interface Design Site Design –Organising.

UI Best Practices Application Developer’s Intro School Week 1 Day 1.

Basic Principles of Web Page Design CSCI 150, CSCI 155, CSCI , MSTI 131 and MSTI 260 Developed by BNapoli.

MMDE5011 – INTERACTIVE MEDIA PRACTICE 1 WEEK 1: INTRODUCTION TO HTML5

1Philipp Rütsche Thinking about good Webdesign Philipp Rütsche Web Office ETH Zürich.

Web design criteria University of Stellenbosch. What is on a web page? Navigational elements Text Graphics.

Interface Design 2 Week 9. Interface Design 2 :: Week 9 :: Calendar.

Designing Basic Web Sites III: Interface Design Based on Web Style Guide, Lynch and Horton Technical Communication.

NOAC 2002 E-Scouting1 Design and Layout Sage Lichtenwalner National OA Web Site Youth Coordinator.

A Beginners Guide to Web Site Design. What we will cover…. Planning your site. Creating a template. Images and Fonts. Absolute vs. Relative Links.

Chapter 2 Web Site Design Principles Principles of Web Design, Third Edition.

Web Accessibility Issues. Why Consider Access Issues ? Discrimination Numbers of disabled students in HE likely to increase Sites designed for the disabled.

Web Page Design University of Wollongong IACT303 – INTI 2005 World Wide Networking.

Web Design Guidelines By ZhengHui Hu. Planning User Analysis  Goal  Target Audience Enhance Accessible  Impairment  Environment  Technical Limitation.

Eleven Design Mistakes Making your web page easier for your students to use Making your web page easier for your students to use FSI Applications.

Navigation Design. From the Brookfield Zoo, IL  (from Zoo)

Web Design Part 2 Page Size, Screen Layout and Content.

Dobrin / Keller / Weisser : Technical Communication in the Twenty-First Century. © 2008 Pearson Education. Upper Saddle River, NJ, All Rights Reserved.

Course created by Sarah Phillips BBCD Melbourne BAPDCOM Version 1 – February 2013.

Problemsolving 2 Problem Solving: Designing a website solution Identifying how a solution will function Taking into account the technical constraints a.

Chapter Objectives Discuss the relationship between page length, content placement, and usability Complete Step 4: Specify the website’s navigation system.

Web Design, 3 rd Edition 4 Planning a Successful Web Site: Part 2.

3.02D Design Multimedia Presentations 3.02 Demonstrate interactive multimedia presentations.

Web Design, 4 th Edition 4 Planning a Successful Web Site: Part 2.

Name Teacher: Group: 1 Unit 2 – Webpage Creation.

Website Planning and Design

Web-designWeb-design. Web design What is it? Web-design features Before…

First things, First Do you belong in here? – 10 – 12 – Comp. Discovery or Keyboard/Comp Apps – Do you have any experience with Web Page Design?????

3.02D Design Multimedia Presentations 3.02 Demonstrate interactive multimedia presentations.

Chapter 2 Web Site Design Principles

Human Factors in Web Design Mohsen Asgari. Contents WWW & Human Factors Relationship Human and Computer Interaction HCI & WWW Information Presentation.

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;

An Introduction To Websites With a little of help from “WebPages That Suck.

Website Accessibility. What is Website Accessibility? Making information on the internet usable and understandable for EVERYONE, including those with.

Creating a Usable Web Site Royce Shin - Web Development University of Minnesota.

Web Design School Website Best Practices A Balance Between Professionalism and Creativity Professiona l.

Chapter 2 Web Site Design Principles Principles of Web Design, Third Edition.

Group 3: Art Gallery Monica Almendarez Content/Project Manager Willliam Egle Technology Manager Christina Pié Usability/ADA Compliance Manager Mirjana.

Slide 1-1 The Web Wizard’s Guide to Web Design by James Lengel.

Software. A web site is a collection of web pages on a particular topic. A web page is a document written in HTML code. Web pages are linked together.

Introduction to Multimedia Review 1 - Lecture Notes Semester 1.

Adobe Certified Associate Objectives 1 Setting Project Requirements.

Web Site Design Plan Checklist Web Design Presented by: Angelo Russo #10 11/22/2014Angelo Russo #101.

To be completed Your proposal  Your House style  Your site plan  Page plans (a draft layout for each of your five pages)  A design mock-up -  All.

The Good, the Bad & the Ugly: Style and design in Website creation Chris Webster: Information Officer and Website Manager at the EARL Consortium for Public.

A centre of expertise in digital information managementwww.ukoln.ac.uk Accessibility and Usability For Web Sites: An Introduction to Web Accessibility.

Web Design Standards. What makes a good website Well Organized, Easy to Navigate – Provide multiple ways to connect to the same page – Use the “Hyper”

Introduction. Internet Worldwide collection of computers and computer networks that link people to businesses, governmental agencies, educational institutions,

Making the website. Get your folders sorted first Create a new folder in “N” called “My hockey website” Create folders inside called “Documents”, “images”

Chapter 2 Web Site Design Principles

MIT 511- Web Design & Usability

Objective % Select and utilize tools to design and develop websites.

Create and edit web pages 4

Web-based structures, links and testing

Lecture 4 Web Design. Part 1.

Web Site Design Plan Checklist

Thinking about good Webdesign

Objective % Select and utilize tools to design and develop websites.

Introduction to Web Accessibility

Web Design and Development

Page Size, Screen Layout and Content

Unit 2 – Webpage Creation

Web Technologies for Business

A01 DESIGN To be completed Your proposal  Your House style 

Website Planning EIT, Author Gay Robertson, 2018.

Website production.

Interface Design 2 Week 11.

CS7026: Authoring for Digital Media

Presentation transcript:

Web Design Plundered from Lynch and Horton

© 2004the University of Greenwich 2 10 x don't use Frames Leading edge technology Scrolling text, marquees, animations Complex URLs Orphan pages Long scrolling pages Lack of navigation support Non-standard link colours Outdated information Long download times

© 2004the University of Greenwich 3 Layout, avoid tables? Use CSS for position Often difficult to maintain Inflexible % width vs specified width Browser differences Nesting takes longer to render Search engine optimisation Accessibility Printing

© 2004the University of Greenwich 4 Interface Design Issues Web pages versus conventional documents Page independence Author – validity of information Title Revision date Home page/site reference Target audience needs

© 2004the University of Greenwich 5 User centred Navigation Direct access Bandwidth Consistency Sitemap feedback Accessibility Organisation of information Interface Design Issues

© 2004the University of Greenwich 6 Navigation How does page 6 in this sequence deal with this situation? Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 7 Consistency in Page Layout Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 8 Use of Tabs Patrick J. Lynch, Sarah Horton, 2001

Direct Access - Dead Ends Patrick J. Lynch, Sarah Horton, 2001

Graphics as Navigational Aids Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 11 Site Structure File and folder structures Hierarchy Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 12 Site Elements Home page Menu based News based Path based Splash screens Page templates Site guide/map Search facility Contact Feedback

© 2004the University of Greenwich 13 Intranet Use/Cost Sun Microsystems Intranet – mid 1990’s Employees accessed average of 12 pages per day Redesign: saving of 5 minutes per week per employee = 10 million dollars per year

© 2004the University of Greenwich 14 Page Design Visual hierarchy Consistency Dimensions Length Layout Frames Cross platform issues Accessibility

© 2004the University of Greenwich 15 Typography Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 16 Justification Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 17 Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 18 Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 19 Case Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 20 Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 21 Anti-aliasing Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 22 Style Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 23 Balance Patrick J. Lynch, Sarah Horton, 2001

Gutters Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 28 Visible Area Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 29 Browser Screen Size Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 30 Links Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 31 Link to Homepage?

© 2004the University of Greenwich 32 Graphics Is it a picture? Is it a map with links? Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 33 Bandwidth – Page Load Time Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 34 Patrick J. Lynch, Sarah Horton, 2001

© 2004the University of Greenwich 35 Multimedia Audio music speech Video streaming format (plug-ins)

© 2004the University of Greenwich 36 Accessibility Guidelines WWW Consortium W3C standards User tools e.g. Large Print Viewers Authoring tools A-Prompt, Web Accessibility Verifier, see: WebXACT  Web Page Accessibility Verifier, see: Browsers with Built-in Voice Feature Home Page Reader – IBM, see: Government initiatives section 508

© 2004the University of Greenwich 37 References Patrick J. Lynch, Sarah Horton, 2001, Web Style Guide 2 nd Ed, Yale University, see: Accessible Web Page Design, 2003, see: desin.htmhttp:// desin.htm Web Content Accessibility Guidelines 1.0, 1999 and 2.0 (working draft), 2003, see: Designing More Usable Documents, 2003, see: Designing More Usable Web Sites, 2003, see: Websites That Work (video – 15 mins), RNIB, see Web Accessibility Initiative (WAI):