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?

Consistency

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

Create a site 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)

 

Task

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

Task

JB
Web Development : 1.2 Web design principles
© J Balfour
Tools