SlideShare a Scribd company logo
1 of 11
FURTHER WEBSITE
IMPLEMENTATION
DESIGNING THEBACKGROUND
Tochangethe background,I first
wentto the‘PageBackground’tab
onthe left handside, andclicked
‘customise background’.
I then clicked ‘changeimage’and
selected theimage I wanted.
I selected the ‘fullscreen’optionasI
wantthe backgroundtocoverthe
whole page,and‘applytoother
pages’soevery pagehas thesame
background.
DESIGNING THEHEADER/TITLE
Tochangethe title, Iclicked the
ordinaltextso aformatting
toolbarwouldappear.
I then highlightedthe textto I
couldchangeit, andin the‘font’
dropdownchosethe ‘Anton’
fontas I felt thiswasthe most
fittingtomy idea.
Withthe textstill highlighted,I
selected ‘72px’fromthe ‘font
size’dropdownbox.
FINISHEDHEADER/TITLE
The finishedtitle,with‘INGRIDMICHAELSON’in the font‘Anton’,withfontsize’72px’andin the
colour‘black’.I chosetousemy Artist’snameas thetitle tomakeit obvious whatthe websiteis
about.
OnceI’dfinishedthe title,I also changedthe headersothatithadaplain grey background,butI
changedthe opacityso thatit wasmoretransparent–this separatesthe headerfromtherest ofthe
pagewithoutbeing tooin yourface.
ADDING NEW PAGES
Toaddapage,I
wentto the‘Pages’
tabonthe lefthand
side, andclicked
‘Add’atthe bottom.
I then namedthe
new page,for
example ‘Lyrics’
andclicked ‘OK’.
The templatecamewithpages‘home’, ‘cast’,‘images’, ‘blog’and‘contact’,soI removed ‘cast’,‘images’and
‘blog’andadded‘news’,‘music’,‘video’, ‘live’ and‘lyrics’asthesearetheusual pagesincludedon anartist’s
website.
DESIGNINGNAVIGATION BAR
Tochangethe navigationbar,I
clicked it andselected‘change
style’.
On the‘textmenu’ style,I clicked
‘edit style’tobring up the
‘advancedstyles’.
I then changedall thebackground
colourstodarkgrey, andthe font
colourtoblack.
I also changedthe opacityofthe
backgroundto makeit more
transparent.
FINISHEDNAVIGATION BAR
The finishednavigationbarcontainslinks to7 differentpages –home,news,music,video, live,
lyricsandcontact.Theyareall in the samefontasthe title,‘Anton’andin thecolourblack.
I also designedthe colourssothatwhen apageis selected,the backgroundbecomes whiteinstead
ofgrey –this allowsyoutosee whereyouareonthe website, andmakesit abitless static.
DESIGNING THEFOOTER
I designed thefooterin asimilar wayto thenavigationbar,byclicking ‘change style’andgoing tothe
‘advancedstyles’.I alsogaveit thesamedesign –darkgrey backgroundwithchangedopacitysettings.
FINISHEDFOOTER
The finishedfootercontainsthe samedesign asthe navigationbar(aspreviously mentioned), andthe reason
forthisis becauseI wantedthepagedesign tobeconsistent.The navigationbar/ footeralso actasbarriers
aroundthecontentsofthe mainpage, so having thesamedesign forbothmakesthatseem moreobvious.
The footeris alsowhereI haveputthelinks tosocial mediapages.I’ve donethisbecauseputtingthemin
theirownspacemakesthem clearer;I washesitanttoputtingthem nexttothenavigationbarlike Iplanned
asI felttheylookeda bitoutofplaceandtherewasn’tenoughroom withoutitall looking squashed.
DESIGNINGSOCIAL LINKS
Todesign/addsocial media links,I wentto‘social barsettings’.In thesettings,I addeda‘Facebook’,‘Twitter’,
‘Instagram’and‘YouTube’icon,andlinked eachone tomy artists’profiles.I alsomade the‘icon size’bigger
andincreasedthe gapbetween each one bychanging the‘spacing’.
DESIGNINGPAGES
Eachpagewill havethe
samebasicdesign, which
consistsofa grey ‘box’with
the samecolour asthe
footeretc, butwith a
slightly higher opacitylevel
tomakeit less transparent.
Theboxwill havethe page
title in it in thetopleft in
white,andall thecontent
will be inside thebox,e.g.
tourdates,lyrics.

