Den mobile web fortsætter med at vokse i et hurtigt tempo.
Smartphones fortsætter med at sælge stærkt, med Apple alene prognoser til bringe i 180 milliarder dollar fra sine smartphones inden 2021. Der er over 224 millioner smartphone brugere i USA gør mobilwebben et væsentligt fokus for enhver hjemmeside ejer.
Den fortsatte vækst af mobile webbrugere gør det vigtigt for designere og front-end-udviklere at forstå korrekt design for accelererede mobilsider.
Udøvelsen af accelererede mobilsider lægger vægt på designvalg, der stemmer overens med hvad søgemaskiner opfatter som venlige , herunder en bestemt målgruppe, indhold af høj kvalitet, korrekt formatering og problemfri mobilkompatibilitet. Du vil se en række accelererede mobilsider, når du browser Google i mobil ved forkortelsen AMP i søgeresultater .
Accelererede mobilsider bruger stadig HTML, selvom de indeholder særlige elementer, der prioriterer hastigheden på mobile enheder. AMP tekniske krav er etableret af AMP-projektet , med standarderne arbejdet sammen med større trafikindflydende som Google. Projektet blev oprettet som reaktion på klare brugergrænseflader og langsomme belastningstider ved browsing af websteder på en mobilenhed.
AMP lægger vægt på øjeblikkelig hastighed og et kendt udseende, hvilket giver skabere mulighed for at style deres sider inden for AMP-rammen. Det kedeplade-centriske design på de fleste AMP-sider giver en lignende følelse af navigation, på trods af forskelle i indholdspræsentation og farveskemaer.
Resultatet er en hurtigere og mere sammenhængende browseroplevelse, som forbedrer drop rates, øger læsers engagement og brugere i mobile web browsing som en grundpille.
Med AMP's potentiale og potentiale er det så praktisk, at designerne kan se nedenstående tips for at hjælpe med at optimere AMP-oplevelsen, så deres kunder vil have gavn på mange forskellige måder.
Få et indtryk på siden, de fleste af dine besøgende begynder med. Statisk indhold kan vises på AMP for at fremvise tilgængelige produkter, pikere interesse for e-handelssites samt dem, der viser generelt indhold.
Det AMP-karrusel-funktion gør det muligt for designere at vise flere lignende indholdstyper på en vandret akse. Når du har importeret karruselkomponenten i overskriften, kan du bruge typen = "karrusel" for at vise en liste med billeder, der vises som en kontinuerlig strimmel. Det er en iøjnefaldende funktion, der er ideel til forsiden, når du forsøger at få besøgende til at se noget ud over hjemmesiden.
Opmuntre besøgende til at grave dybt ind i dit indhold. Du kan opnå dette ved at vise en liste over relaterede produkter eller indlæg til den, de aktuelt ser på. Du kan statisk udgive en liste over relevant indhold, udføre det øjeblikkeligt af ved brug af
Hvis besøgende indtaster en destinationsside, der ikke svarer til deres anmodninger, vil de enten forlade webstedet eller se nærmere på, hvad de søger . Forslaget til produktalternativer er en fremragende metode til at imødekomme brugerens søgeproces, i det mindste tegne dem mere ind på webstedet. Selvom de ikke finder det, de søger præcist, kan de finde et alternativ, der gør jobbet lige så godt.
Det er vigtigt for enhver hjemmeside ejer at vide, hvordan besøgende interagerer med indholdet. Det
Det er vigtigt at huske på, når analyser analyseres, at med AMP er smart caching naturligt indlejret. Resultatet er, at du kan se mindre trafik end normalt. Bare hold cache-elementet i tankerne, når du først analyserer dine numre.
Ideelt set vil designere aldrig få noget forkert, men det kan ske. For at sikre, at alt fungerer korrekt på en side, skal du bruge AMPs indbyggede validator ved at tilføje # development = 1 til slutningen af siden URL. Hvis du åbner Chrome dev-værktøjer og ser meddelelsen "AMP validering succesfuld", så fungerer alt. Hvis ikke, kan du grave dybere, indtil problemet løser. Du kan også bruge Chrome dev-værktøjer til at kontrollere, at alle eksterne ressourcer, alt fra billeder og videoer til brugerdefinerede skrifttyper og iframes, er indlæst korrekt.
Derudover kan du validere metadata ved hjælp af Googles struktureret datatestværktøj enten ved at hente en webadresse eller indsætte et kodestykke. Disse værktøjer kan medvirke til at sikre, at alt er valideret, så søgemaskinens gennemsøgning er aktiveret. På noten af søgemaskinens gennemsøgning skal du også dobbelttjekke din robots.txt-fil for at bekræfte, at "Disallow: / amp /" ikke findes i nogen linje. Hvis det er der, vil crawlere ikke kunne få adgang til dine AMP-filer.
En anden fordel ved AMP er en allerede eksisterende ramme for implementering af annoncer. Den forstærkede eller forstærkede komponent er en beholder til at vise en annonce. Annoncerne lades sammen med alle de andre ressourcer, med
JavaScript er ikke-eksisterende inden for AMP-dokumentet. I stedet lægger AMP en iframe fra en iframe sandkasse. Du kan indstille bredde- og højdeværdier indenfor
Du kan også indstille en pladsholder eller mulighed for ingen tilgængelig annonce via stedholderattributten. Videoannoncer er også mulige med indbygget support, med grundig support af mediekomponenter .
Accelererede mobilsider bidrager til at øge søgemaskinens synlighed blandt mobilbrugere, især nu, at Google omslutter AMP-sider i søgeresultaterne.
Derudover giver hurtigere indlæsningstider, fleksibel personalisering og visuelle komponenter, der søger at forbedre afvisningshastigheden, en bedre mobil brugeroplevelse end nogensinde.
Accelererede mobilsider giver en fantastisk ramme for den fortsatte vækst af mobile webbrugere.