Google, “Bu sayfa mobil cihazlar için optimize edilmemiştir. Mobil cihazlar için optimizasyon kontrolü Mobil cihazların kullanılabilirliğini kontrol etme Yandex

  • 29.06.2020

Bugün artık kimseyi sitenin mobil versiyonuna olan ihtiyaç konusunda ikna etmeye gerek yok. Sonuçta, her gün akıllı telefonlardan ve tabletlerden daha fazla ziyaretçi var. Bu yazının yazıldığı sırada, blog ziyaretçilerimin yaklaşık %20'si gezinmek için mobil cihazları kullanıyor. Yani, beşte biri web sitemi bir telefon veya tabletten ziyaret ediyor.

Birkaç yıl önce, bu tür ziyaretçileri düşünmedim bile, ancak sayıları toplam sayının %10'unu aştığında, duyarlı bir düzen kullanmaya başladım. Bu, içeriğin mobil cihazlarda doğru bir şekilde görüntülenmesini ve hem ziyaretçilerin hem de arama motorlarının siteye olan bağlılığını artırmayı mümkün kıldı.

Sitenin mobil versiyonu ile responsive tasarımı aynı şey değildir. Bu makale, ziyaretçinin cihazının ekran çözünürlüğüne bağlı olarak site tasarımı değiştiğinde duyarlı düzeni test etmeye odaklanacaktır.

Sitenizin mobil cihazlarda doğru görüntülendiğinden emin olmak için kontrol etmeniz gerekir ve bunun için birkaç faydalı hizmet ve araç vardır.

Duyarlı düzen için hızlı kontrol

Popüler İnternet tarayıcısı (tarayıcı) Mozilla Firefox web sitesi tasarımının mobil cihazlarda görüntülenmeye uygunluğunun kontrol edilmesi için yerleşik araçlarla donatılmıştır. Kullanmak için "Menü" - "Geliştirme" - "Duyarlı Tasarım"a gidin. Veya klavyede aynı anda üç tuşa basın ++ [M]

Aşağıdaki gibi bir şey görmelisiniz:


Ekran çözünürlüğünü ve yönünü değiştirerek sitenizin mobil ziyaretçilere nasıl görüntüleneceğini kontrol edebilirsiniz.

Google Tarayıcı Krom ayrıca site tasarımının yanıt verebilirliğini kontrol etmek için yerleşik desteğe sahiptir. Bunu yapmak için menüye gidin, "Ek araçlar" öğesini ve ardından "geliştirici araçları" öğesini seçin (veya tuşuna basın ).

Bundan sonra, duyarlı tasarım simgesine tıklayın (veya aynı anda klavyeye tıklayın ++ [M]):

Ekranın ortasında, sitenizin mobil cihazların ekranlarında nasıl görüneceğini göreceksiniz:

Mobil tasarımın SEO testi

Bildiğiniz gibi, iki dünya arama lideri Google ve Yandex, sitenin mobil cihazların ekranlarında nasıl görünmesi gerektiğine dair kendi arsız fikirlerine sahipler. Ve site mobil ziyaretçiler için uygunsuz olarak kabul edilirse, arama sonuçlarında aşağı iner. Dolayısıyla SEO açısından bakıldığında, mobil ziyaretçi kaybetmek istemiyorsanız, yalnızca responsive bir tasarıma sahip olmanız yetmez, arama motorlarının da bunu mobil cihazlara uygun olduğunu düşünmesi gerekir.

Google hizmetini kullanarak uyarlanabilirliği kontrol etmek için aşağıdaki adrese gidin ve sitenizin adını yazın: https://www.google.com/webmasters/tools/mobile-friendly/.

Blogumu kontrol etmenin sonucu şöyle görünüyor:

Yandex ile biraz daha karmaşıktır, doğrulama için Yandex.Webmaster hizmetine kaydolmak ve arayüzün beta sürümünü kullanmak gerekir:

Uyarlanabilirliği test etmek için çevrimiçi hizmetler