More Related Content

Viewers also liked

Alena García Rodriguez - Pie Diabético
Alena García Rodriguez - Pie DiabéticoAlena García Rodriguez - Pie Diabético
Alena García Rodriguez - Pie DiabéticoCDyTE
 
NdP Certificación ISO-IEC 27001 EULEN Seguridad - CCSI - diciembre 2014
NdP  Certificación ISO-IEC  27001 EULEN Seguridad - CCSI  - diciembre 2014NdP  Certificación ISO-IEC  27001 EULEN Seguridad - CCSI  - diciembre 2014
NdP Certificación ISO-IEC 27001 EULEN Seguridad - CCSI - diciembre 2014Ricardo Cañizares Sales
 
Guía de Liderazgo Innovador para el experto en Marketing Sofisticado
Guía de Liderazgo Innovador para el experto en Marketing SofisticadoGuía de Liderazgo Innovador para el experto en Marketing Sofisticado
Guía de Liderazgo Innovador para el experto en Marketing SofisticadoLinkedIn
 
Manejo de Crisis en redes sociales
Manejo de Crisis en redes socialesManejo de Crisis en redes sociales
Manejo de Crisis en redes socialesSantiago Mendoza
 
Eight Tips to a Successful Website Implementation
Eight Tips to a Successful Website ImplementationEight Tips to a Successful Website Implementation
Eight Tips to a Successful Website ImplementationJason Samuels
 
Website Implementation #2
Website Implementation #2Website Implementation #2
Website Implementation #2shannon-newton
 
Tag-based Semantic Website Recommendation
Tag-based Semantic Website Recommendation Tag-based Semantic Website Recommendation
Tag-based Semantic Website Recommendation Onur Yılmaz
 
Website implementation
Website implementationWebsite implementation
Website implementationjmkyang
 
Elements of the Human Talent Managemet System
Elements of the Human Talent Managemet SystemElements of the Human Talent Managemet System
Elements of the Human Talent Managemet SystemJorge R Rodriguez Lopez
 
Tfase1 103380 grupo83
Tfase1 103380 grupo83Tfase1 103380 grupo83
Tfase1 103380 grupo83Henry Fonseca
 
Public Health Model for Mental Health
Public Health Model for Mental HealthPublic Health Model for Mental Health
Public Health Model for Mental HealthMHTP Webmastere
 
Website conclusion
Website conclusionWebsite conclusion
Website conclusioncrowny1997
 
Website analysis report
Website analysis reportWebsite analysis report
Website analysis reportvimlesh88
 
FinQLOUD: Digital Banking Platform
FinQLOUD: Digital Banking PlatformFinQLOUD: Digital Banking Platform
FinQLOUD: Digital Banking PlatformBanQ Systems
 
Website Analysis Report
Website Analysis ReportWebsite Analysis Report
Website Analysis ReportAuroIN
 
Website analysis sample report
Website analysis sample reportWebsite analysis sample report
Website analysis sample reportSukumar Jena
 

Viewers also liked (19)

Alena García Rodriguez - Pie Diabético
Alena García Rodriguez - Pie DiabéticoAlena García Rodriguez - Pie Diabético
Alena García Rodriguez - Pie Diabético
 
Lelol
LelolLelol
Lelol
 
NdP Certificación ISO-IEC 27001 EULEN Seguridad - CCSI - diciembre 2014
NdP  Certificación ISO-IEC  27001 EULEN Seguridad - CCSI  - diciembre 2014NdP  Certificación ISO-IEC  27001 EULEN Seguridad - CCSI  - diciembre 2014
NdP Certificación ISO-IEC 27001 EULEN Seguridad - CCSI - diciembre 2014
 
Guía de Liderazgo Innovador para el experto en Marketing Sofisticado
Guía de Liderazgo Innovador para el experto en Marketing SofisticadoGuía de Liderazgo Innovador para el experto en Marketing Sofisticado
Guía de Liderazgo Innovador para el experto en Marketing Sofisticado
 
Perdite su crediti: principi contabili e profili tributari
Perdite su crediti: principi contabili e profili tributariPerdite su crediti: principi contabili e profili tributari
Perdite su crediti: principi contabili e profili tributari
 
