DEN ULTIMATIVE GUIDE TIL EN SUCCESFULD HJEMMESIDE. Digitalt Bureau wearecrunch.dk DEN ULTIMATIVE GUIDE TIL EN SUCCESFULD HJEMMESIDE SIDE 1

Transkript

1 Digitalt Bureau wearecrunch.dk DEN ULTIMATIVE GUIDE TIL EN SUCCESFULD HJEMMESIDE SIDE 1

2 INTRODUKTION I 2017 har de fleste progressive forretningsfolk allerede taget imod de endeløse muligheder, som internettet giver - startende med en hjemmeside til virksomheden. Som du nok kan forestille dig, er der mange hjemmesider, der forbliver skjult i mørket, fordi de mangler en eller flere væsentlige komponenter. Det viser sig altså, at det i disse dage ikke er nok bare at have en hjemmeside. Hemmeligheden bag en vellykket hjemmeside ligger i den perfekte kombination af billeder, tekst, struktur og søgemaskineoptimering samt at finde balancen mellem dem alle. De første tre gør hjemmesiden tiltalende for publikum, hvorimod SEO hjælper hjemmesiden til at blive fundet af søgemaskiner. Der findes efterhånden mere end en milliard hjemmesider. Derfor kan dit websted nemt gå tabt i mængden og dermed ikke opnå den ønskede trafik. Der er dog visse ting, du kan gøre for at øge synligheden af dit websted samt gøre den mere brugervenlig. Vi, hos Crunch, har samlet en række gode råd til dig. Hvordan benyttes guiden? Denne guide er udelukkende designet til personer, der ønsker at evaluere og forbedre deres hjemmesides præstationer. Du kan læse om de vigtigste elementer, og du kan bruge checklisterne under hvert afsnit til at markere, hvad der skal forbedres på din hjemmeside. SIDE 2

3 1 DET VISUELLE 1.1 BILLEDER Billeder er en væsentlig bestanddel af de fleste hjemmesider. Som ordsproget lyder, et billede siger mere end tusinde ord. Visuelle elementer hjælper bl.a. til at tiltrække brugerens opmærksomhed samt forbedre læsbarheden af siden. Da mennesker generelt er meget visuelle væsener, øger billederne chancen for, at publikum vil huske, hvad de har set VALG AF BILLEDER At vælge de rigtige billeder til dit websted er en seriøs opgave. Billederne bør repræsentere virksomhedens stil - du kan ikke have et sjovt billede, hvis du f.eks. er læge. Alligevel er tegneseriefigurer og selskabs maskotter tendensen i disse dage, og det er altid en god idé at være moderne. Billedtitler og ALT tag Dette er hovedsagelig til SEO formål, men det er en god idé at skrive passende billedtitler og Alt-tags - altså at forklare med ord, hvad billedet viser. Hvis billedet ikke indlæses - viser browseren i stedet dine alt-tags, hvilket giver de besøgende en idé om hvad der skulle have været. Alt-tags bruges derudover også af skærmlæsere til synshandicappede, så det vil muligvis også gøre din side mere tilgængelig og brugervenlig. SIDE 3

