Hvis du ønsker at gøre et WordPress-websted mobilvenligt, er denne detaljerede guide udelukkende til dig.

Vidste du, at 9 ud af 10 mobilsøgninger fører til handling, og mere end halvdelen af ​​dem fører til salg?

Brugen af ​​mobilt internet stiger som aldrig før. Det overhaler brugen af ​​desktops internet, flere og flere mennesker bruger nu smartphones og tablets til at gennemse information online.

Dette er hovedårsagen til, at de fleste e-handelssider nu opretter mobilapps for at øge deres salg og brugerinteraktion. Hvis din hjemmeside eller blog endnu ikke er mobilvenlig, bør du straks overveje at gøre dit design responsivt, ellers vil du miste en masse leads, trafik og salg på bordet.

Hvorfor give dine konkurrenter en fordel ved ikke at have et mobilvenligt design? Gør din hjemmeside mobilvenlig, og du vil hurtigt bemærke de givende resultater.

Hvorfor gøre en WordPress-side mobilvenlig ?

Hvis din hjemmeside er mobilvenlig, sker der her:

  • du vil se en stigning i trafikken
  • du kan øge antallet af abonnenter ved at have responsive e-mail-opt-in formularer og landingssider
  • du vil få mere salg (mobilinternetbrugere er for det meste afhængige af søgemaskiner til at gennemse information, så de er kunder af høj kvalitet, der er klar til at købe)

Så hvad venter du på? Gør din blog brugervenlig og begynd at tiltrække flere mennesker. Lad os dykke ned i detaljerne for at finde ud af mere.

Table des matières:

Den ultimative guide til at gøre et WordPress-websted mobilvenligt

Sådan gør du din WordPress-side mobilvenlig

Hvad er en mobilvenlig hjemmeside?

Med milliarder af mennesker, der bruger mobiler over hele verden til at gennemse information, er det ved at blive en trend at bruge mobilsider.

Selv Google belønner websteder, der er optimeret til mobilbrugere, fordi de giver brugerne en hurtigere og bedre oplevelse.

Et mobilvenligt websted vil automatisk registrere det miljø, hver besøgende bruger til at få adgang til dit websted og derefter vise det i det format, der passer bedst til den pågældende enhed (såsom smartphones, tablets og så videre).

Sådan ser et responsivt vs. ikke-responsivt mobilwebsted ud:

Sådan gør du et WordPress-websted mobilvenligt

Som du kan se ovenfor, indlæser et mobilt responsivt websted alle dets elementer som logo, tekst, knapper, navigation, menu osv. korrekt på mobilen, mens ikke-responsivt design ser rodet ud på mobilen.

Ifølge Statista fortsætter procentdelen af ​​webtrafik fra mobil med at vokse. Antallet af globale mobile internetbrugere er steget med mere end 10 % over de seneste 4 år.

Ikke kun det, mobilinternetbrugerpenetrationsindekset er nu 61,2%, hvilket repræsenterer lidt over 2 milliarder mennesker, der får adgang til internettet på mobile enheder. Det er en interessant statistik, ikke?

Derfor bør du fokusere på at gøre dit websted brugbart, hvis det endnu ikke er responsivt.

Når det så er sagt, er der forskel på en responsiv hjemmeside og en mobilvenlig side. Hvad er dette?

En responsiv hjemmeside fungerer til alle desktops, tablets og smartphones også med det samme indhold, da den automatisk justerer layoutet, hvorimod et mobilvenligt site faktisk er en separat version af desktop-hjemmesiden som er designet specifikt til smartphones.

Kort sagt, at have et mobilt responsivt design kan forbedre dine placeringer, brugeroplevelse, salg og overordnede konverteringer online.

Hvordan ved du, om din hjemmeside er mobilvenlig?

Vil du vide, om dit websted er mobilvenligt eller ej?

For at kontrollere mobilresponsen på dit websted kan du bruge et gratis værktøj fra Google, som er kendt som Mobilvenligt testværktøj som viser dig, hvor nemt en besøgende kan bruge din side på en mobilenhed.

