90% af besøgende på websiden hopper på grund af dårligt design. Hovedårsagerne til dette er relateret til brugervenlighed og omfatter forskellige faktorer, herunder mobil respons.
Betydningen af glat brugeroplevelse på tværs af enheder og design med forskellige enheder i tankerne kan ikke understreges nok.
Dette er grunden til, at vi i denne artikel tager dig gennem de mest almindelige skærmopløsninger, som responsive websteder skal være designet til.
Læs videre for at finde ud af, om du skal vælge en mobil-først eller responsiv design.
Hvorfor webstedsdimensioner betyder noget i webdesign og udvikling
Ifølge StatCounter blev trafikandelen i maj 2020 genereret gennem:
- Mobil (50,34%)
- Desktop (46,67%)
- Tablet (2,99%)
Miljøet med internetinteraktion er forskelligt. Og for at sikre enestående brugeroplevelse på tværs af alle enheder er virksomheder nødt til at investere i mobilt responsivt design.
Wireframing er det stadium, hvor webdesignere skaber både desktop- og mobiloplevelser og distribuerer elementerne til begge visninger.
De fleste designere bruger et standard desktop og en standard mobil opløsning til at skalere designs og sikre glat UX på tværs af enheder.
De mærker, der ønsker et ægte banebrydende websted og brugeroplevelse, vil tage lige flere aspekter i tankerne i wireframing-fasen, herunder:
- Desktop, tablet, mobilvisninger
- Visninger af portræt og landskab
- Browsere
Klik her!
Sådan beslutter du, hvilke webstedsdimensioner der skal bruges, dvs. hvilken skærmopløsning der skal optimeres dit websted til
Det første trin til at bestemme de bedste webdimensioner at fokusere på er at finde ud af, hvilken mobil skærmstørrelser, dit målmarked ejer.
Start med at se på din målgruppes demografi.
Demografi kan diktere, hvilke enheder dine potentielle kunder bruger til at få adgang til dit websted.
Her er hvad man skal se på:
- Alder: Undersøg det mest populære enhedsmærke / model blandt den aldersgruppe, du målretter mod. YouGov er en fantastisk, opdateret ressource, der sporer disse tendenser og filtre
- Køn: Ressourcer som YouGov kan også give dig mulighed for at filtrere de mest populære enheder blandt køn, så du kan krydsmatch enhederne efter aldersgruppe og målkøn.
- Placering: At gå ind i en mere detaljeret og dybtgående indsigt ved at tilføje lokale tendenser hjælper dig med at skærpe dit fokus.
- Indkomst: Hvis du målretter mod højindkomstmålgrupper, bliver dit websted nødt til at være punktligt og fungere problemfrit på de nyeste, mest banebrydende enheder.
Find dem her!
Responsivt vs. mobil-første webdesign: Hvilken der skal vælges
Mobilenheder (undtagen tablets) tegner sig for halvdelen af den verdensomspændende webtrafik. Faktisk genererede smartphones i maj 2020 50,44% af websidevisningerne på globalt plan.
Disse tal får virksomheder til at investere i websteder, der fungerer godt på smartphones.
Imidlertid er en af de største bekymringer er, om de skal investere i responsivt eller mobil-første webdesign.
Designere skaber et responsivt webdesign, der passer til skrivebordet, med den maksimalt krævede opløsning, og derefter justerer de det til mindre skærme .
Processen med at udvikle mobile-first-design på den anden side ligner meget på at designe en mobilapp, hvor webdesignere senere tilpasser den til desktop- eller tabletbrug.
I i dette tilfælde passer det overordnede design perfekt til mobile enheder, og det skaleres op (snarere end ned) for at udfylde skrivebordsvisningen.
Med den voksende mobilanvendelse kan vi se, at B2B-købere ikke rigtig er forskellige fra B2C.
Derfor planlægger 65,8% af B2B-virksomheder at forbedre deres mobiloplevelser på deres websteder.
Hvad er den bedste dim ensions at bruge i 2021?
Dette er et kompliceret spørgsmål, der har et simpelt svar.
Der er ingen størrelse, der passer til alle.
Hvad fungerer bedst for andre websteder fungerer muligvis ikke for dig.
Og i stedet for at fokusere på de bedste websidedimensioner og oprette websider til forskellige enheder, skal du først designe til dit publikum.
I dag det handler om brugeroplevelse, og du skal sørge for, at du får et responsivt design, der holder dine potentielle kunder tilfredse.
Sådan kontrollerer du, om dit websted er mobilvenligt?
Google tilbyder en gratis mobilvenlig test, hvor du kan finde ud af, om dine websider er nemme at bruge på mobile enheder.
Du skal blot tilføje dit websteds URL eller kode, så finder du ud af, hvordan din side scorer.
I løbet af få sekunder får du dine resultater og lærer, om dine designere leverede det design, de lovede.
5 mest almindelige desktop-skærmopløsninger over hele verden
Ifølge StatCounter er de mest anvendte skærmopløsninger på skrivebordet fra marts 2019 – marts 2020:
- 1366×768 (22,98%)
- 1920×1080 (20,7%)
- 1536×864 (7,92%)
- 1440×900 (7,23%)
- 1280×720 (4,46%)
5 mest almindelige mobile skærmopløsninger over hele verden
Når det kommer til de mest almindelige skærmopløsninger på smartphones, mellem marts 2019 og marts 2020, foretrak designere over hele kloden at bruge følgende størrelser:
- 360×640 (18,7%)
- 375×667 (7,34%)
- 414×896 (6,76%)
- 360×780 ( 5,31%)
- 375×812 (5,01%)
5 mest almindelige tabletskærmopløsninger over hele verden
Mellem marts 2019 og marts 2020, den mest almindelige tabletskærmopløsninger over hele verden var:
- 768×1024 (51,43%)
- 1280×800 (7,28%)
- 800×1280 (5,26%)
- 601×962 (4,32%)
- 962×601 (2,99%)
De 15 mest almindelige skærmopløsninger i USA
Her er de mest almindelige skærmstørrelser, som du skal vælge i 2021:
Mest almindelige skrivebord Skærmopløsninger i USA
Baseret på dataene fra StatCounter mellem marts 2019 og marts 2020 var de mest almindelige skærmopløsninger til desktop i USA:
- 1920×1080 ( 19,57%)
- 1366×768 (14,88%)
- 1440×900 (9,18%)
- 1536×864 (7,22%)
- 1024×768 (4,73% )
Mest kommo n Opløsninger til mobilskærm i USA
I samme periode var de mest almindelige skærmopløsninger for mobiltelefoner i USA:
- 414×896 (19,44%)
- 375×667 (13,67%)
- 375×812 (12,3%)
- 414×736 (8,91%)
- 360×640 (8,21%)
De mest almindelige tabletskærmopløsninger i USA
Designere i USA foretrak forskellige skærmopløsninger på tablets og oprettede websidesstørrelser til følgende dimensioner:
- 768×1024 (55,64%)
- 1280×800 (5,74%)
- 800×1280 (5,31%)
- 601×962 (5,14%)
- 962×601 (3,2%)
Find dem her!
Takeaways on Website Dimensions
Webstedsdimensioner og websidesstørrelser betyder noget, fordi en enkelt dårlig oplevelse på stedet kan frastøde dine brugere en gang for alle.
I betragtning af det faktum, at brugere også får adgang til internettet fra mobile enheder, herunder smartphones og tablets, der er to typer webdesign, du kan vælge mellem for at optimere dit websted til forskellige enheder:
- Mobilresponsiv
- Først til mobil
Uanset hvilke dimensioner du vælger, skal du sørge for at designe til dit publikum og overveje deres:
- Alder
- Køn
- Placering
- Indkomst
Dette hjælper dig med at forbedre brugeroplevelsen, øge opholdstiden og øge placeringen af søgemaskiner.