Manejo de Crisis en redes sociales
Manejo de Crisis en redes socialesManejo de Crisis en redes sociales
Manejo de Crisis en redes sociales
 
Elprocesodecomunicacin2015
Elprocesodecomunicacin2015Elprocesodecomunicacin2015
Elprocesodecomunicacin2015
 
Eight Tips to a Successful Website Implementation
Eight Tips to a Successful Website ImplementationEight Tips to a Successful Website Implementation
Eight Tips to a Successful Website Implementation
 
Website Implementation #2
Website Implementation #2Website Implementation #2
Website Implementation #2
 
Tag-based Semantic Website Recommendation
Tag-based Semantic Website Recommendation Tag-based Semantic Website Recommendation
Tag-based Semantic Website Recommendation
 
Website implementation
Website implementationWebsite implementation
Website implementation
 
Elements of the Human Talent Managemet System
Elements of the Human Talent Managemet SystemElements of the Human Talent Managemet System
Elements of the Human Talent Managemet System
 
Tfase1 103380 grupo83
Tfase1 103380 grupo83Tfase1 103380 grupo83
Tfase1 103380 grupo83
 
Public Health Model for Mental Health
Public Health Model for Mental HealthPublic Health Model for Mental Health
Public Health Model for Mental Health
 
Website conclusion
Website conclusionWebsite conclusion
Website conclusion
 
Website analysis report
Website analysis reportWebsite analysis report
Website analysis report
 
FinQLOUD: Digital Banking Platform
FinQLOUD: Digital Banking PlatformFinQLOUD: Digital Banking Platform
FinQLOUD: Digital Banking Platform
 
Website Analysis Report
Website Analysis ReportWebsite Analysis Report
Website Analysis Report
 
Website analysis sample report
Website analysis sample reportWebsite analysis sample report
Website analysis sample report
 

Similar to Further Website Implementation

Screenshots of music magazine ( first draft )
Screenshots of music magazine ( first draft )Screenshots of music magazine ( first draft )
Screenshots of music magazine ( first draft )ninachapman99
 
Construction
ConstructionConstruction
ConstructionKeara97
 
Editing my Front Cover Draft
Editing my Front Cover DraftEditing my Front Cover Draft
Editing my Front Cover Draftpatrickhen97
 
skills development journal
skills development journalskills development journal
skills development journalgemmaportermedia
 
Production screen shots of my contents page
Production screen shots of my contents pageProduction screen shots of my contents page
Production screen shots of my contents pageasmediag12
 
Front Cover Photoshop Printscreens
Front Cover Photoshop PrintscreensFront Cover Photoshop Printscreens
Front Cover Photoshop Printscreenschiraag_p7
 
Double page spread progress
Double page spread progressDouble page spread progress
Double page spread progressellad96
 
Print screen of making my website
Print screen of making my websitePrint screen of making my website
Print screen of making my websitefatemajohara
 
Production screen shots of my contents page
Production screen shots of my contents pageProduction screen shots of my contents page
Production screen shots of my contents pageasmediag12
 
Double Page Spread Photoshop Printscreens
Double Page Spread Photoshop PrintscreensDouble Page Spread Photoshop Printscreens
Double Page Spread Photoshop Printscreenschiraag_p7
 
Creating Front Cover
Creating Front CoverCreating Front Cover
Creating Front Coverlydiahughes
 
DAD ASTSHSDFSA AGFD SEWAFA AWFEFADSJD.ppt
DAD ASTSHSDFSA AGFD SEWAFA AWFEFADSJD.pptDAD ASTSHSDFSA AGFD SEWAFA AWFEFADSJD.ppt
DAD ASTSHSDFSA AGFD SEWAFA AWFEFADSJD.pptmayas43
 
Step by step for contents page
Step by step for contents pageStep by step for contents page
Step by step for contents pagedeemplemorar16
 
Indesign and photoshop
Indesign and photoshop Indesign and photoshop
Indesign and photoshop Sash13
 
Step by step for contents page
Step by step for contents pageStep by step for contents page
Step by step for contents pagedeemplemorar16
 

Similar to Further Website Implementation (20)

Screenshots of music magazine ( first draft )
Screenshots of music magazine ( first draft )Screenshots of music magazine ( first draft )
Screenshots of music magazine ( first draft )
 
