FURTHER WEBSITE

IMPLEMENTATION

DESIGNING THE BACKGROUND

To change the background, I first went to the ‘Page

Background’ tab on the left hand side,

and clicked ‘customise

background’.

I then clicked ‘change image’ and selected the image I wanted.

I selected the ‘full screen’ option as I

want the background to cover the whole page, and ‘apply to

other pages’ so every page has the same

background.

DESIGNING THE HEADER/TITLE

To change the title, I clicked the ordinal text so a formatting

toolbar would appear.

I then highlighted the text to I could change it, and in the ‘font’ drop

down chose the ‘Anton’ font as I felt this was the most fitting to my idea.

With the text still highlighted, I

selected ‘72px’ from the ‘font size’

drop down box.

FINISHED HEADER/TITLE

The finished title, with ‘INGRID MICHAELSON’ in the font ‘Anton’, with font size ’72px’ and in the colour ‘black’. I

chose to use my Artist’s name as the title to make it obvious what the website is about.

Once I’d finished the title, I also changed the header so that it had a plain grey background, but I changed the opacity

so that it was more transparent – this separates the header from the rest of the page without being too in your face.

ADDING NEW PAGESTo add a page, I

went to the ‘Pages’ tab on the left hand side, and clicked ‘Add’ at the

bottom. I then named

the new page, for example

‘Lyrics’ and clicked ‘OK’.

The template came with pages ‘home’, ‘cast’, ‘images’, ‘blog’ and ‘contact’, so I removed ‘cast’, ‘images’ and ‘blog’ and

added ‘news’, ‘music’, ‘video’, ‘live’ and ‘lyrics’ as these are the usual pages included on an artist’s website.

DESIGNING NAVIGATION BARTo change the

navigation bar, I clicked it and

selected ‘change style’.

On the ‘text menu’ style, I clicked ‘edit

style’ to bring up the ‘advanced styles’.

I then changed all the background

colours to dark grey, and the font colour

to black.

I also changed the opacity of the

background to make it more transparent.

FINISHED NAVIGATION BAR

The finished navigation bar contains links to 7 different pages – home, news, music, video, live, lyrics and contact. They are all in the same font as the title, ‘Anton’ and in the

colour black.

I also designed the colours so that when a page is selected, the background becomes white instead of grey – this allows you to see where you are on the website, and makes it a bit

less static.

DESIGNING THE FOOTER

I designed the footer in a similar way to the navigation bar, by clicking ‘change style’ and going to the ‘advanced styles’. I also gave it the same design – dark grey background with

changed opacity settings.

FINISHED FOOTERThe finished footer contains the same design as the navigation

bar (as previously mentioned), and the reason for this is because I wanted the page design to be consistent. The navigation bar /

footer also act as barriers around the contents of the main page, so having the same design for both makes that seem more

obvious.

The footer is also where I have put the links to social media pages. I’ve done this because putting them in their own space makes them clearer; I was hesitant to putting them next to the

navigation bar like I planned as I felt they looked a bit out of place and there wasn’t enough room without it all looking

squashed.

DESIGNING SOCIAL LINKS

To design/add social media links, I went to ‘social bar settings’. In the settings, I added a ‘Facebook’, ‘Twitter’, ‘Instagram’ and

‘YouTube’ icon, and linked each one to my artists’ profiles. I also made the ‘icon size’ bigger and increased the gap between each

one by changing the ‘spacing’.

DESIGNING PAGESEach page will have the same basic design,

which consists of a grey ‘box’ with the same colour as the footer etc,

but with a slightly higher opacity level to

make it less transparent.

The box will have the page title in it in the

top left in white, and all the

content will be inside the box, e.g. tour dates,

lyrics.