4 Billedstørrelse For at dit websted skal kunne indlæses hurtigere, skal størrelsen af alle billederne reduceres til et minimum. Du kan reducere omkring 20-25% af billedstørrelsen uden at skade kvaliteten. Du kan gøre dette via billedredigeringssoftware - f.eks. via hjemmesiden Vi anbefaler, at hvert billede er omkring 70 kb eller mindre. Filformat De mest almindelige filformater til billeder er JPEG, PNG og GIF. Der er små forskelle mellem de to første - primært vil png ikke tabe kvalitet, når den komprimeres. Derudover er PNG i stand til at have en gennemsigtig baggrund. Filformatet GIF er bedre til tegnefilm og tegnings lignende billeder. Uanset hvilken filtype du vælger, skal du sørge for, at billedet ikke ser pixeleret eller deformt ud på din hjemmeside VIDEO De to væsentligste faktorer når det kommer til brugen af videoer på en hjemmeside er, hvor tung videoen er, og hvor meget tyngden påvirker indlæsningstiden på din hjemmeside. Det bedste råd mod dette er at uploade din video på YouTube, Vimeo eller andre videotjenester og derefter integrere det på din hjemmeside. På denne måde sparer du plads og skaber mere trafik. Ved brug af videomateriale er det vigtigt at holde brugerens interesse. Folk har i dag ikke meget tid og internettet er et distraherende miljø. Hvis indholdet ikke fanger målgruppen, er der uendeligt mange andre muligheder, hvor de kan søge samme information. At holde målgruppens fokus med en video på ca. 2 minutters længde anses som værende den optimale løsning. Sidst men ikke mindst er det vigtigt, at videoens stil skal spille sammen med din virksomheds visuelle identitet STIL OG FARVER Valg af farver og stil er en af de første ting, du bør overveje, når du skal have en hjemmeside. Hver farve er ubevidst forbundet med særlige følelser og forskellige humører. Her er de vigtigste farver og deres betydning, når de bruges til internettet. Blå Blå forbindes ofte med tillid og troværdighed. Indenfor webdesign bliver farven blå ofte benyttet til at udstråle professionalisme. Rød Rød er en kraftfuld farve, som kan have forskellige betydninger i forskellige kombinationer. Sammen med sort ses rød som maskulin og aggressiv, hvorimod den kombineret med hvid kan fremstå romantisk. Grøn Grøn bringer en følelse frem af natur og vækst. Dette er grunden til at mange virksomheder, som fokuserer på miljøvenlighed, økologi og/ eller sunde alternativer vælger at benytte en nuance af grøn som deres primære farve. Orange Orange er en varm og energisk farve, som kan frembringe følelser af glæde, positivitet samt entusiasme. Farven benyttes ofte også til at få visse elementer til at skille sig ud og dermed skabe opmærksomhed. Farven fungerer derfor godt til CTA knapper. Gul Gul er en levende farve, der ofte forbindes med positivitet, selvsikkerhed og glæde. Kombineres farven med sort ses gul dog ofte som et symbol for fare. SIDE 4

5 Sort Sort forbindes ofte med følelsen af styrke og autoritet. Det kan også udstråle sofistikation og beskyttelse. Sort benyttes ofte til tekst. Hvid Hvid forbindes ofte med renhed, uskyldig og simplicitet. Hvide områder åbner hjemmesiden op og giver brugerne et bedre overblik. Derimod kan for meget hvid gøre at din hjemmeside pludselig fremstår tom. Det er en god idé at bestemme sig for 2 eller 3 primære farver og benytte deres nuancer til at gøre din hjemmeside mere tiltalende. Hvis du vil vide mere om farvepsykologi, kan du læse mere her. SIDE 5

6 TJEKLISTE Mine billeder stemmer overens med virksomhedens overordnede stil. Mine billeder er af høj kvalitet. Mine billeder har passende titler og alt-tags. Mine billeder har størrelsen 70 kb eller mindre. Mine billeder ser hverken pixelerede eller deforme ud. Mine videoer er omkring 2 minutter lange. Mine videoer er uploadet til YouTube, Vimeo el. andet. Farverne på min hjemmeside hænger sammen med den følelse jeg ønsker at skabe hos brugeren. Jeg har ikke mere end 3 primære farver på min hjemmeside. SIDE 6

7 2 TEKST 2.1 NØGLEORD Når du skal skrive indhold til dine sider eller blogindlæg, er det altid en god idé at have et nøgleord i tankerne. Dette nøgleord skal symbolisere det emne du taler om og er en af Googles primære faktorer for rangering. Din tone of voice bør være genkendelig i alt det indhold virksomheden skaber - alt der har bare den mindste smule tekst. Ved at definere din virksomheds identitet, hjælper du din målgruppe med at forstå virksomheden bedre og dermed forhåbentligt synes bedre om den. Du bør prøve at benytte dette nøgleord i dine udgaver med en tæthed på 2-3%. Bruger du ordet mere end det, vil det føles som om du fylder din tekst med nøgleord uden at det giver mening. Du kan tjekke din nøgleords tæthed her. 2.2 TONE OF VOICE Enhver virksomhed har dets egen identitet - både visuelt og verbalt. Afhængigt af hvordan du ønsker at fremstå for dine kunder, kan du udstråle fx humor, seriøsitet eller drama. Når du har identificeret din virksomheds stil, skal du huske at det skal gå igen i dit sprog når du skriver indhold til virksomheden. Tone of voice består af sprogbrug (fx professionelt, slang) og sætningskonstruktioner. Det handler altså mere om hvordan vi siger noget, end hvad vi egentlig siger. SIDE 7