Q6: Editing in Photoshop
Q6: Editing in Photoshop Q6: Editing in Photoshop
Q6: Editing in Photoshop
 
Construction
ConstructionConstruction
Construction
 
Stage 2 of Magazine
Stage 2 of MagazineStage 2 of Magazine
Stage 2 of Magazine
 
Editing my Front Cover Draft
Editing my Front Cover DraftEditing my Front Cover Draft
Editing my Front Cover Draft
 
skills development journal
skills development journalskills development journal
skills development journal
 
Production screen shots of my contents page
Production screen shots of my contents pageProduction screen shots of my contents page
Production screen shots of my contents page
 
Presentation1
Presentation1Presentation1
Presentation1
 
Skills indesign
Skills indesignSkills indesign
Skills indesign
 
Front Cover Photoshop Printscreens
Front Cover Photoshop PrintscreensFront Cover Photoshop Printscreens
Front Cover Photoshop Printscreens
 
Double page spread progress
Double page spread progressDouble page spread progress
Double page spread progress
 
Print screen of making my website
Print screen of making my websitePrint screen of making my website
Print screen of making my website
 
Production screen shots of my contents page
Production screen shots of my contents pageProduction screen shots of my contents page
Production screen shots of my contents page
 
Double Page Spread Photoshop Printscreens
Double Page Spread Photoshop PrintscreensDouble Page Spread Photoshop Printscreens
Double Page Spread Photoshop Printscreens
 
Q6
Q6Q6
Q6
 
Creating Front Cover
Creating Front CoverCreating Front Cover
Creating Front Cover
 
DAD ASTSHSDFSA AGFD SEWAFA AWFEFADSJD.ppt
DAD ASTSHSDFSA AGFD SEWAFA AWFEFADSJD.pptDAD ASTSHSDFSA AGFD SEWAFA AWFEFADSJD.ppt
DAD ASTSHSDFSA AGFD SEWAFA AWFEFADSJD.ppt
 
Step by step for contents page
Step by step for contents pageStep by step for contents page
Step by step for contents page
 
Indesign and photoshop
Indesign and photoshop Indesign and photoshop
Indesign and photoshop
 
Step by step for contents page
Step by step for contents pageStep by step for contents page
Step by step for contents page
 

More from shannon-newton

Digipak Implementation #1
Digipak Implementation #1Digipak Implementation #1
Digipak Implementation #1shannon-newton
 
Conventions of an artist's website
Conventions of an artist's websiteConventions of an artist's website
Conventions of an artist's websiteshannon-newton
 
Conventions of a Digipak
Conventions of a DigipakConventions of a Digipak
Conventions of a Digipakshannon-newton
 
AS Media Studies | Evaluation (Question 4)
AS Media Studies | Evaluation (Question 4)AS Media Studies | Evaluation (Question 4)
AS Media Studies | Evaluation (Question 4)shannon-newton
 
AS Media Studies | Evaluation (Question 6)
AS Media Studies | Evaluation (Question 6)AS Media Studies | Evaluation (Question 6)
AS Media Studies | Evaluation (Question 6)shannon-newton
 
AS Media Studies | Evaluation of Construction
AS Media Studies | Evaluation of Construction AS Media Studies | Evaluation of Construction
AS Media Studies | Evaluation of Construction shannon-newton
 
AS Media Studies | Storyboard
AS Media Studies | StoryboardAS Media Studies | Storyboard
AS Media Studies | Storyboardshannon-newton
 

More from shannon-newton (10)

Digipak Final Designs
Digipak Final DesignsDigipak Final Designs
Digipak Final Designs
 
Digipak Implementation #1
Digipak Implementation #1Digipak Implementation #1
Digipak Implementation #1
 
Casting
CastingCasting
Casting
 
Contacting Artist
Contacting ArtistContacting Artist
Contacting Artist
 
Conventions of an artist's website
Conventions of an artist's websiteConventions of an artist's website
Conventions of an artist's website
 
Conventions of a Digipak
Conventions of a DigipakConventions of a Digipak
Conventions of a Digipak
 
AS Media Studies | Evaluation (Question 4)
AS Media Studies | Evaluation (Question 4)AS Media Studies | Evaluation (Question 4)
AS Media Studies | Evaluation (Question 4)
 
