10 tips til din hjemmeside

<C

M

X

Q

B

=

T

W

F

D

P

I

Z

1

5

7

%

"

O

6

(

>

?

G

H

K

R

<C

M

Q

=

WP

I

5

7

O

6?K

<C

M

X

Q

B

=

T

W

F

D

P

I

Z

1

5

7

%"

O

6

(

>

?

G

H

K

R

<C

M

Q

=

WP

I

5

7

O

6?K

<C

M

X

Q

B

=

T

W

F

D

P

I

Z

1

5

7

%

"

O

6

(

>

?

H

K

R

<C

M

Q

=

WP

I

5

7

O

6?K

G

<C

M

X

Q

B

=

T

W

F

D

P

I

Z

1

5

7

%

"

O

6

(

>

?

H

K

R

<C

M

Q

=

WP

I

5

7

O

6?K

G

<C

M

X

Q

B

=

T

W

F

D

P

I

Z

1

5

7

%

"

O

6

(

>

?

G

H

K

R

<C

M

Q

=

WP

I

5

7

O

6?K

<C

M

X

Q

B

=

T

W

F

D

P

I

Z

1

5

7

%

"

O

6

(

>

?

H

K

R

<C

M

Q

=

WP

I

5

7

O

6?K

G

<C

M

X

Q

B

=

T

W

F

D

P

I

Z

1

5

7%

"

O

6

(

>

?

G

H

K

R

<C

M

Q

=

WP

I

5

7

O

6?K

<C

M

X

Q

B

=

T

W

F

D

P

I

Z

1

5

7

%

"

O

6

(

>

?

G

H

K

R

<C

M

Q

=

WP

I

5

7

O

6?K

<C

M

X

Q

B

=

T

W

F

D

P

I

Z

1

5

7

%

"

O

6

(

>

?

H

K

R

<C

M

Q

=

WP

I

5

7

O

6?K

G

<C

M

X

Q

B

=

T

W

F

D

P

I

Z

1

5

7

%

"

O

6

(

>

?

H

K

R

<C

M

Q

=

WP

I

5

7

O

6?K

G

<C

M

X

Q

B

=

T

W

F

D

P

I

Z

1

5

7

%

"

O

6

(

>

?

G

H

K

R

<C

M

Q

=

WP

I

5

7

O

6?K

<C

M

X

Q

B

=

T

W

F

D

P

I

Z

1

5

7

%

"

O

6

(

>

?

H

K

R

<C

M

Q

=

WP

I

5

7

O

6?K

G

FRANS!BJØRN-THYGESEN!-!DIREKTØRMIDTJYSK!TURISME

DANIEL ORD

DANIEL ORD• Medievidenskab

DANIEL ORD• Medievidenskab• Deltagelse og sociale medier

DANIEL ORD• Medievidenskab• Deltagelse og sociale medier • Speciale i turistbranchens brug af nye medier

JONAS GRAU

JONAS GRAU• Selvstændig

JONAS GRAU• Selvstændig• Iværksætter

JONAS GRAU• Selvstændig• Iværksætter• IT-studerende

JONAS GRAU• Selvstændig• Iværksætter• IT-studerende• Venlig nørd

JONAS GRAU• Selvstændig• Iværksætter• IT-studerende• Venlig nørd

[email protected] 21 90 07

mailto:[email protected]






PROGRAM

PROGRAM• Introduktion

PROGRAM• Introduktion• Generelt om hjemmesider

PROGRAM• Introduktion• Generelt om hjemmesider• Tricks

PROGRAM• Introduktion• Generelt om hjemmesider• Tricks• Kl. 12: Frokost

PROGRAM• Introduktion• Generelt om hjemmesider• Tricks• Kl. 12: Frokost• Flere tricks

PROGRAM• Introduktion• Generelt om hjemmesider• Tricks• Kl. 12: Frokost• Flere tricks• Kl. 14: Kaffe

PROGRAM• Introduktion• Generelt om hjemmesider• Tricks• Kl. 12: Frokost• Flere tricks• Kl. 14: Kaffe• Opsamling

PROGRAM• Introduktion• Generelt om hjemmesider• Tricks• Kl. 12: Frokost• Flere tricks• Kl. 14: Kaffe• Opsamling• Senest kl. 16: Farvel og tak

PRAKTISKE OPLYSNINGER

PRAKTISKE OPLYSNINGER• Toiletter

PRAKTISKE OPLYSNINGER• Toiletter• Rygepolitik

PRAKTISKE OPLYSNINGER• Toiletter• Rygepolitik• Pauser

HVEM ER I?

HVEM ER I?• Navn• Organisation• Hjemmeside• Stilling og arbejdsområde• Erfaring• Forventninger til i dag

MIT MÅL FOR I DAG

MIT MÅL FOR I DAGI forhold til jeres hjemmeside skal I blive:


• opmærksomme på hvad der kan forbedres


• opmærksomme på hvad der kan forbedres• i stand til at gøre det bedre


• opmærksomme på hvad der kan forbedres• i stand til at gøre det bedre• bedre rustet til at søge hjælp


• opmærksomme på hvad der kan forbedres• i stand til at gøre det bedre• bedre rustet til at søge hjælp

Og at I får en god, lærerig dag

10 TRICKS TIL DIN HJEMMESIDE

10 TRICKS TIL DIN HJEMMESIDE1. Vær læsevenlig


2. Simpel er OK


2. Simpel er OK

3. Opdater jævnligt


2. Simpel er OK


4. Brug flere medier


2. Simpel er OK


4. Brug flere medier

5. Gør det nemt at finde vigtig information

10 TRICKS TIL DIN HJEMMESIDE

10 TRICKS TIL DIN HJEMMESIDE6. Vær konsistent


7. Giv en helhedsoplevelse



8. Test din hjemmeside




9. Optimer til søgemaskinerne




9. Optimer til søgemaskinerne

10. Spørg om hjælp

ELEMENTERNE PÅ EN HJEMMESIDE

ELEMENTERNE PÅ EN HJEMMESIDE• Hoved• Navigation• Indhold• Evt. højre/venstre kolonne• Fod

FLERE ELEMENTER

FLERE ELEMENTER• Tekst

FLERE ELEMENTER• Tekst• Interne og eksterne links

FLERE ELEMENTER• Tekst• Interne og eksterne links• Billeder

FLERE ELEMENTER• Tekst• Interne og eksterne links• Billeder• Andet?

ORD JEG BRUGER...

ORD JEG BRUGER...• Brugere = besøgende (gæster på hjemmesiden)

ORD JEG BRUGER...• Brugere = besøgende (gæster på hjemmesiden)• ...

DEN GYLDNE (NØGLE) SÆTNING

DEN GYLDNE (NØGLE) SÆTNINGFå brugeren til at føle sig klog!



TRICK NR. 1:VÆR LETLÆSELIG


• Brugere læser ikke - de skimmer


• Brugere læser ikke - de skimmer• Kun 20% af teksten bliver læst


• Brugere læser ikke - de skimmer• Kun 20% af teksten bliver læst• TV = lean back, Internet = lean forward

VÆR LETLÆSELIGSKRIV TIL NETTET

VÆR LETLÆSELIGSKRIV TIL NETTET• Skriv det vigtigste information i toppen

VÆR LETLÆSELIGSKRIV TIL NETTET• Skriv det vigtigste information i toppen• Gode underoverskrifter

VÆR LETLÆSELIGSKRIV TIL NETTET• Skriv det vigtigste information i toppen• Gode underoverskrifter• Punktform i stedet for tekstafsnit

VÆR LETLÆSELIGSKRIV TIL NETTET• Skriv det vigtigste information i toppen• Gode underoverskrifter• Punktform i stedet for tekstafsnit• Brug halvt så mange ord

VÆR LETLÆSELIGBRUG BILLEDER

VÆR LETLÆSELIGBRUG BILLEDER• Et billede siger mere end 1000 ord

VÆR LETLÆSELIGBRUG BILLEDER• Et billede siger mere end 1000 ord• Men tager 10 gange så lang tid at hente

VÆR LETLÆSELIGBRUG BILLEDER• Et billede siger mere end 1000 ord• Men tager 10 gange så lang tid at hente• Upload i korrekt størrelse

VÆR LETLÆSELIGBRUG BILLEDER• Et billede siger mere end 1000 ord• Men tager 10 gange så lang tid at hente• Upload i korrekt størrelse• Link evt. til stort format


• Billeder inde i teksten er godt for øjet


• Billeder inde i teksten er godt for øjet• Virker som blikfang og kan guide øjet til vigtig information





VÆR LETLÆSELIGØVELSE• Sig pænt goddag til din sidemand• Find en artikel på din hjemmesider• Forklar ham/hende de vigtigste punkter i så korte træk som muligt

• Byt

TRICK NR. 2: SIMPEL ER OK


• Brugeren skal kunneoverskue hjemmesiden



• Uoverskuelighed = frustrerede brugere




• KISS, Kill your darlings




• KISS, Kill your darlings• Det gælder ikke om fylde hele skærmen ud




• KISS, Kill your darlings• Det gælder ikke om fylde hele skærmen ud• Gør det tydeligt, hvad der passer hvor

TRICK NR. 3: OPDATER JÆVNLIGT


• Vedligeholdelse opbygger troværdighed


• Vedligeholdelse opbygger troværdighed• Forældet indhold skaber utryghed


• Vedligeholdelse opbygger troværdighed• Forældet indhold skaber utryghed• Besøgende får en grund til at komme tilbage


• Vedligeholdelse opbygger troværdighed• Forældet indhold skaber utryghed• Besøgende får en grund til at komme tilbage• Godt for søgemaskinerne (mere senere)

OPDATER JÆVNLIGTØVELSE• Snak sammen i grupper• Find konkrete forslag til nye tiltag på hinandens hjemmesider, der egner sig til løbende opdatering

OPDATER JÆVNLIGTMINE FORSLAG

OPDATER JÆVNLIGTMINE FORSLAG• Nyheder

OPDATER JÆVNLIGTMINE FORSLAG• Nyheder• Beretninger fra arrangementer

OPDATER JÆVNLIGTMINE FORSLAG• Nyheder• Beretninger fra arrangementer• Kalender

OPDATER JÆVNLIGTMINE FORSLAG• Nyheder• Beretninger fra arrangementer• Kalender• Ugen der gik

OPDATER JÆVNLIGTMINE FORSLAG• Nyheder• Beretninger fra arrangementer• Kalender• Ugen der gik• Næste uges program

TRICK NR. 4: BRUG FLERE MEDIER


• Din hjemmeside er en del af et økosystem


• Din hjemmeside er en del af et økosystem• E-mail (send til ven)


• Din hjemmeside er en del af et økosystem• E-mail (send til ven)• Facebook


• Din hjemmeside er en del af et økosystem• E-mail (send til ven)• Facebook• Godt til at skabe omtale


• Din hjemmeside er en del af et økosystem• E-mail (send til ven)• Facebook• Godt til at skabe omtale• Kommunikationsplatform



• Youtube



• Youtube• Google Maps

BRUG MANGE MEDIEREKSEMPLER• http://anybite.com• http://tripadvisor.com• http://auningby.dk/news.php?extend.51.1• http://scootertv.dk

http://anybite.com

http://anybite.com

http://tripadvisor.com

http://tripadvisor.com

http://auningby.dk/news.php?extend.51.1

http://auningby.dk/news.php?extend.51.1

http://scootertv.dk

http://scootertv.dk

BRUG MANGE MEDIERØVELSE• Embed en video fra Youtube i et nyt indlæg• Embed et Google Map i et nyt indlæg

Find youtube video

Kopier <Embed> koden

Rediger den artikel i før oprettede

Indsæt koden under HTML-fanebladet

10hjemmesidetricks.wordpress.com

Bruger: 10hjemmesidetricks

Kodeord: 1234asdf

TRICK NR. 5: GØR DET NEMT AT FINDE VIGTIG INFORMATION


• Sæt dig i dine brugeres sted


• Sæt dig i dine brugeres sted• Lav logisk opdeling af menupunkter


• Sæt dig i dine brugeres sted• Lav logisk opdeling af menupunkter• Tilbyd søgning


• Sæt dig i dine brugeres sted• Lav logisk opdeling af menupunkter• Tilbyd søgning• Brug forsiden

TRICK NR. 6: VÆR KONSISTENT


• Overhold konventionerne


• Overhold konventionerne• Brugere genbruger viden



• Faste pladser til hjemmesidens elementer



• Faste pladser til hjemmesidens elementer• Undlad at være for kreativ med teksten

VÆR KONSISTENTKONVENTIONER

VÆR KONSISTENTKONVENTIONER• Logo placeres oftest i øverste venstre hjørne

VÆR KONSISTENTKONVENTIONER• Logo placeres oftest i øverste venstre hjørne• Klik på logo fører til forsiden

VÆR KONSISTENTKONVENTIONER• Logo placeres oftest i øverste venstre hjørne• Klik på logo fører til forsiden• Et menupunkt er et internt link

VÆR KONSISTENTKONVENTIONER• Logo placeres oftest i øverste venstre hjørne• Klik på logo fører til forsiden• Et menupunkt er et internt link• Links er understregede

VÆR KONSISTENTKONVENTIONER• Logo placeres oftest i øverste venstre hjørne• Klik på logo fører til forsiden• Et menupunkt er et internt link• Links er understregede• Og understreget tekst er links!


• Et link skal ikke åbne i et nyt vindue


• Et link skal ikke åbne i et nyt vindue• Det ødelægger “tilbage”-knappen


• Et link skal ikke åbne i et nyt vindue• Det ødelægger “tilbage”-knappen• Lad brugeren bestemme

VÆR KONSISTENTØVELSE• Brug lidt tid på at browse rundt på din hjemmeside

• Overholder den konventionerne?• Noter dine resultater

TRICK NR. 7: GIV EN HELHEDSOPLEVELSE


• Overhold samme udtryk på tværs af medier


• Overhold samme udtryk på tværs af medier• Benyt fysiske referencer


• Overhold samme udtryk på tværs af medier• Benyt fysiske referencer• Eksempel• Bruger I fysiske referencer på hjemmesiden?

TRICK NR. 8: TEST DIN HJEMMESIDE


• Umuligt at se sin hjemmesiden som brugeren ser den



• Tænke-højt test



• Tænke-højt test• Nem, billig og god metode til brugertest



• Tænke-højt test• Nem, billig og god metode til brugertest• Kan være skræmende effektiv

TEST DIN HJEMMESIDETÆNKE-HØJT TEST

TEST DIN HJEMMESIDETÆNKE-HØJT TEST1. Fortæl navnet og adressen på hjemmesiden


2. Inden han/hun går ind på siden, spørg om deres forventninger til hvad siden indeholder



3. Opsæt et scenarie der tester en essentiel funktion




4. Bed brugeren om at løse opgaven mens han/hun “tænker højt”





5. Forhold dig stille imens opgaven udføres. Læg mærke til hvordan han/hun benytter hjemmesiden





5. Forhold dig stille imens opgaven udføres. Læg mærke til hvordan han/hun benytter hjemmesiden

6. Gentag punkt 3. til 5 for flere essentielle funktioner

TEST DIN HJEMMESIDEFORSLAG TIL SCENARIER

TEST DIN HJEMMESIDEFORSLAG TIL SCENARIER• Du skal arrangere familiedagen på søndag og skal finde ud af om [xxx] har åbent


• Du skal overnatte søndag til mandag og skal booke et værelse


• Du skal overnatte søndag til mandag og skal booke et værelse

• Du leder efter et kursuscenter til en konference, men er på et stramt budget. Find priserne på leje af lokaler til et éndagskursus inklusiv the, kaffe, og kage

TEST DIN HJEMMESIDEØVELSE• Gå sammen med din sidemand• Lav en tænke-højt test af din hjemmeside• 30 min. pr. hjemmeside• Notér resultatet

TRICK NR. 9: OPTIMER TIL SØGEMASKINERNE


• En søgemaskine læser alle hjemmesider


• En søgemaskine læser alle hjemmesider• Kigger på hvert enkelt ord i indholdet


• En søgemaskine læser alle hjemmesider• Kigger på hvert enkelt ord i indholdet• Tæller links


• En søgemaskine læser alle hjemmesider• Kigger på hvert enkelt ord i indholdet• Tæller links

• En god placering i Google er meget vigtig

OPTIMER TIL SØGEMASKINERNETIPS OG TRICKS

OPTIMER TIL SØGEMASKINERNETIPS OG TRICKS• Sæt dig i brugerens sted - hvilke ord kunne man forestille sig, at de søger på?


• Skriv de søgeord i titlen, overskriften, underoverskrifter og links



• Brug selve søgeordet til links, ikke “klik her”



• Brug selve søgeordet til links, ikke “klik her”• Nyt indhold er godt



• Brug selve søgeordet til links, ikke “klik her”• Nyt indhold er godt• F.eks. nyhedssektion, blog osv.

OPTIMER TIL SØGEMASKINERNEØVELSE• Overvej hvilke søgeord der er interessante• Lav en søgning på de søgeord - hvor ligger du henne i resultatet?

• Se din hjemmeside igennem - benytter du allerede nogle af førnævnte tricks?

• Prøv evt. at finde din sidemands hjemmeside på Google - lad som om du ikke kender firmanavnet.

TRICK NR. 10: SPØRG OM HJÆLP


• Spørgs kunderne om deres mening om din hjemmeside



• Forslag / Ideer



• Forslag / Ideer• Er det noget du selv kan lave?

SPØRG OM HJÆLPFÅ PROFESSIONEL HJÆLP

SPØRG OM HJÆLPFÅ PROFESSIONEL HJÆLP• Vær specifik og gå i detaljer

SPØRG OM HJÆLPFÅ PROFESSIONEL HJÆLP• Vær specifik og gå i detaljer• Det er svært at give et tilbud på noget der er løst defineret


• Beskriv formålet med det du gerne vil have


• Beskriv formålet med det du gerne vil have• Nogle gange er løsningen nemmere end man tror



• Tegn hvad du mener



• Tegn hvad du mener• Wireframing

SPØRG OM HJÆLPWIREFRAMING


• Meget overordnet


• Meget overordnet• Tegning af elementerne og deresplacering i forhold til hinanden



• Funktionalitet - ikke design



• Funktionalitet - ikke design• Kan spare dig for tid og penge

SPØRG OM HJÆLPØVELSE• Lav en wireframe af• en ny idé du har fået under dette kursus• eller din nuværende forside samt en underside

• Få så mange af dagens guldkorn med som muligt

OPSAMLING

OPSAMLING• Vær læsevenlig. Det vigtigste øverste. Hold det kort. Brugere på nettet læser ikke - de skimmer.


• Simpel er OK. Gælder både design og indhold


• Simpel er OK. Gælder både design og indhold• Opdater jævnligt. Opbygger troværdighed. Brugeren kommer tilbage. Godt for Google


• Simpel er OK. Gælder både design og indhold• Opdater jævnligt. Opbygger troværdighed. Brugeren kommer tilbage. Godt for Google

• Brug flere medier. Du er en del af et økosystem. Embed fra Youtube. Opret en side på Facebook.

OPSAMLING

OPSAMLING• Gør det nemt at finde vigtig information. Logisk opdeling. Tilbyd søgning.


• Vær konsistent. Overhold konventionerne. Vær konsistent på din egen hjemmeside. Undgå at blive for kreativ med tekstformateringen.


• Vær konsistent. Overhold konventionerne. Vær konsistent på din egen hjemmeside. Undgå at blive for kreativ med tekstformateringen.

• Giv en helhedsoplevelse. Samlet grafisk udtryk. Benyt fysiske referencer.

OPSAMLING

OPSAMLING• Test din hjemmeside. Tænke-højt test. Lær hvordan dine brugere tænker.


• Optimer til søgemaskinerne. Brug vigtige ord i titler, overskrifter, underoverskrifter og links. Ingen “klik her” links.


• Optimer til søgemaskinerne. Brug vigtige ord i titler, overskrifter, underoverskrifter og links. Ingen “klik her” links.

• Spørg om hjælp. Hør dine kunders mening. Vær specifik hvis du skal indhente tilbud. Beskriv formålet med dine ændringer. Wireframing.

TAK FOR I DAG!

Education

10 tips til din hjemmeside