Google přestává zobrazovat stránky neoptimalizované pro mobily


Google přestává  zobrazovat stránky  neoptimalizované  pro mobily

Google si pro majitele webových stránek připravil další novinku. Od 21. dubna už nebude ve výsledcích vyhledávání na mobilech zobrazovat stránky, které nejsou optimalizované pro mobilní telefony. Nezáleží na tom, jestli máte koupenou šablonu, vlastní systém nebo e-shop.

Google sníží hodnocení stránek ve výsledcích mobilního vyhledávání, které nejsou považovány za „mobile-friendly“. Stránky, které mají na mobilu příliš malý text nebo odkazy, na které je těžké kliknout prstem, budou diskriminovány. Google už v únoru zveřejnil na svém blogu: „Stále více lidí používá mobilní zařízení pro přístup k internetu, naše algoritmy musíme přizpůsobit těmto způsobům využívání“.

Jak zjistíte, jestli Vaše stránky vyhovují požadavkům od Google? Google připravil jednoduchý testovací nástroj, kam zadáte URL adresu svého webu a ihned se dozvíte, jestli jsou Vaše stránky optimalizované pro mobil, a také poradí, co případně upravit, aby bylo vše OK. Najdete ho tady: https://www.google.com/webmasters/tools/mobile-friendly/?hl=cs.

Natočil jsem krátké video, ve kterém Vám ukážu, jak si své stránky otestovat a také, jakým způsobem problém řešit. Podívejte se na něj.

 

Přepis videa

Dobrý den přátelé, tady je Václav Krajňák a tohle video je o zobrazování Vašich stránek v Google. Nebo spíše nezobrazování. Google 21. dubna 2015 spustil aktualizaci a už nebude ve výsledcích vyhledávání zobrazovat stránky, které nejsou optimalizované pro mobil. Tahle změna bude mít větší dopad než předchozí aktualizace, které Google dělal a které možná znáte pod jménem Panda nebo Penquin. Proto se této aktualizaci také říká Mobilegeddon.

Jestli je Vaše stránka optimalizovaná pro mobil zjistíte přímo v testu od Google. Stačí do Google zadat „použitelnost v mobilech“. A vyjede Vám odkaz na stránku. Ta stránka se také nachází na adrese https://www.google.com/webmasters/tools/mobile-friendly/?hl=cs. Takhle vypadá a funfuje to tak, že já do ní zadám adresu své stránky například „clipsan.com/blog“ a kliknete na Enter nebo na modré tlačítko. A jak ten výsledek vypadá, je tady.

Výsledek testu použitelnosti

Výsledek testu použitelnosti

No a super – moje stránka je použitelná v mobilních zařízeních. Takhle vypadá. Takhle vypadá ta stránka, když si ji zobrazíte v běžném prohlížeči. A když si prohlížeč zmenším, tak hned vidím, že se ta stránka mění. To znamená, že je responzivní. Reaguje na to, jaký prohlížeč používám. Ne všechny stránky jsou optimalizované pro mobil.

Našel jsem třeba tuto stránku www.a-pension.cz, tohle není můj klient a ani s těmi stránkami nejsem nijak spojen. Když zmenším prohlížeč, tak uvidíte, že se nic nestane. Stránka je pořád stejná. Uvidíme, co na to říká Google. Zadám tu adresu do testování a tady už je červená. Vidím, že stránka není použitelná v mobilních zařízeních.

Google mi tady řekne, co je na té stránce špatně a ještě mi poradí, co mám dělat. Tyto stránky jsou na WordPressu, takže se můžu obrátit na svého webmastera. S ním se domluvím na úpravě. Ta nemusí být příliš složitá. Většinou stačí v kódu stránek udělat pár úprav. Ty zaberou od dvou hodin po jeden pracovní den programátora, záleží na tom, jak velké a složité stránky máte.

Ukážu Vám to na příkladu této stránky. V prohlížeči Google Chrome kliknu druhým tlačítkem myši a kliknu na „Zkontrolovat prvek“. Otevře se mi takovéto okno, a já sem vložím kus kódu, který jsem si připravil. Ten kód vypadá takhle… To je pár řádků kódu, které stačí a ta stránka se změní ve stránku optimalizovanou pro mobil. Ten kód se skládá ze dvou částí.

V té první zapínám optimalizaci stránek podle prohlížeče. To je tahle část…
<meta name="viewport" content="width=device-width, initial-scale=1">

