• Opi SEO

Mobile-First-indeksointi: Opas mobiiliystävällisten verkkosivustojen varmistamiseen

  • Yoni Yampolsky
  • 5 min read
Mobile-First-indeksointi: Opas mobiiliystävällisten verkkosivustojen varmistamiseen

Intro

Mobile-first-indeksointi ei ole uusi aihe hakukoneoptimoinnin (SEO) ja verkkosivustojen kehittämisen maailmassa. Itse asiassa Exploding Topics raportoi, että yli 55 prosenttia maailmanlaajuisesta liikenteestä tulee mobiililaitteista.

Jos yritykselläsi ei ole mobiiliystävällistä verkkosivustoa, potentiaaliset asiakkaat todennäköisesti hyppäävät sivustoltasi pois sekunneissa.

Paras tapa saada sivustosi näkymään Googlen hakukoneiden tulossivuilla (SERP) on ottaa käyttöön mobiililaitteiden indeksointi.

Tämä on Googlen menetelmä, jolla sivustot luokitellaan niiden sisällön mobiiliversioiden perusteella.

Tässä oppaassa kerrotaan, miten voit ottaa käyttöön mobile first -indeksoinnin luomalla responsiivisen verkkosivuston suunnittelun, jotta pääset oikealle tielle.

Tarkista, onko verkkosivustosi mobiiliystävällinen

Mobiili ensin -indeksoinnissa hakukoneet indeksoivat ja näyttävät verkkosivustosi mobiiliversion ennen kaikkea muuta. Jos verkkosivustosi ei ole mobiiliystävällinen, sen työpöytäversio näkyy oletusarvoisesti mobiilinäytöissä.

Mobiilikäyttäjät voivat päätyä ylisuuriin ja vaikeasti käytettäviin verkkosivuihin älypuhelimella tai tabletilla. Tämä ei ole vähintäänkin ihanteellinen tilanne. Jäät paitsi responsiivisesta suunnittelusta. Eikä verkkosivustosi sopeudu eri näyttökokoihin.

Tapaa Ranktracker

All-in-One-alusta tehokkaaseen hakukoneoptimointiin

Jokaisen menestyvän yrityksen takana on vahva SEO-kampanja. Mutta kun tarjolla on lukemattomia optimointityökaluja ja -tekniikoita, voi olla vaikea tietää, mistä aloittaa. No, älä pelkää enää, sillä minulla on juuri oikea apu. Esittelen Ranktracker all-in-one -alustan tehokasta SEO:ta varten.

Olemme vihdoin avanneet Ranktrackerin rekisteröinnin täysin ilmaiseksi!

Luo ilmainen tili

Tai Kirjaudu sisään omilla tunnuksillasi

Voit välttää tämän skenaarion tarkistamalla, onko verkkosivustosi jo mobiiliystävällinen. Paras tapa on käyttää Googlen PageSpeed Insights -työkalua.

PageSpeed Insights (Kuvalähde)

Kun vain lisäät verkkosivustosi URL-osoitteen hakupalkkiin, voit tarkastella reaaliaikaisia tietoja siitä, miten se toimii mobiililaitteilla:

PageSpeed Insights results (Kuvalähde)

Kuten huomaat, on erittäin tärkeää säilyttää mobiiliystävällisen verkkosivuston pistemäärä 90-100:n välillä. Jos huomaat, että verkkosivustosi ei ole mobiiliystävällinen, on aika siirtyä Google Search Consoleen.

Mobile Usability from Search Console (Kuvalähde)

Tapaa Ranktracker

All-in-One-alusta tehokkaaseen hakukoneoptimointiin

Jokaisen menestyvän yrityksen takana on vahva SEO-kampanja. Mutta kun tarjolla on lukemattomia optimointityökaluja ja -tekniikoita, voi olla vaikea tietää, mistä aloittaa. No, älä pelkää enää, sillä minulla on juuri oikea apu. Esittelen Ranktracker all-in-one -alustan tehokasta SEO:ta varten.

Olemme vihdoin avanneet Ranktrackerin rekisteröinnin täysin ilmaiseksi!

Luo ilmainen tili

Tai Kirjaudu sisään omilla tunnuksillasi

Sieltä löydät indeksointiongelmat, sivuston nopeusongelmat ja muut virheet, jotka saattavat haitata mobiilikäyttöä.