Det fungerer fantastisk, og det er helt gratis at bruge, og du skal bare indtaste en side-URL eller dit websteds hjemmeside-URL for at se, hvordan det scorer på deres værktøj.

Sådan ser det ud:

Sådan gør du et WordPress-websted mobilvenligt

Som du kan se ovenfor, har vi indtastet en URL, som viser os, at siden er mobilvenlig (det betyder, at siden er nem at bruge på en mobilenhed).

Det viser dig også yderligere ressourcer, hvor du kan få rapporter om mobilanvendelighed på hele webstedet, så du kan analysere dit websted fuldt ud for responsivitet.

Generelt udføres mobil responsiv test for at sikre, at alle dine webstedsbrugere får den bedste visningsoplevelse på deres enheder, kan være bærbare, stationære, tablets og så videre.

Udover det Google-venlige testværktøj, kan du også bruge følgende onlineværktøjer, som er helt gratis til at teste dit websteds reaktionsevne.

Alle ovenstående værktøjer er nyttige til at vide, om dit websted er mobilvenligt eller ej, og du kan tjekke responsiviteten på ethvert websted med blot et enkelt klik fra din egen browser ved at indtaste URL'en på en hvilken som helst side.

Lad os nu tale om nogle BEVISTE måder at bygge en mobil responsiv version af dine WordPress-websteder på.

Brug et mobilt responsivt WordPress-tema: de 3 hovedtemaer

En af de nemmeste måder at skabe et mobilvenligt websted på er at bruge et mobilvenligt tema til dine WordPress-websteder. Selvom der er et væld af muligheder, er her listen over top 3 temaer, du kan bruge til at få et responsivt design med fantastiske funktioner til en overkommelig pris.

1. Divi

Divi er en af WordPress-temaer mest populære premium brugt af mere end 800 mennesker verden over. Det giver dig et væld af mobilvenlige temaer med Divi, som er et premium-tema og en visuel sidebygger.

Divi er udelukkende designet til at give brugerne en bedre desktop-oplevelse inklusive mobilsvaroplevelse.

Det giver dig mulighed for at tilpasse dit websted, som du ønsker, da du kan justere skriftstørrelser på afstanden specifikt til forskellige mobiler. Du kan også tildele unikke tekststørrelser og afstandsværdier til mobil og tablets uden at forringe skrivebordsoplevelsen.

Sådan ser det ud:

Sådan gør du et WordPress-websted mobilvenligt

Som du kan se ovenfor, giver det dig mulighed for at tilpasse dit design i 3 sektioner i Mobile Styles-panelet, som er Tablet, Telefon og Mobilmenu. Du kan få adgang til hver af dem og tilpasse alt, inklusive tekstfarve, logoer og mere. let.

Hvad er prisen på Divi?

Det fantastiske ved at bruge Elegant Themes er overkommelige priser, hvor du kan få fat i alle deres premium-temaer ved blot at betale $80, hvilket betyder, at du kun betaler $0,79 pr. tema.

Elegante temaer kommer i 2 prisplaner nævnt nedenfor.

1. Årlig adgang: Dette er den billigste mulighed, der koster $80 for 1 år (med vores eksklusive rabat), og du vil få adgang til over 80 temaer med 5 plugins og Divi-temabygger.

2. Livstidsadgang: Hvis du vil have livstidsadgang til stilfulde temaer, så er denne pakke for dig, som koster $224 for hele livet, hvor du får livstidsopdateringer, temaer og plugins-downloads med livstidssupport.

Gode ​​nyheder til dig. Hvis du ønsker at få fat i Divi-byggeren med stilfulde temaer, kan du bruge vores eksklusive link til at få en øjeblikkelig 10% rabat på deres priser.

Klik her for at downloade Divi

Hvis du ikke er tilfreds med temaet eller funktionerne, kan du også anmode om en fuld tilbagebetaling af dine penge inden for 30 dage efter købet. Så du vil ikke miste noget.

2. Genesis Framework

Leder du efter en premium temaramme, der ikke kun er mobilresponsiv, men både hurtigere og SEO-venlig? Så bør du prøve Genesis-rammen, da den giver dig livslang adgang og ubegrænset brug af webstedet.

