Slides badge

Web Design principles

Learning Intentions

  • Understand the idea of visual layout and how it affects our websites

  • Know how to add multiple pages and understand that most websites are built with multiple pages

Success Criteria

  • I can describe how visual layout and visual elements help to make a website easy to use

Use Google Chrome!

An inspiring read - Don't Make Me Think

User interface (UI)

A user interface is how we present our content on our websites. A good user interface would be:

  • Simple – easy to understand and avoid unnecessary content
  • Consistent – most if not all pages on the site look similar but with different content
  • Laid out well – websites should follow a good layout pattern and use colour and different font styles to represent different things.
  • Interactive – when a user expects to be able to click somewhere to do something (for example a link to another page) it would do just that.
  • Easy to navigate – navigation should be easy to find and going between pages shouldn’t require you to think too much

Good or Bad?

Good or Bad?

Good or Bad?

Good or Bad?

Good or Bad?


Consistency is one of the most important things in web development. All pages, with the exception of the front page, must follow a similar pattern/layout in order to ensure that users have the most seamless and perfect experience possible. 





Without consistency, the user would need to have to think about things like where to find the search box on a website.

When you’re creating a site, your job is to get rid of the question marks. 

- Steve Krug

Design a website about a topic of your choice from the list below:

  • About a film or game (remember games are mostly blocked) you like
  • About a band you like
  • About a place you like
  • About the school
  • About a famous person

Your website needs to have:

  • Text discussing the topic
  • At least three image
  • A video (it doesn’t have to be related to the subject)


Your next task is to design a website with three pages in it.
Make these pages as consistent as possible


Presentation Overview
Web design principles
© 2020 - 2024 J Balfour
20:50 | 23-05-2024
Join Live Session
Start Remote
Save Progress
Slideshow Outline
Presenter Mode
Widget Screen
Canvas Controls
Random Selector
Volume Meter
Binary Converter
Python Editor
Show Knox 90
Provide Feedback
    DragonDocs Management
    Random selector
      Binary conversion
      Denary to binary conversion
      Binary to denary conversion
      Feedback 👍

      Apply a filter:

      All slideshow files