Yleisimmät mobiiliystävällisyyteen liittyvät ongelmat, joita löydät Google Search Console -artikkeleissa, ovat kuitenkin seuraavat:

  • Mobiilikäyttäjien ongelmat kosketinsyötön (linkit ja painikkeet) kanssa
  • Epäkeskeinen verkkosivujen suunnittelu, malli tai teema.
  • Ei-mobiiliystävälliset ponnahdusikkunat
  • Verkkosivuston navigointi on hankalaa
  • Vaikeasti luettavat fontit

Riippumatta siitä, onko verkkosivustosi rakennettu tyhjästä vai käytätkö WordPressin kaltaista sisällönhallintajärjestelmää (CMS), sinun ei pitäisi olettaa, että sivustosi on jo valmiiksi mobiiliystävällinen.

PageSpeed Insights ja Google Search Console antavat sinulle katsauksen verkkosivustosi suorituskykyyn mobiilikäyttöön, jotta voit tehdä tarvittavat parannukset mobiilinäyttöjä varten.

Varmista, että verkkosivustosi tarjoaa saman käyttökokemuksen sekä työpöytä- että mobiililaitteilla.

SEO:t ja kehittäjät karsivat usein joitakin verkko-ominaisuuksia mobiilisivustolta hyvän käyttökokemuksen (UX) edistämiseksi.

Loppujen lopuksi ei ole koskaan hyvä ajatus, että mobiilikäyttöön tarkoitettu verkkosivusto on kömpelö ja täynnä hyödyttömiä elementtejä. Liian monien näiden ominaisuuksien poistaminen voi kuitenkin vaikuttaa verkkosivustosi mobile-first-indeksointiin.

Google haluaa varmistaa, että kehittäjät tarjoavat saman kokemuksen sekä työpöytä- että mobiilikäyttäjille. Tässä on, mitä heillä oli erityisesti sanottavaa asiasta:

"Jos mobiilisivustollasi on vähemmän sisältöä kuin työpöytäsivustollasi, harkitse mobiilisivustosi päivittämistä niin, että sen ensisijainen sisältö vastaa työpöytäsivustosi sisältöä. Lähes kaikki sivustosi indeksointi tulee mobiilisivustolta."

Se on melko yksinkertaista.

Jos mobiilisivustosi versiossa on vähemmän sisältöä, se ei menesty hyvin SERP-listalla.

Hakukoneet arvostavat sisältöä, koska se on ainoa tapa, jolla ne voivat määrittää, mistä sivustossasi on kyse. Jotta verkkosivustosi työpöytä- ja mobiiliversiot pysyisivät samanlaisina, tässä on muutamia keskeisiä suosituksia:

  • Tee yhteistyötä UX-, SEO- ja kehitystiimien kanssa, jotta sisältö voidaan näyttää mobiiliystävällisellä tavalla sen sijaan, että poistaisit tärkeitä verkkosivuston elementtejä.
  • Kuvat, videot ja muut suuret sisältötiedostot on optimoitava oikein eri mobiililaitteille, kuten tableteille, älypuhelimille ja muille älylaitteille.
  • Pidä kaikki strukturoidut tiedot, meta-robottitunnisteet ja tekniset verkkosivutiedot yleispätevinä kaikissa IoT-laitteissa.

Muista, että mobiili-ensimmäinen indeksointi tarkoittaa, että hakukoneet tutkivat ensisijaisesti verkkosivustosi mobiiliversiota. Jos mobiilisivustosi on nälkäinen sisällön suhteen, ei ole väliä, miten optimoitu työpöytäsivustosi on.

Kumpikaan ei tuota hakukoneoptimoinnin suorituskykyä, jota etsit.

Opi ero mobiilikäytettävyyden ja mobile-first-indeksoinnin välillä.

Mobile-first-indeksointia ja mobiilikäytettävyyttä käytetään usein synonyymisti. Totuus on, että nämä termit eivät ole sama asia.

Mobiilikäytettävyys selittää verkkosivuston suorituskyvyn mobiililaitteilla. Kuten aiemmin selitimme, Google indeksoi mobiililaitteilla ensisijaisesti mobiiliversiot työpöytäversioihin verrattuna.

Tässä on varoitus.

Jos verkkosivustosi ei ole mobiiliystävällinen ja siinä on paljon mobiilikäytettävyyteen liittyviä ongelmia, Google voi silti indeksoida sen ja indeksoi sen. Sanotaan esimerkiksi, että sinulla on ravintola, ja yksi ruokalistasivuistasi on PDF-tiedosto.

PDF-tiedostoja on tietysti vaikea lukea ja selata mobiililaitteilla. Google voi silti indeksoida tietoja mobiili-ensimmäisen indeksoinnin avulla, jos niitä on riittävästi.