Bu hizmetlerin ana görevi, sitenizin bir mobil cihazda nasıl görüneceğini sunmaktır (göstermektir). Bu tür işlevselliğe sahip birçok site var. Ben sadece birkaç tanesini vereceğim. Çoğu durumda, FireFox ve Chrome'un yerleşik işlevlerini çoğaltırlar.

Google yeniden boyutlandırıcı

Kendi duyarlı tanıtım hizmetine sahip Google ile yeniden başlayacağım: http://design.google.com/resizer/#

Quirktools ekran sineği

İkinci güzel hizmet ise http://quirktools.com/screenfly/. Sitenizin TV'de bile nasıl görünebileceğini size gösterecek!

Symby.ru adaptörü

Peki, "yerli üreticiyi" rahatsız etmemek için başka bir site örneği vereceğim: http://symby.ru/adaptest/. Bir sayfada, farklı ekran çözünürlüklerinde aynı anda birkaç görünüm göreceksiniz.

Sitenin mobil versiyonunun hızı

Sitenizin duyarlı olduğundan ve çoğu cihazın ekranlarında doğru görüntülendiğinden emin olduktan sonra, çalışma hızını kontrol etmelisiniz. Yine mobil ziyaretçilere uygulandı.

Sayfa Hızı Analizleri

Google, her zaman olduğu gibi diğerlerinden önde: https://developers.google.com/speed/pagespeed/insights/. Bu hizmet size sitenin telefon ekranında nasıl göründüğünü gösterecek ve mobil cihazlarda yükleme hızını artırmak için kodun nasıl optimize edileceğine dair önerilerde bulunacaktır.

Web Sayfası Testi

Ve sonuç olarak, sitenin sadece mobil cihazda nasıl göründüğünü değil, aynı zamanda çalışma hızını da gösterecek bir hizmet örneği vereceğim: http://www.webpagetest.org/

sonuçlar

Bence günlük işlerde site tasarımında değişiklik yaparken FireFox ve Chrome tarayıcılarının yerleşik özelliklerini kullanmak daha kolay. Bundan sonra elbette arama motorlarının tasarımınıza olan sadakatini kontrol etmeniz gerekiyor. Ve ancak o zaman, ruhu sakinleştirmek veya gösteriş yapmak için çevrimiçi hizmetleri kullanabilirsiniz.

Projeleriniz için, muhtemelen uzun zaman önce mobil kullanıcı sayısının sürekli arttığını fark etmişsinizdir. Bazıları için eğilim daha az fark edilir ve bazı projelerde bu rakam her yıl iki katına veya daha fazlasına çıkıyor. LiveInternet verilerine göre, Runet'teki trafiğin %50'sinden fazlası mobil cihazlardan kaynaklanmaktadır. Bu arada, bu blogun birçok okuyucusu uzun zamandır burada mobil sürüm olmadığından şikayet ediyor 🙂 elbette yakın gelecekte düzeltilecek.

Bu seferberlik gerçeği, arama platformları tarafından da göz ardı edilemez. Yavaş yavaş, kullanıcıların cihazlarına uyarlanmış sitelere mobil aramada avantajlar sağlarlar.

İlk başta Google, sitelere cep telefonlarında doğru bir şekilde gösterecekleri snippet'ler verdi.

Ayrıca Google, web yöneticilerinin mobil cihazlarda web sitesi görüntüsünün doğruluğunu kontrol etmelerine yardımcı olacak bir araç oluşturmuştur:
https://www.google.com/webmasters/tools/mobile-friendly/

21 Nisan'da Google, Batı'da Mobilegeddon adlı yeni bir algoritma başlattı. Artık Mobil Uyumluluk testini başarıyla geçmek, Google tarafından dikkate alınan SEO faktörlerinden biridir. Şu ana kadar SERP'de büyük bir değişiklik olmadı ama şimdiden hazırlanabilirsiniz.

