F#1: Att planera en hemsida
-
Upload
marcus-weiderstal -
Category
Documents
-
view
1.480 -
download
1
description
Transcript of F#1: Att planera en hemsida
![Page 1: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/1.jpg)
Att planera en hemsidaMetoder, redskap och teorier
Webbdesign 100pMarcus Weiderstål
Bromma Gymnasium
![Page 2: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/2.jpg)
Webbdesign: Att planera en hemsida 2
Ärligt talat, behöver man en hemsida?
Givetvis!Alla finns ju på webben!
![Page 3: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/3.jpg)
Webbdesign: Att planera en hemsida 3
Mål för dagenKunna arbeta fram en hel arbetsplan för en
webbsidaKunna diskutera fördelar och nackdelar med
att välja olika former av text och bild för en specifik målgrupp
Ha kunskaper om olika syften och målgrupper
Ha utveckla ett ”helhetstänk” när det kommer till webbsidor
![Page 4: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/4.jpg)
Webbdesign: Att planera en hemsida 4
Från idé till verklighet
Idé
Planering
Praktiskt arbete
Lansering
A goal without a plan is just a wish.Antoine de Saint-Exupery (1900 - 1944)
![Page 5: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/5.jpg)
Webbdesign: Att planera en hemsida 5
Idé
”Jag ska göra en hemsida för alla som gillar bävrar”
”Jag ska göra en hemsida som berättar hur dåliga Djurgården är”
”Mitt företag behöver finnas på internet”
”Jag borde börja blogga om min skosamling”
”Varför finns det ingen hemsida för oss som älskar röda fåtöljer?”
”Det borde finnas någon form av mötesplats för oss som gillar dukar”
”Jag vill tjäna pengar!”
![Page 6: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/6.jpg)
Webbdesign: Att planera en hemsida 6
Vi borde göra en
hemsida om vår
heminredning!
Vi borde göra en hemsida om
vårt hemmabiossyte
m!
![Page 7: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/7.jpg)
Webbdesign: Att planera en hemsida 7
Planering!Lägger grunden till hemsidan.Ger förståelse för arbetet med hemsidanGör hemsidan ”enad”.Hjälper webbdesignern att utveckla
hemsidan när personen vet vad syftet är och vem som ska besöka den!
![Page 8: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/8.jpg)
Webbdesign: Att planera en hemsida 8
Arbetsplan
Webbutvecklarens motsvarighet till affärsplan
![Page 9: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/9.jpg)
Webbdesign: Att planera en hemsida 9
ArbetsplanSyfte Målgrupp
Innehåll
Struktur(Flödesschema)
Text Bilder/Animationer/Video
Grafisk profil Marknadsföring Applikationer
![Page 10: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/10.jpg)
Webbdesign: Att planera en hemsida 10
SyfteVarför skapar vi denna hemsida?• Personlig/åt ett företag• Tjäna pengar (e-handel)• Sammanfoga personer med samma intresse• Marknadsföra vår förening/idrottslag• Tillfällig reklam för en produkt eller projekt.
Vad är det slutgiltiga målet med hemsidan?• Bli stenrik!• Få ut vårt budskap• Sälja mer av en viss vara• Få folk att sluta heja på Djurgården
Diskutera:Vad är syftet med vår
hemsida ”Välj Webbdesign”?
![Page 11: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/11.jpg)
Webbdesign: Att planera en hemsida 11
MålgruppVilka ska besöka hemsidan?• Alla som gillar bävrar• Folk som vill lära känna andra med samma
intresse (ex: bävrar)• Tjejer mellan 13-18• Folk som vill tävla/veta mer om en specifik
produkt.
Hur fångar vi upp denna målgrupp?
![Page 12: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/12.jpg)
Webbdesign: Att planera en hemsida 12
InnehållSka vi använda oss av mycket text/artiklar?Ska vi fokusera på bilder?Ska vi fokusera på
animationer/grafik/flash/film? (vanligt inom reklam)
![Page 13: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/13.jpg)
Webbdesign: Att planera en hemsida 13
StrukturHur ska vi strukturera upp hemsidan?På servern?I webbläsaren?
Diskutera:Hur ser strukturen ut på
Aftonbladet.se?Hur skiljer den sig från
blondinbella.se?
![Page 14: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/14.jpg)
Webbdesign: Att planera en hemsida 14
Flödesschema (I) Startsida
n
•Nyheter
•Arkiv•Bild
1, bild 2, bild 3 mm
Nyheter
•Om mig
•Utbildning
•CV
Om Mig
![Page 15: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/15.jpg)
Webbdesign: Att planera en hemsida 15
Flödesschema (II)
• Stycke 1• Stycke 2• Bild 2• Bild 3• Länk 1 (Mål: Om
mig)
Startsida
• Nyhet 1• Nyhet 2 • Film 1 (Från
youtube)
Nyheter
• Text• CV• Utbildning• Fin bild på mig
Om Mig
Meny
![Page 16: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/16.jpg)
Webbdesign: Att planera en hemsida 16
TextFokus: Text eller bilder?Vad är bra text för internet?Vad för roll spelar målgruppen?
![Page 17: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/17.jpg)
Webbdesign: Att planera en hemsida 17
Exempel (I): Aftonbladet
![Page 18: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/18.jpg)
Webbdesign: Att planera en hemsida 18
Exempel (II): BlondinBella
![Page 19: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/19.jpg)
Webbdesign: Att planera en hemsida 19
Att tänka på för text på internetKort och sakligtInga onödiga ord (Ranelidska går fett bort på
Internet)LuftigtRätt fontRubrikerUnderrubrikIngressTabeller
![Page 20: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/20.jpg)
Webbdesign: Att planera en hemsida 20
Bilder/Animationer/FlashVad är målgruppen?Vad vill vi uppnå med våra bilder?
![Page 21: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/21.jpg)
Webbdesign: Att planera en hemsida 21
Exempel (I): Bild från Aftonbladets artikel
![Page 22: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/22.jpg)
Webbdesign: Att planera en hemsida 22
Exempel (II): Bild från BlondinBellas blogginlägg
![Page 23: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/23.jpg)
Webbdesign: Att planera en hemsida 23
Grafik profilHur ska sidan se ut designmässigt? Hur skapar vi en grafisk profil som är
enhetligt?
![Page 24: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/24.jpg)
Webbdesign: Att planera en hemsida 24
Hemsida
Visitkort
Arbetskläder
Dokumentmallar
Arbetsplats
Etik/värderingar
Grafisk profil
![Page 25: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/25.jpg)
Webbdesign: Att planera en hemsida 25
Marknadsföring
Du alltså, hade vi inte tänkt ha
några besökare på snigeldate.se?
Ööö asså, räcker
inte google?
![Page 26: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/26.jpg)
Webbdesign: Att planera en hemsida 26
MarknadsföringBannersSociala medier”In real life”…?
![Page 27: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/27.jpg)
Webbdesign: Att planera en hemsida 27
Den logiska kopplingen!Marknadsföring
Grafisk profil
![Page 28: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/28.jpg)
Webbdesign: Att planera en hemsida 28
Marcus magiska hemsideformel Asbra idé!
Sjukt bra arbetsplan!
Perfekt kodad och designad
![Page 29: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/29.jpg)
Webbdesign: Att planera en hemsida 29
Sammanfattning
![Page 30: F#1: Att planera en hemsida](https://reader033.fdocument.pub/reader033/viewer/2022051816/546715f7af795999788b4da1/html5/thumbnails/30.jpg)
Webbdesign: Att planera en hemsida 30
Instuderingsfrågor