AS Media Studies | Evaluation (Question 6)
AS Media Studies | Evaluation (Question 6)AS Media Studies | Evaluation (Question 6)
AS Media Studies | Evaluation (Question 6)
 
AS Media Studies | Evaluation of Construction
AS Media Studies | Evaluation of Construction AS Media Studies | Evaluation of Construction
AS Media Studies | Evaluation of Construction
 
AS Media Studies | Storyboard
AS Media Studies | StoryboardAS Media Studies | Storyboard
AS Media Studies | Storyboard
 

Recently uploaded

Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptxBasic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptxDenish Jangid
 
Graduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - EnglishGraduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - Englishneillewis46
 
Micro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfMicro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfPoh-Sun Goh
 
Holdier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdfHoldier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdfagholdier
 
Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)Jisc
 
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...Amil baba
 
How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17Celine George
 
Salient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functionsSalient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functionsKarakKing
 
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptxMaritesTamaniVerdade
 
General Principles of Intellectual Property: Concepts of Intellectual Proper...
General Principles of Intellectual Property: Concepts of Intellectual  Proper...General Principles of Intellectual Property: Concepts of Intellectual  Proper...
General Principles of Intellectual Property: Concepts of Intellectual Proper...Poonam Aher Patil
 
COMMUNICATING NEGATIVE NEWS - APPROACHES .pptx
COMMUNICATING NEGATIVE NEWS - APPROACHES .pptxCOMMUNICATING NEGATIVE NEWS - APPROACHES .pptx
COMMUNICATING NEGATIVE NEWS - APPROACHES .pptxannathomasp01
 
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptxHMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptxmarlenawright1
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfAdmir Softic
 
Application orientated numerical on hev.ppt
Application orientated numerical on hev.pptApplication orientated numerical on hev.ppt
Application orientated numerical on hev.pptRamjanShidvankar
 
How to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxHow to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxCeline George
 
How to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POSHow to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POSCeline George
 
Interdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptxInterdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptxPooja Bhuva
 
Google Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxGoogle Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxDr. Sarita Anand
 
REMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptxREMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptxDr. Ravikiran H M Gowda
 

Recently uploaded (20)

Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptxBasic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
 
Graduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - EnglishGraduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - English
 
Micro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfMicro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdf
 
Holdier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdfHoldier Curriculum Vitae (April 2024).pdf
Holdier Curriculum Vitae (April 2024).pdf
 
Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)Jamworks pilot and AI at Jisc (20/03/2024)
Jamworks pilot and AI at Jisc (20/03/2024)
 
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
NO1 Top Black Magic Specialist In Lahore Black magic In Pakistan Kala Ilam Ex...
 
How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17
 
Salient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functionsSalient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functions
 
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
2024-NATIONAL-LEARNING-CAMP-AND-OTHER.pptx
 
General Principles of Intellectual Property: Concepts of Intellectual Proper...
General Principles of Intellectual Property: Concepts of Intellectual  Proper...General Principles of Intellectual Property: Concepts of Intellectual  Proper...
General Principles of Intellectual Property: Concepts of Intellectual Proper...
 
COMMUNICATING NEGATIVE NEWS - APPROACHES .pptx
COMMUNICATING NEGATIVE NEWS - APPROACHES .pptxCOMMUNICATING NEGATIVE NEWS - APPROACHES .pptx
COMMUNICATING NEGATIVE NEWS - APPROACHES .pptx
 
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptxHMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
HMCS Vancouver Pre-Deployment Brief - May 2024 (Web Version).pptx
 
Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdf
 
Application orientated numerical on hev.ppt
Application orientated numerical on hev.pptApplication orientated numerical on hev.ppt
Application orientated numerical on hev.ppt
 
How to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxHow to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptx
 
How to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POSHow to Manage Global Discount in Odoo 17 POS
How to Manage Global Discount in Odoo 17 POS
 
Interdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptxInterdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptx
 
Google Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptxGoogle Gemini An AI Revolution in Education.pptx
Google Gemini An AI Revolution in Education.pptx
 
REMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptxREMIFENTANIL: An Ultra short acting opioid.pptx
REMIFENTANIL: An Ultra short acting opioid.pptx
 

