BTEC Level 3 IT Unit 6 Website Development Assignment Answer Guide

08 Oct, 2026 /

Author : Christopher Anderson

This guide covers Unit 6 Website Development from the Pearson BTEC Level 3 National in Information Technology (2016 specification), the optional unit taken by many Extended Certificate and Diploma learners. It explains every criterion from A.P1 to BC.D3, shows how to structure the website comparison report and the design, build and test portfolio, and gives model paragraphs, a worked code and testing example and clear advice for Distinction.

What the Unit 6 Website Development assignment asks you to do

Unit 6 is internally assessed and is usually split into two assignments. In the first (learning aim A) you compare two existing websites and analyse how design principles make them creative, high-performing and suitable for their audience. In the second (learning aims B and C) you work for a client, often a small local business or charity: you design a website that meets their requirements, review your designs with others, build the site using HTML, CSS and client-side scripting, test it, optimise it and finally evaluate the finished site against the client’s needs.

Learning aims for Unit 6

Learning aim What it covers
A: Understand the principles of website development Purpose and audience, usability, navigation, accessibility, use of media, creativity, search engine optimisation (SEO), and server-side and client-side factors that affect performance.
B: Design a website to meet client requirements Problem definition, site maps, wireframes and prototypes, scripting design (pseudocode or flowcharts), asset lists, test plans, feedback and legal and ethical considerations.
C: Develop a website to meet client requirements Building the site with HTML, CSS and client-side scripting, testing, reviewing and optimising against the requirements.

Pass, Merit and Distinction criteria explained

Criterion What it asks How to evidence it
A.P1 Compare the principles of website design used in two websites, including their suitability for the intended audience and intended purpose. Side-by-side comparison of two real sites under clear headings, with annotated screenshots.
A.M1 Analyse how the principles of website design are used to produce creative, high-performance websites that meet client requirements. Explain cause and effect: why each design choice helps performance, usability or engagement.
A.D1 Evaluate how the principles of website design are used to produce creative, high-performance websites that meet client requirements. Weigh strengths and weaknesses, consider trade-offs (for example rich media against page speed) and reach a judgement.
B.P2 Produce designs for a website that meet client requirements. Site map, wireframes for each page type, colour and font scheme, asset list, scripting design and test plan.
B.P3 Review the website design proposals with others to identify and inform improvements. Feedback forms or notes from the client, teacher or peers, and a record of the changes you made.
B.M2 Justify the design decisions, explaining how they will meet the user’s needs and be fit for purpose. Link each design decision to a specific requirement or user need.
C.P4 Produce a website for an intended audience and purpose. Working site, annotated code and screenshots of each page.
C.P5 Test the website for functionality, compatibility and usability. Test log covering links, forms and scripts; different browsers and screen sizes; user testing.
C.P6 Review the extent to which the website meets client requirements. Requirement-by-requirement review stating met, partly met or not met.
C.M3 Optimise a website to meet client requirements. Before-and-after evidence of improvements such as image compression, code tidying, accessibility fixes and SEO.
BC.D2 Evaluate the design and optimised website against client requirements. Balanced judgement on both the design process and the final site, with evidence and further improvements.
BC.D3 Demonstrate individual responsibility, creativity and effective self-management in the design, development and review of a website. Dated development log, time plan, decisions made, problems solved independently, creative features.

How to answer Learning aim A: comparing two websites

Choose two sites with a similar purpose but different audiences or approaches, for example a national supermarket and a small independent bakery. Compare them under the same headings so the assessor can see the comparison clearly.

  1. Purpose and intended audience.
  2. Layout, navigation and usability.
  3. Accessibility: alt text, colour contrast, keyboard navigation, readable fonts.
  4. Use of media and interactivity.
  5. Creativity and brand identity.
  6. SEO: page titles, headings, meta descriptions, readable URLs.
  7. Performance: page load speed, file sizes, server-side and client-side factors.

Example paragraph (A.M1): The supermarket site keeps its main navigation fixed at the top of every page, with a prominent search box and clear category labels. Because shoppers usually arrive with a specific product in mind, this design lets them find items in one or two clicks, which reduces frustration and abandoned baskets. Product images are compressed and load as the user scrolls, so the page stays fast even with hundreds of pictures. By contrast, the bakery site uses a large background video on its home page. This is creative and reflects the brand, but it increases load time on mobile data, which matters because many of its visitors browse on phones.