V té druhé říkám, co zobrazovat, když prohlížeč je mobilní telefon. Je potřeba stránku zúžit a vypnout tento flashový banner. Protože flash se na mobilu nezobrazuje.
<style>@media(max-width:767px){#wrapper{background: #6b0000;} .entry{padding-right: 17px} #banner{display: none;} #header,#banner,#wrapper,#footer,#content,#sidebar,#page{max-width: 100%; max-width: 100%; float: none;} #header p {float: none; padding-bottom: 15px; padding-right: 15px} #header{height: auto; margin-bottom: 15px} iframe {max-width: 100%} #content {padding: 15px 0 15px} #wrapper .top {background: none} #wrapper .btm {background: none}}</style>

Já ten kód vezmu a vložím ho přímo do hlavičky stránek. Udělám to tady, na konci. Tak. A hotovo. Stránky jsou optimalizované pro mobil.

Když si je zmenším, tak uvidíte, co se stane, a ty stránky jsou na mobilu zobrazitelné a jsou čitelné. Není to ideální, tady dole máme nějakou navigaci, šlo by s tím ještě něco dělat dál. Ale tahle úprava mi zabrala 15 minut a stránky jsou optimalizované pro mobil. Google je bude zobrazovat. Samozřejmě, ten kód bych musel nahrát přímo na stránky.

Věřím, že Vám mé video pomohlo a držím Vám palce při vylepšování Vašich stránek. Já jsem Václav Krajňák a pokud Vás zajímá víc informací o optimalizaci stránek, o online marketingu, sledujte mě na Facebooku, Twitteru nebo se přihlaste k odběru zajímavých článků z mého blogu.

Ať se Vám daří.

Aktualizace 14. 6. 2015

traffic-decreasePrvní výsledky ukazují více jak 5% propad v návštěvnosti viz. http://venturebeat.com/2015/06/12/take-notice-mobilegeddon-is-real-and-its-here/. Co si z toho odnést? Čím déle čekáte s optimalizací stránek na mobilní, tím horší bude získat zpět pozici ve vyhledávači.

Jak jste připraveni na Mobilegeddon?

P. S. Sdílejte video s dalšími majiteli stránek. 🙂

Následující záložky mění níže uvedený obsah.
Václav pomáhá podnikatelům a malým firmám napříč obory prodávat a vydělávat na internetu víc pomocí strategií a systémů na maximalizaci zisku. Založil službu pro automatizaci prodeje a marketingu Clipsan. Nahrává týdenní podcast pro podnikatele a marketéry Strategické zisky.

Sdílejte

14 komentářů


  1. Pavlina napsal:

    Pěkný a hlavně zajímavý článek! Sdílím 😉

    1. Vaclav Krajnak napsal:

      Vážím si toho Pavlíno 🙂

    1. Vaclav Krajnak napsal:

      Paráda Honzo, gratuluji 🙂

  2. Dana Němečková napsal:

    Opravdu aktuální a velmi užitečný tip. Také sdílím!!

    1. Vaclav Krajnak napsal:

      Děkuji Dano 🙂

  3. Josef Kohout napsal:

    Nechybí tady odkaz? 6. odstavec – „A jak ten výsledek vypadá, je tady.“

    1. Vaclav Krajnak napsal:

      Děkuji za dotaz Pepo. To je přepis videa, takže je to vidět v něm . Přímo na stránkách změnu neuvidíš, protože k nim nemám přístup 🙂

  4. Petra Harazímová napsal:

    Díky Václave, opět přínosné a jsem ráda, že jsem prošla testem 🙂

    1. Vaclav Krajnak napsal:

      Gratuluji Petro, vzhůru k dalším k výzvám 🙂

  5. Miloslav Kokeš napsal:

    Díky Václave, tak jsem to otestoval a jeden ze čtyř webů musím nechat předělat. Alespoň že jsem ty dva začátkem roku právě z tohoto důvodu již předělal. Ten jeden to už zvládnu. Miloš 🙂

    1. Vaclav Krajnak napsal:

      Děkuji za komentář Miloslave, těch posledních 25 % dáte jako malinu, držím palce 🙂

  6. Děkuju, jsem ráda, že web, se kterým se od začátku roku morduju ve WP je ok 🙂 Budu sdílet!

    1. Vaclav Krajnak napsal:

      Skvělá práce se vrací, gratuluji 🙂




Napište svůj názor Zrušit odpověď

Novinky na email

Získejte nejnovější články a návody jako první.

Jak vybrat poskytovatele mailingového systému
Ještě nevyužíváte komunikační kanál, který drtí všechny ostatní?
Tak si hned nechte poslat 35stránkovou brožuru „Jak vybrat poskytovatele mailingového systému”!

Odesláním formuláře souhlasíte s tím, že údaje budeme zpracovávat pro marketing v souhladu s Ochranou dat a Podmínkami.