Hvad koster Genesis Framework ?

Genesis tilbyder to prisplaner anført nedenfor.

1. Genesis Framework: Dette er blot den nøgne ramme, som er alt hvad du behøver, hvilket koster dig $59,95, hvilket er et engangsgebyr, og du vil få ubegrænset brug af webstedet samt livstidsadgang inklusive livstidsopdateringer.

2. Pro Plus-medlemskab: Denne pakke giver dig mulighed for at downloade hele deres temasamling, som koster dig $499,95, og det er et engangsgebyr med ubegrænset brug af webstedet og livstidsadgang og en fantastisk pakke til webdesignere og udviklere.

Klik her for at downloade Genesis til WordPress

3. GenererPress

Hvis du leder efter WordPress-temaer premium overkommelig og hurtigere, GeneratePress er kun til dig.

Hvor meget koster det?

GeneratePress koster dig kun $49,95 for 1 år. Du får også 40% rabat næste år, hvis du er eksisterende kunde.

Hurtig bemærkning: Det tilbyder dig også en gratis version, som du kan downloade fra deres hjemmeside, men den giver dig grundlæggende og begrænsede funktioner.

Klik her for at downloade GeneratePress premium

Brug WordPress plugins til mobiler: de 4 bedste plugins til at gøre dit websted responsivt

En god ting ved at bruge WordPress CMS er, at det giver dig et væld af mobile plugins, der hjælper dig med nemt at gøre dit websted til et mobilvenligt. Her er en liste over de 4 bedste plugins, der gør dit websted mobilt responsivt (og få af dem er premium, men hver en øre værd).

WPtouch

WPtouch er et af de mest brugte mobilplugins til WordPress-websteder. Det er installeret og brugt af over 500 websteder verden over, og det er også på Googles shortliste over de bedste WordPress-mobilløsninger.

Dette plugin vil øjeblikkeligt aktivere en mobilversion af dit websted, som vil bestå Google Mobile-testen. Det hjælper dig også med nemt at tilpasse udseendet af dit websted og give en hurtigere browsingoplevelse for dine mobilbesøgende uden at ændre din temakode.

Det tilbyder også en premium-version af plugin'et, som kaldes WPtouch Pro (og koster dig $79 for 1 webstedsbrug), og det bruger sine temaer til mobile besøgende, og dit skrivebordstema vil ikke ændre sig, så dit blogindhold forbliver det samme.

Desuden kan du med deres Pro-indstilling også styre dine menuer, sider, enheder og endda angive forskellige start- og landingssider for din blog.

WP Mobile Menu

WP Mobile Menu er en af ​​de bedste WordPress-plugins som giver dig en responsiv mobilmenu, hvor du nemt kan tilpasse stilen på dine mobilmenuer, som du ønsker det.

Det giver dig en enestående oplevelse for dine mobile besøgende at få adgang til indholdet på dit websted, uanset hvilken enhed de bruger, mens de surfer, inklusive smartphone, tablet eller desktop.

iThemes Mobile Plugin

Dette er IKKE et gratis plugin, da det er et premium mobilplugin fra iThemes, som er meget populært og bruges af mange mennesker rundt om i verden.

Det giver dig et væld af muligheder sammen med en indbygget stylingmanager for at gøre dit websted responsivt på alle enheder. Det tilbyder dig også mobilklare temaer for at optimere dit websted til mobilbrugere.

Der er forskellige prismuligheder på tilbud, og den grundlæggende plan starter ved kun $45 og giver dig adgang til 2 licenser, hvilket er en ideel mulighed for bloggere og ejere af enkelte websteder.

Med Mobile Style Manager kan du nemt ændre de grundlæggende stilarter og farveskemaer for dit mobiltema, og det kan tilpasses ved hjælp af ethvert tema, du bruger, og det vil ikke påvirke dit design.

TapTap

Dette er et andet udbredt premium mobilplugin fra CodeCanyon (Envato Market), der giver dig den mest fleksible og alsidige WordPress mobilmenu.