Further Website Implementation

  • 2. DESIGNING THEBACKGROUND Tochangethe background,I first wentto the‘PageBackground’tab onthe left handside, andclicked ‘customise background’. I then clicked ‘changeimage’and selected theimage I wanted. I selected the ‘fullscreen’optionasI wantthe backgroundtocoverthe whole page,and‘applytoother pages’soevery pagehas thesame background.
  • 3. DESIGNING THEHEADER/TITLE Tochangethe title, Iclicked the ordinaltextso aformatting toolbarwouldappear. I then highlightedthe textto I couldchangeit, andin the‘font’ dropdownchosethe ‘Anton’ fontas I felt thiswasthe most fittingtomy idea. Withthe textstill highlighted,I selected ‘72px’fromthe ‘font size’dropdownbox.
  • 4. FINISHEDHEADER/TITLE The finishedtitle,with‘INGRIDMICHAELSON’in the font‘Anton’,withfontsize’72px’andin the colour‘black’.I chosetousemy Artist’snameas thetitle tomakeit obvious whatthe websiteis about. OnceI’dfinishedthe title,I also changedthe headersothatithadaplain grey background,butI changedthe opacityso thatit wasmoretransparent–this separatesthe headerfromtherest ofthe pagewithoutbeing tooin yourface.
  • 5. ADDING NEW PAGES Toaddapage,I wentto the‘Pages’ tabonthe lefthand side, andclicked ‘Add’atthe bottom. I then namedthe new page,for example ‘Lyrics’ andclicked ‘OK’. The templatecamewithpages‘home’, ‘cast’,‘images’, ‘blog’and‘contact’,soI removed ‘cast’,‘images’and ‘blog’andadded‘news’,‘music’,‘video’, ‘live’ and‘lyrics’asthesearetheusual pagesincludedon anartist’s website.
  • 6. DESIGNINGNAVIGATION BAR Tochangethe navigationbar,I clicked it andselected‘change style’. On the‘textmenu’ style,I clicked ‘edit style’tobring up the ‘advancedstyles’. I then changedall thebackground colourstodarkgrey, andthe font colourtoblack. I also changedthe opacityofthe backgroundto makeit more transparent.
  • 7. FINISHEDNAVIGATION BAR The finishednavigationbarcontainslinks to7 differentpages –home,news,music,video, live, lyricsandcontact.Theyareall in the samefontasthe title,‘Anton’andin thecolourblack. I also designedthe colourssothatwhen apageis selected,the backgroundbecomes whiteinstead ofgrey –this allowsyoutosee whereyouareonthe website, andmakesit abitless static.
  • 8. DESIGNING THEFOOTER I designed thefooterin asimilar wayto thenavigationbar,byclicking ‘change style’andgoing tothe ‘advancedstyles’.I alsogaveit thesamedesign –darkgrey backgroundwithchangedopacitysettings.
  • 9. FINISHEDFOOTER The finishedfootercontainsthe samedesign asthe navigationbar(aspreviously mentioned), andthe reason forthisis becauseI wantedthepagedesign tobeconsistent.The navigationbar/ footeralso actasbarriers aroundthecontentsofthe mainpage, so having thesamedesign forbothmakesthatseem moreobvious. The footeris alsowhereI haveputthelinks tosocial mediapages.I’ve donethisbecauseputtingthemin theirownspacemakesthem clearer;I washesitanttoputtingthem nexttothenavigationbarlike Iplanned asI felttheylookeda bitoutofplaceandtherewasn’tenoughroom withoutitall looking squashed.
  • 10. DESIGNINGSOCIAL LINKS Todesign/addsocial media links,I wentto‘social barsettings’.In thesettings,I addeda‘Facebook’,‘Twitter’, ‘Instagram’and‘YouTube’icon,andlinked eachone tomy artists’profiles.I alsomade the‘icon size’bigger andincreasedthe gapbetween each one bychanging the‘spacing’.
  • 11. DESIGNINGPAGES Eachpagewill havethe samebasicdesign, which consistsofa grey ‘box’with the samecolour asthe footeretc, butwith a slightly higher opacitylevel tomakeit less transparent. Theboxwill havethe page title in it in thetopleft in white,andall thecontent will be inside thebox,e.g. tourdates,lyrics.