8 2.3 LÆSBARHED Når vi er online og skimmer en tekst søger vores øjne automatisk efter de nøgleord, der giver os svarene. Derfor er læsbarhed en vigtig faktor for udførelsen af en hjemmeside. For at gøre dit skriftlige indhold let at læse skal du: Skrive korte paragraffer - en idé pr. paragraf Benyt korte sætninger - tolv ord i gennemsnit fungerer bedst Udelad overflødige ord Undgå jargon og komplekse ord Skriv med en aktiv stemme Undgå unødig gentagelse Henvend dig direkte til læseren ved brugen af ordet dig 2.5 TEKST ORGANISERING Når det kommer til læsbarhed af dine tekster, er det en god idé at organisere dit indhold. Det kan du gøre bl.a. ved hjælp af: Punktlister Nummererede lister Paragraffer Overskrifter 2.4 VISUALT HIERAKI En anden ting du kan gøre for at forbedre læsbarheden er at skabe et hierarki i din tekst for at vejlede læseren i, hvor et nyt afsnit starter. Det hjælper med at gøre det lettere for læseren at skimme teksten. Du kan opnå et visuelt hierarki ved at: Bruge farver, skrifttyper og kontrast Brug korrekt justering Brug overskrifter for hver ord Det er værd at nævne, at du kun skal have ét H1-tag pr. side, fordi Google bruger det som et fingerpeg til at genkende hovedemnet på siden. Hvis du har to eller flere H1 tags med forskellige søgeord, vil det være svært for søgemaskinen at bestemme, hvad siden handler om. Logik er en vigtig del af organiseringen, så vær sikker på at dine primære fokuspunkter på din hjemmeside er ordentligt delt op. 2.6 LINK TIL KILDER Det er altid vigtigt at henvise til dine kilder. Ved at give læseren relevante kilder, viser du dem at du har lavet dit forarbejde og gerne vil give dem ekspertvurderinger indenfor emnet. Eksterne links hjælper samtidig med at forbedre SEO, hvilket vi vil fortælle dig mere om i kapitel 5. SIDE 8

9 2.7 LÆNGDE Teksten på hver side på din hjemmeside skal være minimum 300 ord lang for at opnå god SEO og for at fange læserens interesse. Selvom det måske kan lyde som en udfordring, kan det betale sig at arbejde på lange artikler på din hjemmeside. Ifølge HubSpot er den ideelle længde af et blogindlæg 2100 ord. Minimum length 300 words Optimal length 2100 words SIDE 9

10 TJEKLISTE Jeg har valgt mine nøgleord på baggrund af grundig research. Jeg har nøgleord med en tæthed på 2-3% på hver en side. Mine paragraffer indeholder hver især kun en idé. Jeg bruger korte sætninger. Jeg bruger ikke jargon og komplekse ord. Jeg har ikke unødvendige gentagelser. Mine sider har et klart visuelt hierarki. Jeg bruger overskrifter for hver ord. Jeg bruger kun ét H1-tag per side. Jeg bruger punkt eller nummererede lister. Mine tekster er minimum 300 ord lange. Jeg har relevante henvisninger til alle mine kilder. SIDE 10