TapTap kan tilpasses og en af ​​de fantastiske og brugervenlige WordPress-mobilmenuer, der er tilgængelige på nettet lige nu. Uanset om det er en e-handelsbutik eller et porteføljewebsted, kan du tilpasse alt fra skrifttyper, skriftstørrelser, ikoner, farver, knapper og logoer til baggrunde, justeringer og mere.

Dette er et premium-plugin fra CodeCanyon, og standard-enkeltlicensen til dette plugin koster dig $26, hvor du kan få et års opdateringer og kundesupport.

Det bedste ved at bruge dette mobilmenuplugin er, at du nemt kan forhåndsvise alle de ændringer, du foretager på dit websted i realtid (og det hjælper dig med at tilpasse din mobilmenu hurtigt).

Brug Accelerated Mobile Pages (AMP)

Webstedets hastighed er en af ​​de vigtigste rangeringsfaktorer for Google.

For at reducere indlæsningstiden tilbyder Google en ny tilgang kendt som Accelerated Mobile Pages (AMP) til mobilbrugere.

Her er et eksempel på et AMP-søgeresultat fra New York Times:

Sådan gør du et WordPress-websted mobilvenligt

Som du kan se ovenfor, indlæses AMP-sider hurtigt og giver en meget hurtig oplevelse for brugere, der gennemser onlineoplysninger fra deres mobile enheder.

Den største fordel ved AMP-sider er, at de indlæses meget hurtigt. For eksempel, når nogen søger efter noget på Google, vises AMP-linkene øverst, og når der klikkes på resultatet, indlæses det næsten øjeblikkeligt.

En anden grund til at overveje at implementere AMP til dine hjemmesider er, at det giver dig yderligere tegnbegrænsninger for titler.

Uanset om du ved det eller ej, har Google en titelgrænse på 78 tegn for smartphones. For stationære computere er det 70.

Det betyder, at hvis du bruger mere end 70 tegn (til computer) og 78 tegn (til mobil) i titler, afkortes de ekstra tegn, så de ikke vises.

Så du kan tilføje flere tegn til dine mobiltitler for at få mere præcise søgeresultater fra mobilbrugere for at øge din samlede søgetrafik fra smartphones.

Nu opstår spørgsmålet: hvordan implementerer man AMP til WordPress-websteder?

Heldigvis er der et par stykker WordPress plugins der hjælper dig med nemt at aktivere og implementere AMP-versionen til dine WordPress-websteder.

Her er en liste over nogle fantastiske AMP-plugins, som du kan bruge til at implementere AMP-version til dine mobilbrugere.

Fejl, der skal undgås, mens du gør dine WordPress-websteder mobilvenlige

Brug af billeder uden optimering: de fleste mennesker gennemgår Google-billeder og bruger billeder direkte på deres blogindlæg uden overhovedet at bekymre sig om optimering. Stop med at gøre det, hvis du også er en af ​​dem, da dit websteds indlæsningstid er stærkt påvirket af de billeder, du bruger.

Brug plugins som WP Smush.it til at optimere dine billeder eller endnu bedre optimere dem ved hjælp af gratis billedoptimeringsværktøjer, selv før du bruger billeder på dine indlæg.

Går for langt med java script: Vidste du, at de fleste begyndere leger med CSS-filer og Java-script uden rigtig at vide, hvordan man spiller med koden? Hvis du er en af ​​dem, så lad være med at rode rundt med Java- eller CSS-kode ubevidst, ellers vil du højst sandsynligt ende med at ødelægge din hjemmesides indlæsningstid.

Tester ikke dine websteder: teste, om dine websteder åbner korrekt på forskellige mobilenheder og tablets. Du kan bruge MobileTest.me, QuirkTools osv. at vise din hjemmeside på forskellige skærmopløsninger.

Andre ressourcer:

Konklusion

Der er bogstaveligt talt milliarder af mennesker, der bruger smartphones til alt fra bilanmeldelser til rabatter til online shopping. Det er lige meget, om du bruger et WordPress-websted eller en e-handelsbutik, at have et responsivt design forbedrer dit samlede resultat.

Så hvad synes du om mobiloptimerede WordPress-sider? Har du nogen spørgsmål ? Del din mening i kommentarerne.