Lopulta älypuhelimen Googlebot indeksoi verkkosivustosi automaattisesti, jos sillä on riittävästi sisältöä mobiili-ensimmäistä indeksointia varten. Sinun on kuitenkin ensin ratkaistava verkkosivustosi mobiilikäytettävyysongelmat.

Nopeuta verkkosivustosi nopeutta

Käyttäjä viettää verkkosivustolla keskimäärin 54 sekuntia.

Kenelläkään ei ole koko päivää aikaa odottaa verkkosivustosi latautumista. Loppujen lopuksi on miljardeja muita verkkosivustoja, joille he pääsevät vain muutamassa sekunnissa.

Siksi verkkosivuston nopeuden parantaminen on tärkeää paitsi mobiilikäyttäjien myös hakukoneoptimoinnin kannalta.

Verkkosivuston hitaat latausajat vaikuttavat sekä sivustolla viipymiseen että sen hylkäysprosenttiin. Nämä ovat mittareita, joilla arvioidaan, kuinka kauan ihmiset viipyvät verkkosivustollasi tai poistuvat tekemättä mitään.

Jos näin tapahtuu verkkosivustosi hitaan nopeuden vuoksi, Google huomaa sen ja alentaa verkkosivustosi sijaintia SERP-listalla. Tämän välttämiseksi voit tarkistaa ja valvoa verkkosivustosi nopeutta tekemällä sivuston tarkastuksen.

Ranktrackerin avulla voit tehdä kattavan web-auditoinnin ja arvioida sivustosi nopeutta mobiililaitteilla.

Optimoi verkkosivustosi laiskan latauksen sisältöä varten

Sisällön hidas lataaminen on arkipäivää useimmilla nykyaikaisilla verkkosivustoilla. Uutisjulkaisut käyttävät tämäntyyppistä sisältöä lisätäkseen jatkuvasti uusia juttuja, kun selaat sivustoja alaspäin.

Urheilu-uutisten julkaisija ClutchPoints antaa käyttäjien klikata "Lisää tarinoita" -painiketta, jos he haluavat lukea lisää uutisartikkeleita tietyistä urheiluluokista:

Lazy Loading content (Kuvalähde)

Sisällön laiskan lataamisen periaatteena on näyttää sisältöä vain silloin, kun käyttäjä sitä pyytää. Lisäksi se lisää verkkosivuston nopeutta vähentämällä tarpeettomia koodirivejä, joita Googlen on indeksoitava.

Se on myös mukava lisä UX:n kannalta, sillä se pitää verkkosivut vähemmän sisällöltään raskaina mobiilikäyttäjille. Ongelmana on kuitenkin se, että hakukoneiden indeksointi voi olla haastavaa.

Takaisin esimerkiksi ClutchPoints-pisteisiin.

Google ei tietenkään pysty indeksoimaan tarinoita, jotka voit hakea napsauttamalla "Lisää tarinoita" -painiketta, jos ne eivät ole jo siellä.

Voit korjata tämän ongelman varmistamalla, että verkkosivustosi sallii sivukohtaisen latauksen. Näin Googlen kaltaiset hakukoneet voivat huomioida koko sivustosi sisällön, vaikka siinä käytettäisiin loputonta vieritystä, kuten ClutchPointsissa.

Varo virheellistä mainosten sijoittelua

Jos käytät Google Adsensea, on tärkeää olla tarkkana siitä, miten mainokset näkyvät verkkosivustosi mobiiliversiossa.

Mobiililaitteissa näytetään reagoivia näyttömainoksia (RDA) pöytätietokoneessa nähtävien yleisempien mainosten sijaan.

Tässä on esimerkiksi tyypillisiä työpöytämainoksia:

Watch out for improper ad placement (Kuvalähde)

Ja tältä ne näyttäisivät mobiililaitteessa:

here's what they'd look like on a mobile device (Kuvalähde)

Työpöytämainoksia ei voi käyttää uudelleen mobiilissa. Seuraavassa on joitakin parhaita käytäntöjä, joita kannattaa noudattaa luotaessa mobiilikäyttöön tarkoitettuja RDA-mainoksia:

  • Ohjeista SEO-tiimiäsi ja kehittäjiäsi käyttämään CSS- ja HTML-tageja mainosten mukauttamiseksi eri esityskokojen mukaan.
  • Pidä otsikko ja teksti selkeinä ja lyhyinä
  • Yritä välttää tekstin lisäämistä kuvien päälle
  • Luo erikokoisia mainoskuvia

Varmista, että verkkosivustosi on ADA-yhteensopiva

