Full day training course offered at Usability Week London

Web Page Design

The Anatomy of High-Performing Web Pages

The basic unit of Web design is the page. Pages are the destinations users navigate to and where you put your content. When user expectations are met on destination pages, they are delighted and more likely to convert.

Ensure a good first impression by applying the 4 A’s to web page design: Attractiveness, approachability, attention, and action. In this course, you will learn the page design principles that influence the extent to which a website or intranet meets both its business objectives and user goals.

"If you want to learn how to clean up your web pages to attract more viewers this course will help a lot! You do not want to overload consumers, clean and clear is key!"

Samantha Spacone, Graphic Designer
PromGirl, LLC

Please note: This course focuses on web page design, and does not cover interactive tools or web-based applications. If you are designing web applications, please consider our course on Application Design for Web and Desktop.

Topics covered

  • Understand how page elements can influence user behavior and meet your business objectives
    • Determining page goals
    • Concept to page design
    • Evaluating page design
  • Formatting and layout
    • Page density
    • Designing on a grid
    • Productive use of areas that generally attract less attention
    • Scrolling and the page fold
  • Priority and competition between page elements, what attracts users' attention
    • Visual design
    • Typography
    • Position
    • Size
    • Style and weight
    • Contrast
    • Color
    • Whitespace
    • Actionable parts (such as an applet)
    • Animations, auto-playing or rotating, and refreshing
  • Responsive design and mobile considerations
    • Tips for taking the Responsive Design approach
    • Layout patterns and uses
    • Prioritizing content across breakpoints
  • User behaviors with web pages
  • Eyetracking evidence of where people look
    • Residual fixations
    • Priority spots
    • Traditional page: navigation, content (the rest)
    • Columns, half-columns, and widgets
  • Navigation elements
    • Mega menus
    • Functional footers
    • Within-page navigation (such as tabs)
    • Sticky navigation and parallax scrolling
  • Visual and multimedia elements
    • Images
    • Carousels and hero graphics
    • Infographics
    • Tables
    • Modal windows

Free Material with Course Attendance

This 355-page report offers 83 recommendations for web writing and content layout, plus 102 detailed findings about how people read on the web, including scanning patterns revealed as we used eyetracking technology during usability tests.

Format

The basis of the course is a lecture format with a couple of group exercises to reinforce the learned principles and guidelines.

The course also includes:

  • Findings from our own usability studies
  • Plenty of inspiring screenshots that we deconstruct to show why they work and where they fail
  • Opportunities to ask questions and get answers

Instructor

Aurora Bedford

Aurora Bedford is a User Experience Specialist with Nielsen Norman Group.

Prior to joining NN/g, Bedford was a User Experience Designer at a web development agency, where she created and refined user workflows, site architectures, and wireframes for a variety of e-commerce and branding websites, web-based intranets, and mobile applications. Her experiences as a front-end web developer allow her to create effective designs while balancing technical and business needs. Read more about Aurora.