How to answer Learning aim B: designing for the client

  • Begin with a problem definition statement summarising the client’s purpose, audience and requirements.
  • Produce a site map and wireframes for each page type (home, content page, contact form).
  • Plan your scripting: for example, form validation or an image gallery written as pseudocode.
  • List assets with their source and permission, covering copyright and data protection where you collect personal data.
  • Write a test plan before you build.
  • Gather feedback (B.P3) and show exactly what changed because of it.

Example paragraph (B.M2): I placed the “Book a table” button in the header of every page because the client’s main requirement is to increase online bookings. Users will not need to search for it, which supports the client’s goal and improves usability. I chose a high-contrast colour scheme of dark green text on an off-white background because several regular customers are older, and stronger contrast makes text easier to read, which also supports accessibility guidance.

How to answer Learning aim C: building, testing and optimising

Annotate your code so the assessor can see what each section does. Use semantic HTML (header, nav, main, footer), an external stylesheet and responsive layout techniques such as media queries.

Worked example: validation script and test log

The client wants a contact form that will not submit unless the email address looks valid. A simple client-side check could be:

<form id="contact">
  <label for="email">Email</label>
  <input type="email" id="email" required>
  <p id="msg" role="alert"></p>
  <button type="submit">Send</button>
</form>
<script>
document.getElementById("contact").addEventListener("submit", function (e) {
  const email = document.getElementById("email").value.trim();
  if (!email.includes("@") || !email.includes(".")) {
    e.preventDefault();
    document.getElementById("msg").textContent = "Please enter a valid email address.";
  }
});
</script>

The label is linked to the input with for and id, which helps screen reader users, and role="alert" means the error message is announced. Record the testing like this:

Test Data Expected result Actual result Action
1 Valid email sam@example.co.uk Form submits Form submits None
2 Missing @ sam.example.co.uk Error shown, no submit Browser message shown by type=”email” None; both checks work
3 Empty field (blank) Required message Required message None
4 Mobile view 375 px width Form fits screen Button overflowed Set button width to 100% in media query; retested, passed

For C.M3, show measurable optimisation. For example, if the home page hero image was 2.4 MB and you resize it to the width actually displayed and save it in a modern compressed format at about 250 KB, the page downloads roughly 2.15 MB less data. State the before and after figures from your browser’s developer tools and explain how this supports the client’s requirement for a fast site on mobile.

Common mistakes that cost marks

  • Describing two websites one after the other instead of comparing them point by point.
  • Wireframes with no annotations explaining layout, fonts, colours and content.
  • No evidence of design review, or feedback that is recorded but never acted on.
  • Testing only on one browser at one screen size.
  • Using images without checking copyright or giving credit.
  • Claiming optimisation without before-and-after evidence.
  • Evaluating only the final website and ignoring the design process for BC.D2.

How to move from Merit to Distinction

For A.D1, judge how well each site balances creativity, usability and performance, acknowledge trade-offs and state which approach better meets its client’s needs and why. For BC.D2, go through each client requirement, judge how well both your design and your optimised site meet it, refer to your test and feedback evidence, and recommend realistic next steps (for example adding a booking system or improving SEO). For BC.D3, keep a dated log from start to finish that shows planning, decisions, problems you solved yourself and creative features you added, and reflect honestly on how you managed your time.

FAQs

Can I use WordPress or a website builder for Unit 6?

The unit expects you to develop the site with code, including client-side scripting, so check with your teacher before using a builder. Most centres expect hand-written HTML, CSS and JavaScript.

Which two websites should I compare for A.P1?

Pick sites with a similar purpose, such as two restaurants or two charities, so the comparison of design choices and audience suitability is meaningful.

Does the client have to be real?

No. Most briefs supply a fictional client. If you work with a real one, record their feedback as evidence for B.P3 and C.P6.

What counts as optimisation?

Any measurable improvement linked to a requirement: faster loading, better accessibility, cleaner code, better SEO or a better mobile layout.

Is Unit 6 externally examined?

No. It is an internally assessed unit, marked by your centre and checked by Pearson.

If you would like your design, code or evaluation reviewed before you submit, get expert help with your BTEC assignment. You may also find our BTEC Level 3 Unit 1 Information Technology Systems answer guide useful for related IT topics.

Get AI-Free Assignment Help Instantly

Facing Issues with Assignments? Talk to Our Experts Now! Download Our App Now!

WhatsApp Icon