Yhdysvalloissa61 miljoonaa ihmistä elää vammaisena. Esteettömät verkkosivut tarkoittavat sitä, että niiden käyttäjille, jotka ovat vaikeasti kuulovammaisia, värisokeita tai joilla on jokin muu näkymätön vamma, voidaan tarjota palveluja.

Mitä useammat ihmiset voivat olla vuorovaikutuksessa verkkosivustosi kanssa, sitä todennäköisemmin he pysyvät siellä ja konvertoivat. Tämä käsite on valtava mobiililaitteille suunnatun indeksoinnin kannalta.

Verkkosivuston esteettömyys hyödyttää kaikkia käyttäjiä, ei vain vammaisia. Parempia asiakaskokemuksia tarjoavat muun muassa mobiiliystävälliset verkkosivut, joita on helppo käyttää, joissa on selkeä sisältörakenne ja joissa on vaihtoehtoinen teksti kuville.

Verkkosivujen esteettömyyteen pyrkiminen on eettisyyden lisäksi myös viisas kaupallinen päätös. On olennaisen tärkeää tiedostaa saavutettavuuden varmistamisen oikeudelliset vaikutukset. Esimerkiksi ADA-lain (Americans with Disabilities Act) kaltaiset säädökset vaikuttavat yhdysvaltalaisiin yrityksiin, ja niiden mukaan niiden verkkosivujen on fyysisten tilojensa tavoin tarjottava kattava kokemus kaikille kävijöille.

Voit käyttää ilmaista verkkosivuston saavutettavuuden tarkistusohjelmaa, kuten accessiBe, joka arvioi tarkasti verkkosivustosi saavutettavuuden nykytilan ja määrittää, onko se nykyisten säännösten mukainen.

website accessibility checker Kuvan lähde

Tapaa Ranktracker

All-in-One-alusta tehokkaaseen hakukoneoptimointiin

Jokaisen menestyvän yrityksen takana on vahva SEO-kampanja. Mutta kun tarjolla on lukemattomia optimointityökaluja ja -tekniikoita, voi olla vaikea tietää, mistä aloittaa. No, älä pelkää enää, sillä minulla on juuri oikea apu. Esittelen Ranktracker all-in-one -alustan tehokasta SEO:ta varten.

Olemme vihdoin avanneet Ranktrackerin rekisteröinnin täysin ilmaiseksi!

Luo ilmainen tili

Tai Kirjaudu sisään omilla tunnuksillasi

Muita tapoja tehdä verkkosivustostasi helppokäyttöisempi on:

  • Yhdenmukaisten värien käyttäminen verkkosivustollasi. Vältä kirkkaita, vaikealukuisia neonvärejä.
  • Vaihtoehtoisen tekstin lisääminen kuviin ruudunlukuohjelmia käyttävien vammaisten tarpeisiin.
  • Selkeä sisältörakenne, jotta käyttäjät löytävät tärkeät tiedot nopeasti ja helposti.

Kun olet ottanut käyttöön joitakin näistä parhaista käytännöistä, tarkista, että verkkosivustosi täyttää vammaislain (ADA) vaatimukset. Jos sivusi saa hyväksytyn tuloksen, olet valmis.

Access Scan (Kuvalähde)

Esteettömän verkkosivuston kehittäminen takaa, että kaikki ihmiset ovat mukana, saavat tietoa ja ovat valmiita muuttamaan.

Keskeiset asiat

Kaiken kaikkiaan mobile first -indeksointi on asettanut korkeammat standardit sille, miten verkkosivustojen pitäisi näyttää ja toimia internetissä. Hakukoneet ovat nyt ensisijaisesti kiinnostuneita siitä, miten verkkosivustosi palvelee mobiilikäyttäjiä.

Tämän oppaan noudattamisen pitäisi antaa selkeämpi kuva siitä, miten hallita mobiiliystävällistä verkkosivustoa ja ottaa vastaan enemmän mobiilikäyttäjiä.

Yoni Yampolsky

Yoni Yampolsky

Marketing Manager, Elementor

is a Marketing Manager for Elementor. With more than 10 million active users, Elementor empowers just about anyone to create stunning WordPress websites, code-free. Elementor now offers best-in-class, built-in cloud hosting features. You can build and host your WordPress site in one, single platform.

Link: Elementor

Aloita Ranktrackerin käyttö... ilmaiseksi!

Selvitä, mikä estää verkkosivustoasi sijoittumasta.

Luo ilmainen tili

Tai Kirjaudu sisään omilla tunnuksillasi

Different views of Ranktracker app