Learning aim C: Develop a
website to meet client
requirements
1
C2 Website Development
Your Name
09/04/20XX
2
BTEC Assignment Brief
Pearson BTEC Level 3 National Extended Certificate in
Information Technology
Qualification
Pearson BTEC Level 3 National Foundation Diploma in
Information Technology
Unit number and title Unit 6: Website Development
Learning aim(s) (For B: Design a website to meet client requirements
NQF only) C: Develop a website to meet client requirements
Design and develop a website
Assignment title
You have recently joined a web development company,
Hot Beans Web as a junior web developer. You have been
asked as part of your induction and training to create a
new section for the company’s web site which promotes
the company to prospective employees, as they need to
recruit more web developers. The company wants you to
include the following things:
● A profile of the company itself
Vocational Scenario or ● profiles of existing trainee web developers
Context ● job specifications and required qualifications
● an on-line application form
● links to web development courses
The target audience for the site is people who have
completed training courses or qualifications related to
web development and are now looking for a job as a web
developer.
Create and evaluate comprehensive designs for the web
site which include:
● identification of user requirements
● visual designs for the pages
● alternative design options
Task 1 ● technical documentation
Produce a justification of the design decisions you made,
explaining how it will meet the user needs and be fit for
purpose. Develop the web site and test it for functionality,
compatibility (with different devices and browsers) and
usability (including user testing), using appropriate test
3
plans, test schedules and data. You should collect results
and feedback and show that you have responded to any
problem or errors identified.
Optimise the web site, using the results of testing and
user feedback and record the details of the changes you
have made so that ‘before’ and ‘after’ versions of the web
site can be seen
Write an evaluation of the design, development and
optimisation of the web site. You should provide a
detailed and balanced evaluation of how effectively your
completed website meets the client requirements,
including appealing to the target audience and meeting
its stated purpose, in comparison to alternative
solutions. Your evaluation should be supported by
evidence from all stages of the project to reach
conclusions and suggest developments. The evaluation
must contain a systematic and accurate review of your
own skills, performance and behaviours and the impact
that this had on the development of the final website.
Present evidence that you have shown individual
responsibility, effective time-management in your design
and development of the web site making high-quality
justified recommendations and decisions. This should
include a task plan for completing the assignment and a
witness testimony from your tutor. For example, you need
to show how you have:
● Planned and managed your time and met targets.
● Reviewed and responded to outcomes including
the use of feedback from others
● Behaved appropriately while completing the
assignment – including professionalism, etiquette,
supportive of others, timely and appropriate
leadership, accountability and individual
responsibility
● Evaluated outcomes to help inform high-quality
justified recommendations and decisions
● Used appropriate methods of communication
effectively
Checklist of evidence ● Designs for the web site
required ● Justifications of the design decisions
● Annotated screen shots of the completed web site
● Evidence of testing including test plans and data,
user feedback and details of the changes made in
response to testing
● Annotated screen shots of the optimised web site
4
● Evaluation of the design and development of the
web site
● Evidence of individual responsibility, effective
time-management including a time plan and
witness testimony from your tutor.
Criteria covered by this task:
Unit/Criteria
To achieve the criteria you must show that you are able to:
reference
Evaluate the design and optimised website against client
6/BC.D2
requirements.
Demonstrate individual responsibility, creativity and effective
6/BC.D3 self-management in the design, development and review of a
website.
Justify the design decisions, explaining how they will meet the
6/B.M2
user's needs and be fit for purpose.
6/C.M3 Optimise a website to meet client requirements.
6/B.P2 Produce designs for a website that meet client requirements.
Review the website design proposals with others to identify and
6/B.P3 inform
improvements.
6/C.P4 Produce a website for an intended audience and purpose.
6/C.P5 Test the website for functionality, compatibility and usability.
6/C.P6 Review the extent to which the website meets client requirements.
5
Important Information
This this section of your project you should show evidence that you have embedded
the features of your website (as detailed below). For example, you should show
screenshots of HTML tags you have used and explain what this is for. It is important
that you show creativity within your website design and self manage the project
throughout. This will put you in the higher mark band of distinction.
6
Creation of interactive websites
Show screenshot evidence of your code and also the user view.
Use of CSS
HTML tags
The structure and content of a web page are defined by HTML tags, which are the
fundamental units of an HTML document. They contain elements like <html>, <head>,
<body>, <div>, and more, together with opening and closing tags. Text formatting, media
embedding, page link building, and page segment structure are all accomplished via
tags.
Example :
CSS frameworks
CSS—Cascading Style Sheets a set of files with specialized code that defines the styles
and interactive elements that developers can insert into the front-end code in code
displayed as
<style>
</style>
7
helps in giving dry html beautiful shapes or unusual shapes or shadows, read it like the
body of a car, and the frame and engine are html, without the body the car will go, but it
will no longer be so beautiful
Example :
Box model
1. The text or media that is actually contained in the element.
2. The area between the border and the content is called padding.
3. Border: The line enclosing the content and padding.
4. The outer space that divides one element from other elements on the page is
called the margin.
Access CSS from HTML
In general, you don’t need to download anything, it’s already there, just start writing the
line <style> </style> to indicate to the language that here internal CSS is when your CSS
file is inside html, and there is also an external one, so that html knows where take him
all these forms, etc., this is how he writes in the code: the <link> tag placed in the
<head> section of the HTML document.
8
doc types
The command at the start of an HTML document that informs the web browser of the
HTML version being used is called doctype, or document type declaration. For instance,
HTML5 is indicated by . Compatibility and correct rendering across many browsers are
ensured by appropriately configuring the doctype.
Example :
9
Use of original client-side scripting
1-The code ; 2-The page
10
Compatibility with mobile and tablet devices
– Phone
11
Effective use of tools and techniques
Show screenshot evidence of the tools you have used and explain how they enhance
your site and help to meet the client’s needs.
1. Photoshop - to make a realistic image of how
website gonna looks like
2. Sublime text - to write the code
.
12
The uploading of files to a web server or host computer/device.
- I uploaded my website with ionos webhosting service
On the screenshot you can see my webspace