• User-Centricity (UX/UI): Good design always starts with the user. User Experience (UX) is the overall feeling a person has while using the site, while the User Interface (UI) consists of the specific visual elements they interact with, like buttons and menus. The goal is to create a UI that is intuitive and leads to a positive, seamless UX.

• Visual Hierarchy: This principle organises content to guide the user's eye to the most important elements first. By using size, colour, and placement—such as large headlines and bold call-to-action buttons—a designer creates a clear path for the user to follow, making the information easier to digest.

• Responsive Design: A modern website must function flawlessly across all devices. Responsive design uses flexible grids and layouts to automatically adapt a site's appearance to fit any screen size, from a large desktop monitor to a smartphone, ensuring a consistent and optimal experience for every visitor.

• Accessibility (A11y): Websites should be usable by everyone, including people with disabilities. This involves practices like adding alt text (descriptive text) to images for screen readers, ensuring high colour contrast for readability, and enabling keyboard-only navigation. It's both an ethical and practical necessity.

• Performance: Speed is critical. A website’s page load speed—how quickly it fully displays—directly impacts user satisfaction and search engine rankings. Optimisation, such as compressing images and minifying code, is essential to ensure the site loads quickly and retains its audience.

​

​

​

​

​

​

​

​​​​​

​

1. In your own words, explain the difference between User Experience (UX) and User Interface (UI).

2. A website designer wants to make sure visitors see the "Sign Up" button first. According to the principle of visual hierarchy, what are two techniques they could use to achieve this?

3. Imagine a website looks perfect on a desktop computer but is completely unusable on a smartphone. Which core web design principle has been neglected, and why is this a problem?

4. The text mentions that accessibility is an "ethical and practical necessity." Explain what this means, giving one example of how a designer can make a website more accessible.

5. Why is a website's page load speed so critical for its success, according to the text?

6. What is the key difference between how responsive design and accessibility improve a website for users?

7. A designer notices their website's images are very large file sizes, making the site slow to load. Which principle do they need to focus on, and what is one specific action they could take?

8. Why is it not enough for a website to simply have a good-looking User Interface (UI)? What other principle must it also deliver on to be successful?

​

James Bond Look for a sleek, sophisticated website that sells an aspirational lifestyle. Expect prominent trailers for the latest film, high-quality imagery, and links to merchandise from brand partners like Aston Martin and Omega. The design reinforces Bond's brand identity as a premium, British icon, targeting a global audience with a sense of luxury and action.

Fortnite This site is a hub for a global gaming community. Look for vibrant design, easy access to download the game, and a prominent shop for V-Bucks. Key features are news on seasonal updates, links to social media like Twitch, and opportunities to log in, all designed to maximise engagement and revenue through its games-as-a-service model.

The Archers The website serves its dedicated, long-term audience with episode summaries, character family trees, and news. It focuses on deepening the connection to the show's narrative. Look for a blog, podcasts, and forums that foster a sense of community among fans of this long-running radio drama, prioritising information over flashy design.

The Guardian Expect a clean, text-heavy layout that prioritises journalistic credibility. Look for in-depth analysis, investigative reports, and opinion pieces alongside breaking news. The website’s media language is serious and authoritative, designed to inform an educated, politically-aware audience and reinforce its reputation for quality, independent journalism.

The Sun This site is designed for immediate impact with sensationalist headlines and large, eye-catching images. Look for a focus on celebrity gossip, sport, and controversial stories. The busy, colourful layout is easy to scan, targeting a broad audience seeking entertainment and quick news bites, reflecting its populist tabloid identity.

​

1. James Bond: The James Bond website is described as selling an "aspirational lifestyle." What specific features or content would you expect to find on the site that support this idea?

2. Fortnite: Besides selling the game itself, what is the main way the Fortnite website generates revenue from its users?

3. The Archers: How does the design and content of The Archers website show that it is aimed at a dedicated, long-term audience rather than trying to attract new fans?

4. The Guardian vs. The Sun: Explain one key difference in the visual design (media language) of The Guardian's website compared to The Sun's, and what this tells you about their different audiences.

5. Community Building: Both Fortnite and The Archers aim to build a community. Describe the different methods they use to achieve this.

6. Purpose: What is the main purpose of The Guardian's website, and how does this differ from the primary purpose of the James Bond website?

7. Target Audience: The Sun's website is described as having a "busy, colourful layout." Why is this design choice effective for its target audience?

8. Commercial Intent: Of the five websites listed, which one is most directly focused on encouraging immediate financial transactions from its users, and what evidence from the overview supports your choice?

​​​​​

​

Web Design Glossary 
1. User Experience (UX)
The overall feeling and satisfaction a user has when interacting with a website or app. It’s about how easy, enjoyable, and efficient the product is to use.

2. User Interface (UI)
The actual visual elements on a screen that a user interacts with, such as buttons, menus, icons, and text boxes. The UI is what you see and click on.

3. Visual Hierarchy
The arrangement of elements on a page to show their order of importance. Designers use size, colour, and placement to guide the user's eye to the most important information first.

4. Responsive Design
An approach to web design that makes a website look and work well on all devices, from large desktop computers to small mobile phones, by automatically adjusting its layout.

5. Accessibility (A11y)
The practice of designing websites so that they can be used by everyone, including people with disabilities. This includes features like providing text descriptions for images (alt text).

6. Call to Action (CTA)
A prompt on a website that tells the user to do something, such as "Sign Up Now," "Buy Here," or "Learn More." CTAs are designed to encourage a specific response from the audience.

7. Navigation
The system by which a user moves around a website. This usually includes menus, links, and buttons that allow the audience to find different pages and content.

8. Conventions
The expected features or "rules" of a website that users have come to understand. For example, users expect a company's logo to be in the top-left corner and to be clickable to return to the homepage.

9. Layout
The way in which text, images, and other elements are arranged on a webpage. The layout is a key part of a website's media language and helps to communicate its purpose and brand identity.

10. Alt Text (Alternative Text)
A brief written description of an image that is added to the website's code. It is used by screen readers for visually impaired users and appears if the image fails to load.

​

​

​

​

​

​

​