Bir web sitesini Google için nasıl duyarlı hale getirirsiniz? İşin sırrı basit - programcılarınız / mizanpaj tasarımcılarınız için bir görev belirlemeniz gerekiyor. Eh, bekleyecek zaman yoksa, o zaman ... MobileCheat'i kullanabilirsiniz 🙂

Aslında, bu denenmemiş bir teknolojidir, gelecekte neye yol açacağı bilinmemektedir, bu nedenle onu yalnızca kendi tehlikeniz ve riskiniz altında kullanın. Burada en azından bir dizi test yapılabilir.

Google testi MobileCheat ile nasıl atlanır

Yapılacak sadece iki şey var:

1. Görünüm meta etiketini koda ekleyin.

2. Robots.txt aracılığıyla CSS dosyalarına veya bulundukları klasöre robot erişimini kapatın

Örneğin, blogum varsayılan testi şu şekilde geçiyor:

CSS'yi kapattığınızda, resim değişir:

Sitede hiçbir şey değişmemiş gibi görünüyor, ancak test sonuçları tamamen farklı. Bu arada, bazı sitelerde kendim CSS'yi devre dışı bırakmayı seviyorum, böylece onları görüntülemek ve kullanmak daha uygun oluyor 🙂 bu nedenle, tamamen haklı bir şema. Ama sadece bilgi amaçlı sunulmuştur.

Bunun hakkında ne düşünüyorsun? Google bunu bir şövalye ile karşı hamle olarak mı sayacak, yoksa her şeyi önceden düşündü mü ve siteyi hemen kontrol edip mat edecek mi? 🙂

Arama motorları, mobil cihazların (akıllı telefonlar, tabletler) kullanıcıları için arama sonuçlarını iyileştirmeye çalışır, bu nedenle farklı ekran boyutları için optimize edilmiş siteler, bu tür bir optimizasyon olmayan sitelerden daha yüksek görüntülenecektir. Buna sitelerin mobil versiyonları da dahildir.

Mobil uyumlu bir sitenin işaretleri:

  1. Okunması kolay içerik (büyütme olmadan okunabilir), geniş form alanları ve düğmeler.
  2. "Ağır" resimlerin olmaması, Flash - öğeler ve aşırı animasyon.
  3. Java uygulamalarının ve Silverlight eklentilerinin eksikliği.
  4. Yatay kaydırma çubuğunun olmaması.
  5. Minimum web sitesi yükleme hızı.
  6. En basit navigasyon.
  7. Görünüm alanı meta etiketi kaydedilir.

Siteyi "hareketlilik" için kontrol etme hizmetleri

Hizmetlerin nasıl çalıştığını göstermek için iyi ortaklarım olan CONTEXT tercüme bürosunun sitesini ele alalım.

1. Google Mobil Dostu

Herhangi bir siteyi, adresini satıra yazarak kontrol edebilirsiniz.

Sitenin bir akıllı telefonda nasıl göründüğünü ekranda görüntüler ve mobil cihazlar için optimizasyonunun genel bir değerlendirmesini verir.

Diğer hizmetlerden farklı olarak, burada her siteyi değil, yalnızca kendi sitenizi kontrol edebilirsiniz. Yani, site, haklarının onaylanmasıyla birlikte web yöneticisinin arayüzüne eklendikten sonra.

Hizmet, toplam puanı görüntüler, 6 uyumluluğu kontrol eder ve sitenin bir akıllı telefonda nasıl göründüğünü gösterir.

3. Bing Denetleyicisi

Genel optimizasyon ve 4 puanla uyumluluk kontrol edilir.

Ayrıca sitenin bir akıllı telefon ekranında nasıl göründüğünü de gösterir (elbette, işletim sistemi pencerelerinde, önceki hizmetler bir android akıllı telefon gösterirken =)).

4. W3C'den Mobil Denetleyici

Tüm hizmetlerin "en uzun"u. O kadar "uzun" ki testin sonunu beklemedim =)