11 3 ALT DET TEKNISKE 3.1 HJEMMESIDENS HASTIGHED Google har fundet ud af at 53% af alle mennesker vil forlade en hjemmeside hvis den ikke er loader indenfor 3 sekunder eller mindre. Du kan gratis tjekke din hjemmesides hastighed på Google PageSpeed. Denne tjeneste vil også give dig foreslag til hvordan du kan forbedre din hjemmesides hastighed. Hvad Crunch anbefaler dig at gøre: Reducer billedstørrelse (Kapitel 1.2 Valg af billeder) Minimer HTTP anmodninger Reducer din servers responstid Optimer CSS levering Reducer antallet af plugins ( Aktiver browser caching Aktiver kompression Downsize ressourcer Prioriter dit indhold (Kapitel 4.1 Layout af hjemmesiden) Dette lyder måske overvældende og kompliceret. Hvis dette er tilfældet og du sidder tilbage med enten spørgsmål eller har brug for hjælp er du mere end velkommen til at kontakte os. SIDE 11

12 3.2 SIKKERHED En af de seneste opdateringer til hjemmeside-optimering er det SSL-certifikat, som alle hjemmesider burde have. Alle de websteder, der for øjeblikket er på en HTTPforbindelse, skal overføres til HTTPS (S står for secure ). Dette vil øge sikkerheden på din hjemmeside, hvilket gør det mere troværdigt for brugerne, samt for Google også. Det at have dit websted på en HTTPS-forbindelse er et must for WORDPRESS PLUGINS Ved at begrænse de unødvendige plugins på din hjemmeside, hjælper det siden med at fungere bedre. En anden vigtig ting er jævnligt at opdatere de plugins, du allerede har. Dette vil hjælpe til at beskytte dit websted mod hacker angreb. 3.4 HOSTING Hvor dit websted er hostet henne, kan have betydelig virkning på sidens hastighed. Hosting er den solide grund, hvor al din information er. Så at have en pålidelig hosting udbyder er yderst vigtigt. En faktor du bør overveje, er placeringen - hvis en Google-søgning udføres af en person i Danmark, kommer de bedste resultater fra Danmark-baserede hjemmesider. Så hvis du har dit websted på en britisk hostingudbyder, vil du ikke rangere godt. SIDE 12

13 TJEKLISTE Min hjemmeside loader på mindre end 3 sekunder. Min hjemmeside er på en HTTPS-forbindelse. Alle mine plugins er opdaterede. Min hosting udbyder er pålidelig. SIDE 13

14 4 DESIGN Når du tænker på layoutet på din hjemmeside, bør du overveje alle sider som destinationssider. Du ved aldrig, hvor de besøgende kommer ind fra. Derfor er dine undersider lige så vigtige som din forside. 4.1 LAYOUT AF HJEMMESIDEN Hvis vi deler en hjemmeside op i flere dele, er der: Over-the-fold -indhold - alt det, som den besøgende vil se uden at rulle ned på siden. Under-fold -indhold - alt, der er synligt, når du ruller ned. Above-the-fold-content Da 100% af dine besøgende vil se, hvad der er over foldet, skal de vigtigste oplysninger placeres der. Dette omfatter: En klar og simpel navigation En overskrift der indeholder det vigtigste søgeord (et H1- tag, der gør det muligt for Google at forstå emnet) En underoverskrift med en kort virksomhedsbeskrivelse eller et tilbud En opfordring til handling - hvad vil du have din bruger til at gøre som næste skridt Below-the-fold-content Når den besøgende har rullet ned, skal de kunne læse mere om dine produkter og tjenester. Derudover kan du også opbygge din troværdighed, herunder tillidsindikatorer såsom kundeanmeldelser og anmeldelser. Du kan også tilføje udvalgte eller seneste blogindlæg, begivenheder eller en nyhedsbrevs tilmelding nederst på siden under fold indholdet. SIDE 14

15 4.2. RESPONSIVT Sidste år blev mere end halvdelen af alle Google-søgninger udført på mobile enheder. Det betyder, at spillet er ændret, og hvis du vil have at din hjemmeside får mange besøgende, skal du gøre den responsiv. Faktisk er mobilvenlige hjemmesider bedre rangeret på Google, fordi det, for dem, handler om brugeroplevelsen. Derfor implementerer de en ny algoritme, der vil reducere placeringen af sider, der ikke er optimeret til mobile enheder som smartphones og tablets ONE-PAGE VS MULTIPLE-PAGE WEBSITE Hjemmesider med én side er gode til at fortælle en historie eller sælge et enkelt produkt. Men hjemmesider med flere sider er et bedre valg for e-handel eller andre mere komplekse websteder. One-pagers er enklere og lettere for nogle brugere, men de har ikke kapacitet til at indeholde store mængder information. Hvad angår SEO, er den sikreste løsning en multi-siders hjemmeside, da de er mere fleksible, når det kommer til responsivt design, site navigation og deling. Derfor skal du enten gøre din hjemmeside responsiv eller oprette en separat mobil version af den. SIDE 15

16 TJEKLISTE Min vigtigste information er placeret over folden. Min hjemmeside er responsiv eller har en separat mobilversion. Min hjemmeside har en brugervenlig navigation. SIDE 16

17 5 CALL-TO-ACTION Call to action (eller CTA er) er uden tvivl den vigtigste del af dit websted. Det er, hvad der faktisk genererer kundeemner og giver værdi til din virksomhed. Dine brugere forventer, at du fører dem gennem hele hjemmesiden og fortæller dem, hvad de skal gøre nu. Det er derfor, at call-to-action-knapper skal være intuitive og genkendelige. Men hvordan får man dem til at fungere? 5.1 TEKST Teksten på din CTA skal være klar og kommunikere værdi. Fortæl brugerne hvad de skal gøre - Køb nu, Læs mere eller Kontakt os - uanset dit mål, så før dem dertil PLACERING Som vi tidligere har nævnt, er det bedste sted for din CTA over foldet, hvor alle besøgende på hjemmesiden vil kunne se den. Desuden skal det være logisk forbundet med resten af det skriftlige indhold, på den måde vil det være mere sandsynligt at brugeren vil benytte sig af det. 5.3 STØRRELSE Din CTA skal skille sig ud fra resten af indholdet. Samtidig bør det ikke være for stort, så det risikerer at distrahere brugeren. Når du designer din CTA, skal du sørge for, at det også ser godt ud på mobile enheder. 5.4 FARVER Call-to-actions En CTA bør også skille sig ud visuelt. Kontrastfarver og nok hvidt rum omkring det, kan hjælpe. Nogle undersøgelser hævder, at rød er det bedste farvevalg til call-to-action-knapper. Den farve du vælger skal dog bidrage til ensartethed i din brand stil. SIDE 17

18 TJEKLISTE Teksten på mine CTA er er tydelig. CTA en er placeret over folden. CTA en skiller sig ud fra resten af indholdet. SIDE 18

19 6 SEO I 2017 er SEO en uundværlig del af enhver virksomheds marketingstrategi. Over søgninger foretages på den største søgemaskine hvert sekund, og mange virksomheder siger, at Google er deres vigtigste kilde til webtrafik. Det er vigtigt for dig at investere i SEO, hvis du ikke har gjort det endnu. Her er nogle tips, hvad du kan gøre. 6.1 METADATA Metadata er det skriftlige indhold, der vises på Googles søgeresultat side - meta-titel og meta beskrivelse. Grunden til at du skal optimere din metadata er højere konverteringsrate - det er den korte tekst, der overbeviser brugeren om, at du har det rette svar på deres spørgsmål. Meta-titlen skal være tegn lang, mens meta beskrivelsen vises i et uddrag, der kun viser 160 tegn. For WordPress hjemmesider er der nogle plugins, der hjælper med at forbedre SEO - vi vil anbefale Yoast. SIDE 19

20 6.2. LINK PROFIL En linkprofil er kombinationen af alle links til dit websted. Selv om det er vigtigt, at hver af dine websider har interne links (til dine egne sider) og eksterne links (til andre websteder), er det mere vigtigt, hvem der linker tilbage til dig. Derfor bør du producere kvalitetsindhold, som folk ønsker at dele på deres hjemmesider eller blogs. Du kan komme ud og spørge, om de gerne vil dele, det du har lavet, men organiske links er de bedste, da de er et bevis på kvaliteten af dit indhold. 6.3 SITEMAP Et sitemap er simpelthen en XML-fil, der indeholder webadresserne til alle de enkelte sider på dit websted. Det er hovedsagelig brugt til at hjælpe søgemaskiner med at finde alle links. Nogle gange har du sider, der er skjult fra navigationen, og hvis du ikke har et sitemap, kan Google ikke finde dem. I WordPress kan du oprette et sitemap med Google XML Sitemaps plugin. Home Shop About Contact Cart SIDE 20

21 6.4 URL Alle webadresser består af: Hypertekst-overførselsprotokol - viser, om du bruger HTTP eller HTTPS [link til Sikkerhed ] Domænenavn - dit navn på internettet repræsenterer normalt firmaets navn. Sidens navn - hvilken side den besøgende er på. Underkatalog - hvis brugeren forhånds viser et billede eller en fil på din hjemmeside Domæneudvidelse - f.eks..com,.dk. Landespecifikke udvidelser hjælper websites med at rangere bedre i lokale søgninger. En SEO-venlig URL er kort og forståelig for mennesker, ikke kun crawlere; indeholder 1-2 målrettede søgeord og undermapper, hvor det er nødvendigt - eg.... /blog. 6.5 BILLEDE ALT TEKST OG TITEL TAGS Som vi allerede har sagt, spiller billeder en afgørende rolle i dit websteds læsbarhed og UX. Hvert billede du bruger bør have en mening og en grund til at blive placeret der. Selvom Google er en yderst smart motor, har den stadig ikke nået til det punkt, hvor den kan se, hvad der er på et billede. Derfor er det vigtigt, at du skriver en ordentlig titel og ALT-tags til dit billede - med de målrettede søgeord indeni. SIDE 21

22 TJEKLISTE Meta-titlen på hver side er tegn lang. Meta beskrivelsen af hver side er 160 tegn eller mindre. Jeg har interne links på siderne på min hjemmeside. Jeg har relevante eksterne links. Jeg har links fra andre hjemmesider, der fører til noget af mit indhold. Jeg har et sitemap XML. Mine webadresser er korte og forståelige for folk. Image Alt og Title tags indeholder et søgeord. SIDE 22

23 7 KONKLUSION Nu hvor du har lært, hvordan du forbedrer dit websites præstation, er du klar til at sætte i praksis den viden, du har opnået. Men som Zig Ziglar siger: Gentagelse er moderens viden. Vi vil gerne opsummere de vigtigste punkter i denne bog og gøre det nemmere for dig at følge alle trin for at forbedre ydeevnen på dit websted. Derfor har vi lavet denne printbare tjekliste til evaluering af din hjemmeside. Den kan også bruges, når du har foretaget alle nødvendige ændringer og vil kontrollere, at du ikke er gået glip af et trin. Vi går ud fra, at nogle af oplysningerne kan være lidt overvældende. Derfor er vi her for at hjælpe dig gennem hele processen. Hvis du har spørgsmål, er du altid velkommen til at kontakte os. SIDE 23

24 VURDER DIN HJEMMESIDE Det visuelle Tekst Jeg har relevante billeder på min hjemmeside Billederne supplerer virksomhedens stil. Billederne er af høj kvalitet. Billederne har relevante titel- og alt-tags. Størrelsen på hvert billede reduceres så meget som muligt. Billederne krymper ikke eller pixeleres. Hvis der er en video, er den ikke længere end 2 min. Hvis der er en video, er den uploadet på YouTube. Der er 2 eller 3 hovedfarver på hjemmesiden. Der er specifikke målrettede søgeord. Søgeordets tæthed er 2-3% på hver side. Hvert afsnit indeholder kun én ide. Sætningerne er korte. Der anvendes ingen jargon og komplekse ord. Ingen unødvendige gentagelser. Alle sider har et klart visuelt hierarki. Der er overskrifter for hver ord. Der er kun én H1-tag pr. Side. Bullet og / eller nummererede lister er en del af hvert skriftligt indhold. Tekster er mindst 300 ord lange. Relevante links til kilder er inkluderet. Teknisk Design Hjemmesiden loader på mindre end 3 sekunder. Hjemmesiden er på en HTTPS-forbindelse. Alle plugins er opdaterede. Webhotellet er pålideligt og giver support. De vigtige oplysninger er placeret over folden. Hjemmesiden er responsiv eller har en separat mobilversion. Navigationen på hjemmesiden er tydelig. Call-to-action CTA en er enkel og klar. CTA en er placeret over folden. CTA en skiller sig ud fra resten af indholdet. Search Engine Optimisation Meta-titlen på hver side er tegn lang. Meta beskrivelsen af hver side er 160 tegn eller mindre. Interne links er inkluderet på hver side af hjemmesiden. Relevante eksterne links er indarbejdet. Andre hjemmesider linker til min hjemmeside. Der er et sitemap XML. Webadresser er korte og forståelige for folk. Image Alt og Title-tags indeholder et søgeord. SIDE 24