közzététel: “Ez a cikk a kutatás személyes véleménye a Közel 20 éves tapasztalataim alapján. Ezen az oldalon nincs harmadik fél hirdetése,vagy bármilyen pénzbeli link. A harmadik fél webhelyeire mutató külső linkeket én moderálom. Jogi nyilatkozat. “Shaun Anderson, Hobo
nincs egy legjobb képernyőméret a tervezéshez. A weboldalaknak a különböző böngészőkben és platformokon minden képernyőfelbontásnál felelősen és gyorsan kell átalakulniuk., Elérhető. Mobilbarát. Először tervezze meg közönségét. Tervezés 360×640-től 1920×1080-ig.
- 1024×768 és 1920×1080
- 360×640 és 414×896
- 601×962 és 1280×800 közötti mobil kijelzők tervezése
- ne tervezzen egy monitor méretét vagy képernyőjét felbontás. A képernyő mérete és a böngészőablak állapota a látogatók között változik.
- a tervezésnek reagálónak és gyorsnak kell lennie., Használjon folyékony vagy érzékeny elrendezést, amely átalakul az aktuális felhasználó ablakméretére.
- Monitor Google Search Console mobil-barát és használhatóság figyelmeztetések
ellenőrizze a Google Analytics szolgáltatást és optimalizálja a célközönség leggyakoribb felbontási méreteit
meg kell még jól néz ki, és jól működik minden méretben, ezért én *használt* ajánlani egy nagyon hozzáférhető folyékony elrendezés százalékos szélességű, hogy ellenőrizzék elrendezés. Most az ajánlás egy érzékeny weboldal sablon.,
az Oldalelrendezés optimalizálásának három fő kritériuma egy bizonyos képernyőmérethez a következő:
- weboldal kezdeti láthatósága: látható-e az összes kulcsfontosságú információ a hajtás felett, hogy a felhasználók görgetés nélkül láthassák? Ez egy kompromisszum, hogy hány elem jelenik meg vs. mennyi részlet jelenik meg az egyes elemeknél.
- weblap olvashatóság: mennyire könnyű elolvasni a szöveget különböző oszlopokban, figyelembe véve a kiosztott szélességet?
- weboldal esztétika: mennyire jól néz ki az oldal, ha az elemek megfelelő méretben és helyen vannak ehhez a képernyőmérethez?, Tegye az összes elemet helyesen-vagyis a képek melletti feliratok stb.?
a használhatósági irányelvek azt is javasolják, hogy mindhárom kritériumot a méretek teljes skáláján vegye figyelembe. Ellenőrizze a böngészőablakot 360×640-től 1920×1080 képernyőfelbontásig.
az oldalnak minden kritériumnál magas pontszámot kell elérnie a teljes felbontási tartományban.
az oldalnak még kisebb-nagyobb méretben is működnie kell, bár az ilyen szélsőségek kevésbé fontosak.,
bár az ilyen felhasználóknak minden bizonnyal hozzáférniük kell a webhelyéhez, a kevésbé nagyszerű kialakítás néha elfogadható kompromisszum.,
Top Tíz Leggyakoribb Képernyő felbontás
Látogató elemzése majdnem fél millió látogató az első 6 hónapban a 2020:
A Responsive Weboldal Sablon Egy Jó Fogadás
IDÉZET: “Responsive Web Design: ugyanazt a HTML-kódot az azonos URL-t, függetlenül attól, hogy a felhasználók eszköz (például asztal, tábla, mobil, nem vizuális böngésző), de teheti a kijelző másképp alapján a képernyő mérete. A Google azért ajánlja a reszponzív Webdizájnt, mert ez a legkönnyebben kivitelezhető és karbantartható tervezési minta.,”Google Developer Guides, 2020
a mai világban sokan használnak kézi eszközöket (táblagépeket és okostelefonokat) a webes böngészéshez, és a responsive website design (RWD) nagyon valószínű megoldásnak bizonyult (ezt még mindig vitatják a rajongók) a képernyőméret kihívásai.
Ez a módszer eltávolodik a rögzített szélességű webhelyek használatától, ehelyett a CSS stíluslapokban lévő média lekérdezéseket használ egy olyan webhely létrehozásához, amely méretben reagál a kézi eszközök és az emberek által használt kisebb képernyők különböző nézetportjaira.,
tehát bármilyen eszközt használ egy személy a webhely megtekintéséhez, akkor a lehető legteljesebb élményt nyújthatja nekik.
Tartalomjegyzék
a Google előnyben részesíti a Mobil-Barát Webhelyek
a Google diktálja az apály áramlását, az online kereskedelem, ők már csak diktált van szüksége, hogy tervezzen számára egy lehetőség a felhasználói élmény több eszköz, HA azt szeretné, hogy elvárják, hogy magas rangot versenyképes, kulcsszavakra a Google.
idézet: “a Google két különböző robotot használ a weboldalak feltérképezéséhez: egy mobil robotot és egy asztali robotot., Minden lánctalpas típus szimulálja az oldalt látogató felhasználót egy ilyen típusú eszközzel. A Google egy lánctalpas típust (mobil vagy asztali) használ a webhely elsődleges bejárójaként. A webhely minden olyan oldalát, amelyet a Google feltérképez, az elsődleges bejáró segítségével feltérképezik. Az összes új webhely elsődleges bejárója a mobil lánctalpas. Ezenkívül a Google átrajzol néhány oldalt a webhelyén a másik bejáró típussal (mobil vagy asztali). Ez az úgynevezett másodlagos feltérképezés, és úgy történik, hogy milyen jól működik a webhely a másik eszköz típusát.,”Google Webmaster Guidelines, 2020
2015.április 21. óta világszerte, hogy a mobilbarát webhely hogyan befolyásolta a webhelyek rangsorolási teljesítményét számos eszközön.
ha weboldalakat készít kisvállalkozások számára-tudni fogja, hogy olyan webhelyet akarnak, amely jól teljesít a Google organic listings-ben – tudja, hogy érdekli őket a keresőmotor optimalizálása:
idézet: “20 éves tapasztalatom van a professzionális SEO gyakorlásában. Ez a SEO bemutató Az én gyűjteménye tippek, SEO legjobb gyakorlatok szoktam rangsorolni honlapok Google.,”Shaun Anderson, Hobo 2020
a SEO részben a jó UX weboldalon alapul, amint azt a Google számszerűsíti, legalábbis a mobil felhasználók számára.
idézet: “a mobil keresések Már meghaladják az asztali kereséseket, fontos, hogy webhelye mobilbarát legyen. Googlebot most használ egy mobil lánctalpas, mint az alapértelmezett lánctalpas weboldalak.”Google Webmaster Guidelines, 2020
jelenleg-ez lényegében most azt jelenti, érzékeny Weboldal tervezés és mobil-barát, különösen a Google “így az index mobil-első”.,
Asztali Képernyő Felbontás Statisztikák Világszerte Május 2019 – Lehet, hogy 2020
A referencia -, itt van egy lista az aktuális top képernyő felbontás világszerte, melyeket a közelmúltban (2020-ig):
a Legtöbb Közös Asztal Képernyő Felbontás Méretek Világszerte
- 1366×768 – 23.49%
- 1920×1080 – 19.91%
- 1536×864 – 8.65%
- 1440×900 – 7.38%
- 1280×720 – 4.89%
- 1600×900 – 4.01%
- 1280×800 – 3.,33%
Mobil Képernyő Felbontás Statisztikák Világszerte Május 2019 – Lehet, hogy 2020
a Leggyakoribb Mobil Képernyő Felbontás Méretek Világszerte
- 360×640 – 17.91%
- 375×667 – 7.61%
- 414×896 – 6.52%
- 360×780 – 5.56%
- 360×760 – 5.06%
- 414×736 – 3.74%
Tablet Képernyő Felbontás Statisztikák Világszerte Május 2019 – Lehet, hogy 2020
a Legtöbb Közös Tabletta Képernyő Felbontás Méretek Világszerte
- 768×1024 – 51.98%
- 1280×800 – 7.11%
- 800×1280 – 5.,34%
- 601×962 – 4.47%
- 600×1024 – 2.85%
- 1024×1366 – 1.96%
Asztali Képernyő Felbontás Statisztika az usa-ban Május 2019 – Lehet, hogy 2020
a Felső Képernyő felbontás az usa-ban (2020)
a Legtöbb Közös Asztali Képernyő Felbontást az Egyesült Államok
- 1920×1080 – 19.15%
- 1366×768 – 14.91%
- 1440×900 – 9.59%
- 1536×864 – 7.7%
- 1280×720 – 4.89%
- 1600×900 – 4.28%
- 1280×800 – 3.,92%
Mobil Képernyő Felbontás Statisztika az usa-ban Május 2019 – Lehet, hogy 2020
a Leggyakoribb Mobil Képernyő Felbontást az Egyesült Államok
- 414×816 – 17.89%
- 375×667 – 14.2%
- 375×812 – 11.97%
- 360×640 – 8.55%
- 414×736 – 8.54%
- 412×846 – 4.7%
- 360×740 – 4.39%
Tablet Képernyő Felbontás Statisztika az usa-ban Május 2019 – Lehet, hogy 2020
a Legtöbb közös Tabletta Képernyő Felbontást az Egyesült Államok
- 768×1024 – 54.,68%
- 800×1280 – 5,75% – os
- 1280×800 – 5.73%
- 601×962 – 5.41%
- 1024×1366 – 3.06%
- 600×1024 -2.57%
Asztali Képernyő Felbontás Statisztika az egyesült KIRÁLYSÁG Május 2019 – Lehet, hogy 2020
a Felső Képernyő felbontás, az egyesült KIRÁLYSÁGBAN (2020)
a Legtöbb Közös Asztali Képernyő Felbontást az Egyesült Királyság
- 1920×1080 – 20.62%
- 1366×768 – 17.32%
- 1440×900 – 11.65%
- 1536×864 – 8.38%
- 1280×720 – 5.2%
- 1280×800 – 4.,73%
Mobil Képernyő Felbontás Statisztika az egyesült KIRÁLYSÁG Május 2019 – Lehet, hogy 2020
a Leggyakoribb Mobil Képernyő Felbontást az Egyesült Királyság
- 375×667 – 16.66%
- 414×816 – 14.11%
- 360×640 – 9.95%
- 375×812 – 8.55%
- 360×740 – 5.67%
- 360×780 – 5.39%
- 414×736 – 4.75%
Tablet Képernyő Felbontás Statisztika az egyesült KIRÁLYSÁG Május 2019 – Lehet, hogy 2020
a Legtöbb Közös Tabletta Képernyő Felbontás Méretek az Egyesült Királyság
- 768×1024 – 58.,31%
- 1280×800 – 6.92%
- 800×1280 – melléklet a 6.02%
- 601×962 – 3.68%
- 600×1024 – 3.26%
- 1024×1366 – 1.71%
Asztali vs Mobil vs Tablet Piacon Részesedés Világszerte
Asztali vs Mobil vs Tablet Piacon Részesedés Világszerte
- Mobil – 50.48%
- Asztali – 46.51%
- Tablet – 3.0%
*Megjegyzés – statisztika fent az egyik (bár hiteles) forrás, szóval lehet, hogy ferde módon, lehet, hogy nem is tudom. A http://statcounter.com/által szolgáltatott grafikonok.,
hogyan tervezhetek olyan webhelyet, amely minden böngészőben ugyanúgy néz ki & felbontás?
nem lehet.
lehetetlen olyan weboldalt tervezni, amely minden böngészőben, platformon és képernyőfelbontásban ugyanúgy néz ki, ezért kerülje a próbálkozást.
a Google előnyben részesíti responsive design, ami jó hír azoknak, akik elfogadták, hogy:
IDÉZET: “oldalak használják a responsive web design helyesen végrehajtani dinamikus z (amelyek magukban foglalják mind az asztali tartalom markup) általában nem kell tennie semmit.”Google NOV 2017
a mobil növekszik-tehát ha új weboldalt fejleszt ki-meg kell gondolnia, hogy a mobilbarát webhely valóban a kezdetektől fogva.
arra törekszem, hogy a dolgok egyszerűek maradjanak, amikor valójában kódolok dolgokat.,
a nem – nem – kérjük, mindenki – a kérdésre, ami a weboldal mérete legjobb még egy forró téma, a vita, amelyet a tervezők több használhatóság, valamint UX szakértelem, mint én.
azt tudom, tapasztalatból, hogy a kritikus jelentőségű, hogy azonosítsa A közönség, majd az eszközök használnak, valamint épít a honlapon (az egész), hogy megfeleljen a közönség.
és hogy a közönség tartalmazza GOOGLEBOT.
átirányítja-e a mobil webhelye egy másik URL-re & A webhely verziója?
Nos, ez nem ideális. Valójában még soha nem volt.,
vissza a nap folyamán-néhány népi használt csak szöveges változata a honlapon, hogy készítsen tartalmat a felhasználók / böngészők, amelyek nem támogatják elemei a honlapok-egy (általában hiábavaló) megpróbálja, hogy azok tartalmát hozzáférhetőbbé.
a W3C még azt is javasolta, hogy azt hiszem, ha minden más nem sikerült:
egy csak szöveges oldal, egyenértékű információkkal vagy funkcionalitással, biztosítani kell, hogy egy webhely megfeleljen ennek a résznek a rendelkezéseinek, ha a megfelelés más módon nem valósítható meg., A csak szöveges oldalak tartalmát az elsődleges oldal változásakor frissíteni kell. 508. szakasz
mindig is ideális volt egy URL-t eljuttatni a látogatónak hozzáférhetőség céljából, és nincs különbség a mobil vagy okostelefon-tartalom kézbesítésekor, ha a webhely “mobil” verziójának létrehozására gondol. Ez természetesen még fontosabb lehet, ha a Google egy mobil első indexre költözik.,
A Google nagyon jól értékelheti Önt elsősorban a mobilélményén a közeljövőben-tehát mindenkinek tisztában kell lennie azokkal a nagy változásokkal, amelyeket hamarosan láthatunk a Google SERP-jében.
amikor a Google a “látogató”, általában még fontosabb, hogy csak egy URL – t adjon meg a keresőmotorok kanonikus URL-kihívásai miatt-és ez történt a kanonikus link elem megvalósítása előtt egy ideje.
tehát az ideális helyzet az, hogy mindig egy URL-t szállítson.,
ha van” okostelefon ” tartalma (amit normál webes tartalomnak tekintünk, mivel ez általában egy normál HTML oldal, csak kisebb kijelzők elrendezésében csípett) használhatja a rel=canonical to point to your desktop version. Ez segít nekünk, hogy összpontosítson az asztali változat web-keresés. Amikor a felhasználók okostelefonnal látogatják meg az asztali verziót, átirányíthatja őket a mobil verzióra. Ez az URL-struktúrától függetlenül működik, így nem kell aldomaineket / alkönyvtárakat használni okostelefon-mobil webhelyekhez., Még jobb azonban, hogy ugyanazt az Url-eket, majd mutatni a megfelelő változata a tartalom nélküli átirányítás John Mueller, a Google
figyelmen kívül hagyva a Google Ajánlásait Gyakran Nem Egy Okos Lépés
IDÉZET: összefoglalva, jelenleg a tele, indexelés, pedig rangsor rendszerek jellemzően nézd meg a desktop változata egy oldal tartalmát, amely okozhat problémákat a mobil keresők, amikor ez a változat teljesen más mint a mobil verzió., A mobil-első indexelés azt jelenti, hogy a tartalom mobil verzióját használjuk az indexeléshez és a rangsoroláshoz, hogy jobban segítsünk – elsősorban mobil – felhasználóinknak megtalálni azt, amit keresnek. A webmesterek jelentősen megnövelik a feltérképezést az okostelefon Googlebot segítségével, az eredmények töredékei, valamint a Google gyorsítótár oldalainak tartalma az oldalak mobil verziójából származik., A Google Nov 2017
a Google kínál az alábbi tippeket, hogy ellenőrizze a webhely elő van készítve a mobil első index, de lényegében, ha a responsive web design sablont, a helyszínen kellett volna minimális kérdések, ez a változás:
-
ellenőrizze, Hogy a mobil változata a helyszín is megvan a fontos, magas minőségű tartalom. Ez magában foglalja a szöveget, a képeket (alt-attribútumokkal), valamint a videókat – a szokásos bejárható és indexelhető formátumban.,
-
A strukturált adatok fontosak az indexeléshez és a keresési funkciókhoz, amelyeket a felhasználók szeretnek: mind a webhely mobil, mind asztali verzióján kell lennie. Győződjön meg róla, hogy a strukturált adatokon belüli URL-ek frissítésre kerülnek a mobil oldalakon lévő mobil verzióra.
-
metaadatoknak jelen kell lenniük a webhely mindkét verziójában. Ez ad tippeket a tartalom egy oldalon indexelés, kiszolgálás., Ellenőrizze például, hogy a címek és a metaleírások egyenértékűek-e a webhely összes oldalának mindkét verziójában.
-
nincs szükség változtatásra a különálló mobil URL-ekkel (m. – dot webhelyek) való összekapcsoláshoz. A különálló mobil URL-eket használó webhelyek esetében tartsa meg a meglévő rel = canonical és link rel = alternatív elemeket a verziók között.
-
ellenőrizze a hreflang linkeket külön mobil URL-eken., Ha link rel = hreflang elemeket használ a nemzetközivé tételhez, akkor a mobil és az asztali URL-ek közötti kapcsolat külön-külön. A mobil URL-ek hreflang-jának más mobil URL-ek más Nyelv/Régió verzióira kell mutatnia, hasonlóképpen összekapcsolnia az asztalt más asztali URL-ekkel a hreflang link elemek használatával.
-
győződjön meg arról, hogy a webhelyet tároló szerverek elegendő kapacitással rendelkeznek a potenciálisan megnövekedett feltérképezési sebesség kezelésére., Ez nem befolyásolja oldalak használata responsive web design, dinamikus szolgálja, csak a területek, ahol a mobil verzió külön fogadó, például m.example.com.
a Felhasználók Elvárják, Hogy Lapozzunk Lefelé Egy Oldal
az első kritérium azt jelenti, hogy a görgetés mindig a legfontosabb szempont. A felhasználók általában nem szeretnek görgetni, ha nem kell – bár az évek során ez megváltozott.
tehát a tervezés során figyelembe kell vennie, hogy a felhasználók mennyit láthatják, ha csak egy vagy két képernyőt görgetnek., Több mint öt képernyő hosszú lehet arra utal, hogy lehet, hogy túl sok példányt az oldalon. Persze, ez kiegyensúlyozott azzal a céllal, hogy egyes cikkek célja, hogy részletes információkat darabok, valamint a felhasználók elvárják, hogy várjon egy kicsit, hogy nézetben egy oldal, tartalom, tartalom típusok.
mind a görgetés, mind a kezdeti láthatóság nyilvánvalóan a képernyő méretétől függ: a nagyobb képernyők több tartalmat mutatnak a hajtás felett, kevesebb görgetést igényelnek.
egy érzékeny mobil webhelyre történő váltás sokkal nagyobb forgalmat eredményez a Google-tól?
nem feltétlenül, de talán.,
annyi köze van a Google optimalizálásához – a mobilbarát webhely többé-kevésbé biztosítja, hogy megőrizze a már megszerzett forgalmat, nem feltétlenül ad több szabad forgalmat a Google-tól.
Ha még nem kap sok forgalmat a mobil látogatóktól – nem vagyok biztos benne, hogy a Google frissítésének észrevehető hatása lesz – e a forgalom szintjére (legalábbis az elemzésben) az elején – de idővel-valószínűleg rendkívül fontos kihívás lesz a navigálás.,
a minőségi sávot – ismét – a Google és felhasználói emelik, és ha egyre versenyképesebb szerves SERP-kben akarnak versenyezni, ez újabb akadályt jelent a kisvállalkozások számára.
hosszú távon-ez a mobil konverzió csak jó dolog lehet a felhasználók számára – de rövid távon-érdekes lesz látni, hogy milyen hatással van a kisvállalkozások konverziós arányaira – mivel a mobilon keresztüli konverziós arányok gyakran kisebbek, mint az asztalon.,
A Google azt mondta, hogy ez a mobilbarát algoritmus nagyobb hatással lesz a SERP-kre, mint mind a Google Pingvin, mind a Google Panda algoritmusok-és az idő múlásával többet fogunk megtudni.
hogyan lehet ellenőrizni a fontos mobil használhatósági problémákat a webhelyén
Google Search Console
képesnek kell lennie arra, hogy nyomon kövesse a mobil hibákat a Google Search Console-ban (más néven a Google Webmaster Tools), és a hibák idővel eltűnnek, ha webhelye megfelelően van konfigurálva.,”>
1. Rész – PageSpeed Betekintést, Mobil-Barát Teszt, Mobil-Használhatóság
2. Rész – Viewports, zoom dugó
3. Rész – Érintse meg a célokat, margók, valamint betűméret
4. Rész – Átirányítások
Web fejlesztők meg kell találni a másik legutóbbi post hasznos, most, hogy a webhely a sebesség egy rangsorolási tényező a Google:
IDÉZET: “A mobil változat egy weboldal ideális esetben terhelés alatt 3 másodpercig, a gyorsabb a jobb., Egy nagyon lassú webhely negatív rangsorolási tényező lehet (A Google megerősítette). Nincs beállított küszöbérték vagy sebesség pontszám, hogy megfeleljen, csak azért, hogy az oldal a lehető leggyorsabban.”Shaun Anderson, Hobo 2020
jogi nyilatkozat: “Bár mindent megtettem annak érdekében, hogy az általam megadott információk helyesek legyenek, ez nem Tanács.; Nem vállalok semmilyen felelősséget vagy felelősséget a hibákért vagy mulasztásokért. A szerző nem kezeskedik harmadik fél oldalak vagy harmadik fél szolgáltatás. Látogasson el harmadik fél webhelyeire saját felelősségére., Nem vagyok közvetlenül partner a Google-lal vagy bármely más harmadik féllel. Ez a weboldal cookie-kat csak elemzésekhez és alapvető weboldalfunkciókhoz használ. Ez a cikk nem minősül jogi tanácsadásnak. A szerző nem vállal semmilyen felelősséget, hogy felmerülhet formában való hozzáférés az adatok ezen az oldalon. A belső oldalakra mutató hivatkozások a saját tartalmaimat és szolgáltatásaimat népszerűsítik.”Shaun Anderson, Hobo