5 dakika bekledim, geri kalan servisler 5-20 saniyede tamamlandı.

5. Sorumlu

Diğerlerinin aksine herhangi bir puan vermiyor ancak sitenizin 6 farklı cihazda IOS ve Android için iki yönde nasıl göründüğünü gösteriyor ki bu çok güzel.

UPD1: 20/07/2017:

6. uyarlayıcı

Bu makalenin yorumlarında önerilen hizmet. Şahsen kullanmadım, ama her şey oldukça iyi görünüyor. Olasılıklar yanıt verene benzer, ancak uyarlanabilirlik sonucunun bir değerlendirmesi de vardır.

UPD2: 3.11.2017:

7. iloveadaptive.com

Yorumlarda önerilen yepyeni bir hizmet daha. Bana gelince, biraz fazla kilolu ve pratik değil, ama bu harika fırsatlarla karşılığını fazlasıyla veriyor. İşletim sistemine göre sıralama bile var.

Çıktı

Şüphesiz, bir sitenin mobil cihazlara uyarlanması sadece modaya ve zamana bir övgü değil, aynı zamanda sadece son kullanıcıya yardımcı olmayan modern bir sitenin gerekli bir özelliğidir.

Bu nedenle, müşteriye daha yakın olmak ve daha fazla ziyaret / potansiyel müşteri olmak isteyen herkes için sitelerini en kısa sürede uyarlamasını tavsiye ederim. Bana bir soru sorun -

Herkese iyi günler, arkadaşlarım ve blogumun misafirleri. Bugün makalem oldukça kısa olacak, ancak bugün alaka düzeyini kaybetmiyor. Yani size google'ın sitenin mobil versiyonunu kontrol etmesi gibi bir şeyden bahsetmek istiyorum. Ve belki de bu çek beni son zamanlarda şaşırtmasaydı, bu kadar bariz bir makale bile yazmazdım.

google ile kontrol etme

Daha önce, insanlar duyarlı tasarım veya mobil sürümle uğraşmıyordu. Ancak daha sonra, arama motorlarının mobil versiyonu olmayan siteler için arama motoru sonuçlarını düşüreceği bilgisi ortaya çıkınca, insanlar kendilerini zorladı (HTTPS örneğinde olduğu gibi). İnsanlar hemen serbest çalışanlardan mobil sürümler sipariş etmeye başladılar, bazıları çarpık çalışabilecek özel eklentiler kurdu.

Böylece, biri uyarlanabilir bir düzen veya mobil sürüm edindiğinde, düzeninizin gereksinimleri nasıl karşıladığını inceleyen özel bir Google hizmetinde hemen kontrol etti. Şimdi arayüz biraz değişti, ancak öz aynı kaldı.

Bu davayı kendiniz kontrol etmek için bu servise gitmeniz gerekiyor - search.google.com/search-console/mobile-friendly... Bundan sonra, URL çubuğuna bu sitenin adresini girin ve bekleyin. Kısa bir süre sonra sitenizin Google mobil düzeni gereksinimlerini karşılayıp karşılamadığı ile ilgili tüm bilgiler size verilecektir.

Anlamıyorum...

Sitemin uyarlandığını çok iyi biliyorum, özellikle de düzeni yeni değiştirdiğimden beri. Ama geçenlerde, eğlence olsun diye, yaşlı Gosha'nın ne diyeceğini görmek için bu servise gittim ve çok şaşırdım. Gerçek şu ki, hizmet bana blogumun hiçbir zaman uyarlanmadığını ve mobil cihazlar için yetersiz okunabilir olduğunu söyledi.

Sorunun ne olduğunu anlayamadım, bu yüzden internette bir çözüm aramaya başladım. Ve bir sitede buldum. Her şeyin robots.txt dosyasında olduğu ortaya çıktı. Arama motorları tema dosyalarımı indekslemesin diye siyah beyaz yazdım, bu yüzden herhangi bir mobil sürüm görmedi.

