Content Design Cognitive Design Audience Considerations Navigational Design Layout--- Physical & Logical Designing Graphical Elements Interactivity

Transcription

1

2 Content Design Cognitive Design Audience Considerations Navigational Design Layout--- Physical & Logical Designing Graphical Elements Interactivity Design Designing for time Experimental Design

3 Precedence Spacing Navigation Design to Build Typography Usability Alignment Clarity Consistency Contd

4 Precedence You have many tools to achieve precedence Position Where something is on a page clearly influences in what order the user sees it. Color Using bold and subtle colors is a simple way to tell your user where to look. Contrast Being different makes things stand out, while being the same makes them secondary. Size Big takes precedence over little (unless everything is big, in which case little might stand out with the help of Contrast) Design Elements if there is a arrow pointing at something, guess where the user will look?

5 An Example of Poorly designed Website Do not mix orange, yellow, black, more orange

6 Spacing Line Spacing Padding Text should not be touching other elements like image, borders, tables White spacing Used to give balance, contrast and proportion to the page.

7 Navigation Navigation Where can you go? Orientation- Where are you now? Site for discovering beautiful places through out the world, But where is Home?

8 Design to Build Can it actually be done? What happens when a screen resizes Are you doing anything that is technically difficult Could small changes in your design greatly simplify how you build it? For large sites, particularly, can you simplify things?

9 Typography Font Choices Font sizes Spacing Line Length Color Paragraphing

10 Usability Adhering to Standards Think about what users will actually do Think about users tasks

11 Alignment Makes the design more clear

12 Clarity Keep shape edges snapped to pixels. Make sure simple text is created, which is understandable by all. Contrast should be high so that borders are clearly defined. Over-emphasize borders slightly to exaggerate the contrast.

13 Consistency Consistency means making everything match Heading sizes, font choices, coloring, button styles, spacing, design elements, illustration styles, photo choices, etc

14 Is the information developed and published by a credible source Check the domain name.gov,.mil,.us,.ca,.edu,.net,.com,.org Identify the purpose of publishing information on the internet Check for the ~ tilde in the URL ~ tilde in URL indicates that this information is published by an individual or may not reflect the originating domain Determine who authored this information Author qualification and address etc. Contd..

15 Is the content rich and valid for research Determine if, content is fact or opinion. Check how current is the information. Consider how rich is the information.

16 Design your site, so it looks professional Make it easy to verify the accuracy on your site Show that there is a real organization behind your site Highlight the expertise in your organization and in the content and services you provide. Show that honest and trustworthy people stand behind your site Make it easy to contact you Make your site easy to use and useful Update your sites content often Use restraint with any promotional content (eg. Offers, ads)

17 Web accessibility means people with disabilities can use the web. It means, people with disabilities can perceive, understand, navigate and interact with the web and they can contribute to the web. Aging people should also be able to use the web Contd..

18 Why is web accessibility Important? Web is an important resource for all parts of life For example, education, sports, research, household, government, health care etc. Web access is important to provide equal access and equal opportunity to people with disabilities Web accessibility major responsibility is on Web Developers

19 Some of the rules to be followed to make the Web available for everyone. Poor Eyesight Text and images should be large and/or enlargeable Color blind Links should be underlined as well as coloured, Motor skills Provide clickable links and large areas. This helps users who cannot control a mouse with precision. Pages can be coded so that users can navigate by means of the keyboard alone, or a single switch access device alone, Deaf and dumb Videos should have captions or a sign language translations.

20 To achieve better usability, there are few do s and dont s Don t make users think Don t test users patience Manage to focus user s attention Strive for feature exposure Make use of effective writing Strive for Simplicity Don t be afraid of white space Test early, test often.