Sådan sørger du for at din hjemmeside er mobilvenlig (Teknisk SEO #1)

Google er gået over til såkaldt mobile-first indeksering, hvilket vil sige at den først og fremmest kigger på mobilversionen af dine sider for at se, om de skal vurderes som bedre end konkurrenternes, og dermed vises højere oppe i søgeresultaterne.

Derfor SKAL din hjemmeside være mobilvenlig, hvis du vil have den fundet på Google. Ellers kan du lave nok så meget SEO på dit indhold, og vil alligevel blive overhalet af konkurrenterne.

Vær opmærksom på, at “mobilvenlig” i Googles øjne ikke er det samme som at den “ser godt ud” på telefonen. Det handler mere om brugervenlighed; at hjemmesiden er nem og hurtig at bruge, selvom den ses på en lille skærm.

“Mobilvenlig” er heller ikke helt det samme som at hjemmesiden er responsiv, dvs. at layoutet tilpasser sig forskellige størrelser skærme. Men den skal være responsiv for at kunne være mobilvenlig – så hvis du har en hjemmeside med et gammelt ikke-responsivt layout, er det på tide at skifte til et mere moderne.

Sådan tester du om din hjemmeside er mobilvenlig

Selvom du har en responsiv hjemmeside, kan du godt komme ud for at der er noget, Google ser som ikke-mobilvenligt, fx et billede der er blevet indstillet til at blive vist i en bestemt bredde.

Derfor bør du teste, om Google ser din hjemmeside som mobilvenlig. Det kan du gøre inde i Google Search Console, eller online på Bing: www.bing.com/webmaster/tools/mobile-friendliness

OBS: Du kan kun teste sider, der faktisk ligger ude på nettet og ikke er blokeret for Google.

Værktøjet tester en enkelt side ad gangen, ikke hele din hjemmeside. Du bør derfor teste både forsiden og et par andre sider, hvis der er forskel på layoutet.

Hvis du vil teste hele din hjemmeside, kan du gøre det inde fra Google Search Console (tidligere webmasterværktøjer).

Sådan gør du din hjemmeside mobilvenlig

Testen med Googles værktøj fortæller dig, OM din side er mobilvenlig eller ej, og hvis den ikke er, HVAD der er galt. Typiske meddelelser er:

“Teksten er for lille til at kunne læses”

Sker ofte hvis din hjemmeside ikke er responsiv, og derfor ikke automatisk sætter tekstens størrelse op på små skærme. Løsningen er et mere moderne, responsivt layout.

“De klikbare elementer ligger for tæt”

Kan hænge sammen med at teksten er for lille, så linksene er for små, og der ikke er plads nok mellem dem til at man nemt kan ramme det rigtige link i fx en menu.

Indholdet er bredere end skærmen

Betyder at du har et billede eller andet indhold, der ikke kan være i sidens bredde på telefonen og derfor gør at der kommer en vandret scrollbar. Det er ikke brugervenligt.

Hvis det er meget af dit indhold der ikke kan være på skærmen, og fejlen kommer på flere sider, er løsningen et andet og mere responsivt layout.

Hvis det kun er et enkelt billede der udløser fejlen, bør du (eller din udvikler) kunne redigere dette stykke indhold så det tilpasser sig bredden på en telefon.

Vær OBS på at gammeldags tabeller kan udløse denne; de virker som udgangspunkt ikke ret godt i et responsivt layout. Hvis du kan præsentere indholdet på en anden måde end i tabeller, så gør det!

“Der er ikke angivet en viewport”

Betyder at hjemmesiden mangler META-tagget viewport, der fortæller browseren hvilken størrelse og layout siden skal vises i; i praksis betyder det at din hjemmeside ikke er responsiv. Løsningen er at få et responsivt layout på hjemmesiden (et mere moderne tema, hvis du kører WordPress på et gammelt tema).

Kan jeg nemt gøre min gamle hjemmeside mobilvenlig?

Det kommer an på meget – men hvis din nuværende hjemmeside ikke er responsiv, vil det som regel være nemmest at lægge et helt nyt layout på den.

Hvis du har en ældre WordPress-hjemmeside, kan det dog godt være nogenlunde nemt – du kan nemlig “bare” skifte dit gamle tema ud med et nyere, responsivt. Tekster, billeder og SEO-ting vil som regel stadig ligge hvor de gjorde før, selvom de måske skal justeres lidt.

Med mindre din hjemmeside er helt, helt simpel og der ikke er ændret noget i dit tema for at tilpasse design og layout specielt til dig, vil jeg dog råde dig til lige at vende det med din udvikler, før du kaster dig ud i at skifte tema.

Sådan gør du teksten på din hjemmeside mobilvenlig

Selv om du har fået et mobilvenligt layout på hjemmesiden, skal dine tekster sikkert justeres, hvis de er skrevet til en større skærm. Ved samme lejlighed kan du også gøre teksterne mere SEO-venlige.

Det handler ikke om at teksterne skal være kortere – folk kan sagtens finde sig i at scrolle nedad, hvis bare teksten er interessant nok. Og Google foretrækker lange tekster (så længe indholdet er relevant i forhold til sidens emne).

Det handler om at teksterne skal være lette at læse – både af hensyn til dine besøgende, og hvis de skal fungere som SEO-tekster. Principperne for hvordan du gør det er de samme, som gælder for tekster på hjemmesider generelt. Du skal bare overholde dem i endnu højere grad, når du skal skrive mobilvenlig tekst.

1. Inddel teksten i mange, korte afsnit

Hvis du skriver på en større skærm, så regn med du skal have en linjes luft ind for hver 2-3 linjer, du skriver. Dette afsnit du sidder og læser lige nu fylder et halvt skærmbillede på min smartphone, når man tæller overskriften med.

2. Strukturer teksten med underoverskrifter

Du skal ikke sætte en underoverskrift for hvert eneste lille afsnit, men der skal være nok af dem til at det bliver overskueligt for læseren (og Google), hvordan teksten hænger sammen emnemæssigt.

Det er vigtigt at du formatterer dine underoverskrifter med h2, h3 osv. af hensyn til SEO (læs mere i dette indlæg om hvorfor h-overskrifter er vigtige ->)

3. Brug punktopstillinger

Når du stiller noget af teksten op som punktopstilling, giver det en kærkommen variation for øjet i en måske lang tekst. Du skal selvfølgelig kun bruge det på steder, hvor du har en form for opremsning.

4. Sæt noget af teksten i faktabokse

En anden måde at varierer udseendet på er at sætte udvalgte (vigtige) sætninger eller afsnit ind i en boks med enten en anden baggrundsfarve eller kant omkring, eller begge dele.

5. Sæt links inde i teksten

Hvis det er relevant – og du ikke har noget imod at folk forlader den side, de er på – så sæt hellere “læs mere”-links inde i teksten end i slutningen.

6. Indsæt en indholdsfortegnelse (table of content)

Hvis du har mulighed for det, så sæt en “table of content” ind øverst i en lang tekst, ligesom jeg har gjort herover (og på mange andre af mine blogindlæg):

Det gør det nemt for læseren at overskue, hvilke informationer man finder i teksten, og at hoppe direkte til et bestemt afsnit – og Google elsker dem, så det bidrager også til sidens SEO.

Det kræver dog at du har brugt underoverskrifter og har formatteret dem korrekt med H2, H3 osv.

7. Sæt billeder eller grafik inde i teksten

Du kan også bryde din tekst op med fotos, ikoner eller anden grafik, for at give lidt variation til udseendet. Bare sørg for at de er relevante for resten af indholdet, og at de ikke fylder alt for meget på skærmen.

Husk at tjekke din hjemmesides mobilvenlighed – på mobilen!

Selvom du følger alle råd, så skal du også lige huske at gå ind på din hjemmeside via mobilen og se, om den ser OK ud. Helst hver gang, du lægger en ny tekst ud.

Selvom du (i alt fald i WordPress) kan vælge at få forhåndsvist en kladde i mobilvisning, er det sikreste altid at du lige tjekker dit layout og dine tekster og billeder med dine egne øjne.

---

Del gerne indlægget med andre, du tror kan have glæde af det:

Du kan finde Nielsens Bureau her:

• Facebook
• LinkedIn
• mailto:anette@nielsensbureau.dk