Robottan bir satırı kaldırdıktan sonra ( İzin verme: / wp-content / temalar / benim temam), ardından hizmet, mobil sürümümün normal olduğunu hemen belirledi. Bu yüzden aniden aynı şeye sahipseniz endişelenmeyin. Büyük olasılıkla, Google'ın temanızı dizine eklemesine izin vermediniz.

Bu konuda muhtemelen bugün makalemi bitireceğim. Umarım faydalı bulursunuz. Gördüğün gibi google sitenin mobil sürümünü kontrol etmek, sitenin gereksinimlerine ne kadar uygun olduğunu görmenizi sağlar. Ancak aslında, kendi mobil sürümüne veya yanıt hızına sahip olmayan bir site bulmak zaten nadirdir. Biraz daha zaman geçecek ve yeni oluşturulan tüm siteler otomatik olarak bir SSL sertifikasına sahip olacak.

Beni okuduğunuz için teşekkür ederim. Mutlaka tekrar blog sayfamda sizleri bekliyor olacağım. Bu arada diğer yazıları da okumanızı tavsiye ederim. Kendiniz için çok ilginç şeyler bulacağınızdan eminim. Sana iyi şanslar. Güle güle!

Saygılarımla, Dmitry Kostin.

Sitenin mobil sürümünü hatalar için kontrol etmek basit bir iştir. Arama motoru optimize edicisinin sorumluluğu. Sitenin optimize edilmiş bir sürümünün varlığı, site belgelerinin sıralamasında bir faktördür.

Mobil site araçları

Sitenin mobil versiyonu nasıl kontrol edilir.

Hizmetleri kullanarak siteyi mobil cihazlar için kontrol edebilirsiniz:

  • Google Mobil Dostu
  • Google PageSpeed ​​​​Insights;
  • Web Sayfası Testi;
  • ScreenFly;
  • Web Sayfası Testi;
  • Tarayıcı Yığını.

Mobil Uyumlu

Mobil Dostu adlı bir hizmet, sitenin mobil cihazlar için nasıl optimize edildiğini ve optimizasyon açısından hangi hataların olduğunu gösterecektir:

Sayfa Hızı Analizleri

Ayrıca, Google arama motorunda gösterilen bir aracı kullanarak sitenin mobil sürümünü Google için kontrol edebilirsiniz.

Hizmete kısaca PageSpeed ​​Insights adı verilir.

Web Sayfası Testi

Site yüklemesini farklı cihazlar ve farklı bölgelerden kontrol etmek doğru olacaktır. Test, Web Sayfası Testi kullanılarak yapılabilir.

Hizmet tamamen ücretsizdir.

Ekran Sineği

Özel bir mobil geliştirme aracı kullanarak sitenin nasıl görüntülendiğini kontrol edebilirsiniz. Hizmet, siteyi mobil cihazlarda görüntülenecek şekilde siteyi görüntülemek için tasarlanmıştır, ancak sorunu çözmek için bir tarayıcı kullanmak yeterlidir.

Araç ücretsizdir.

Adobe kenar incelemesi

Siteyi kontrol etmek için bir cihaz filosu varsa, cihazları kullanabilirsiniz. Siteyi tüm cihazlara yükleme görevi biraz zaman alıyor ancak görev çözülüyor.

Farklı cihazlarda bir site açmak için özel olarak tasarlanmış Adobe Edge Inspect adlı bir uygulama kullanıyorsanız, görev basitleştirilir.

Araç ücretsizdir.

Uygulama çapraz platformdur.

Tarayıcı Yığını

BrowserStack, site geliştiricileri arasında iyi bilinen bir hizmettir. Hizmet, sitenin gerçek cihazlarda uyumluluğunu gösterir.

Araç ücretlidir.

Bing Mobil Testi

Doğrulamak bedava Mobil uyumluluk için bir site, Bing arama motorundan Mobil Test aracı aracılığıyla yapılabilir.
Servis bağlantısı -