2. Mission Statement
To produce a professional portfolio website to illustrate the different skills,
interests and hobbies of an individual. It must have appropriate content,
house style and layout and not violate any copyright law. The site must be
accessible to anyone regardless of age, culture or disability.
3. Target Audience
The application of my website will have one distinctive target audience. This will
be demographic group 16 – 24 for both men and women that have a passion for
football. There will be a secondary audience that would consist of both older
and younger age ranges that may be interested in football and other sports.
4. Technical Considerations
Browser – Google Chrome and Mozilla Firefox, I want my website to
work on these websites
Screen resolution – looking at the top screen resolutions the top one is
1024x768 but I want to add quality to my website so I will use 1366x768
Coding – I will use XHTML and CSS
Website speed – with images that are high resolution i could include a
gallery so it doesn't slow down the website.
Own experience – I've made a website before so I am going to attempt
to make a more difficult website.
5. Structure Diagrams
Home
Skills Interests Hobbies Feedback
Stoke City
Football
Stadiums
Gallery
Science
Media
Gaming
6. What my pages will include?
Skills – in my skills page I want to include information about me and what I can do,
maybe include different certificates and results about GCSE grades and generally
what I'm good at.
Hobbies – on this page I will include different information about my different
hobbies e.g. Socialising playing the Xbox and maybe include my gamer card from
the Xbox website that can be imported and other information about FIFA 12.
My feedback page will just be a page where peers can leave feedback good/bad
about my website.
Interests – this page will include small amount of information to link to my other
pages.
Stoke City – this page will include different news about stoke city and why I like them, when I started supporting
them, most memorable games, and maybe a gallery to show these memories
Stadium gallery – this will include high resolution pictures with a description to show off some of the best
stadiums that I like in the world
Science – on this site I will discuss my love for science, this could also include a gallery from when I went to bang
goes the theory live and other things I enjoy about science e.g. earth, body and heart.
Media – media fascinates me especially the different parts to the media e.g. Internet_skype_facebook_Youtube
and include other information about my favourite TV and films.
Gaming – on this page I will include different information about my love for gaming, maybe include my gamer
card from the Xbox website that can be imported and other information about FIFA 12
8. Page Layout – Home page
(Story Board)
Header Logo
This is my web design layout, I
have tried to incorporate a lot of
Navigation Bar my ideas into this and wanted
Home most things to stay consistent
apart from the content. The
content and the box in white
beside it will change throughout
Content Photos the page making the site look
and feel professional but just to
make things different the
content box is part rounded so
Contact me make it different. My home page
is simple and easy to follow and
Footer everything will be accessible
from the navigation bar
9. Page Layout Skills, interests,
hobbies, feedback
This is my web design layout for all my
Header Logo other web pages, everything will stay the
same except for the content and the
photos in which these will change
Navigation Bar depending on the webpage, the content
will change dramatically for the stadium
Home gallery because it will turn into a tile view
so that people can see all the different
high resolution pictures of the stadiums,
the logo will also change with each page
Content Photos because the name of the page will change
part of the logo so the audience know
where they are on my webpage. Also the
home button is not in a conventional
place because its on the side bar not on
Contact me
the navigation bar, this changes the style
of my website but also makes it easy to
Footer use.
10. For my background of my portfolio
website I want to create a grass
Mood Board
texture to make it less plain and
reduce the amount of red on the
website as this could affect users
eyes , but I would also like a
natural background so that it
doesn't look stupid with the other
pages e.g. science and media
Background
Logo
For my colour scheme I
wanted to base it
Colour scheme around my football
team as I feel it will be
a big part of my site.
The colours are not
generally for one
gender and would be
Images Font
more for the neutral
who like sport and
For my font I want to use comic sans MS, stoke city, but I didn't
These are both examples of some pictures that because it looks professional , is very easy to read want to make it all red
maybe on my website, of course there will be a for all target audiences this will be for my main
body text. For my navigation bar I want to use and white so used a
gallery of different pictures, e.g. favourite players
Berlin sans FB this is because it is bold and easy to green colour because it
and stadiums but also background images. These
read. And for my different heading s they need to would symbolise the
images all go well with the colour schemes and be big and easy to read so i decided to choose grass. It all links to
link will my personal interests Calibri , this will be good for my audience because
football and is good for
they will be able to tell the text from the heading .
All my fonts go together well and should help to all genders and ages
create a professional portfolio website.
12. Production Schedule
Stage of Website Time it will take to complete each stage
Analysis 2 Hours
Mission statement ½ Hour
Target Audience ½ Hour
Technical Considerations 1 Hour
Design 4-6 Hours
Create page layouts and storyboards 2 Hours
Make a mock up of the website on flash or Photoshop 2 Hours
Site Map ¼ Hour
Mood Board ½ Hour
Mind Map ½ Hour
Implementation 8-10 Hours
Basics of Dreamweaver 1 Hour
Template 1 Hour
Coding (CSS) 2 Hours
Main Pages 3 Hours
Images 2 Hours
Links 1 Hour
Embedding ½ Hour
Testing 1 hour (2-4 depending on improvements)
W3C 1/3 Hour
SEO 1/3 Hour
Accessibility 1/3 Hour
Improvements 2-4 Hours
Development 1 Hour
13. Story Board Explanation
My layout for my website is and isn't conventional. It is conventional in the sense that it has a logo
and header at the top the navigation bar in the middle as well as the content and the footer at the
bottom but its not conventional in the sense that the logo is on the top left of my website and the
home button is on the side. This is because I want to take a risk and make my website diverse but easy
to understand. I wanted to make it different to reflect my personality because I am different and have
my own way of doing things.
The house style of my portfolio website has been based on the football team I support in my local
area, Stoke city but I didn't just want red and white, so I used a colour designer chart to show colours
that complement each other, this colour chart can be found on my mood board. The different colours
can give different parts of my website an altered feel but also make the user known that they are on
the same website so they don't feel lost.
The font of my website had to be different, not just the standard Arial font used by many other
websites, I didn't want it to look silly I wanted it to look professional so I looked for other fonts and i
came up with these. For my font I want to use comic sans MS, because it looks professional , is very
easy to read for all target audiences this will be for my main body text. For my navigation bar I want to
use Berlin sans FB this is because it is bold and easy to read. And for my different heading s they need
to be big and easy to read so I decided to choose Calibri , this will be good for my audience because
they will be able to tell the text from the heading . All my fonts go together well and should help to
create a professional portfolio website.
