Bugün çoğu insan, mobil araçlar aracılığıyla ağa gider - tabletler, telefonlar, bu site optimizasyonu ile bağlantılı olarak da yeni bir seviyeye gider. Kullanıcı gelir ve sitenin mobil cihazlar için optimize olmadığını görürse: Görüntü görüntülenemiyor, düğmeler taşındı, yazı tipleri küçük ve okunamıyor, tasarım semendir -% 100 çıkacak ve başlayacak daha rahat bir başka arıyorum. Ve kaynağın olmadığını, yani, arama sorgusuna karşılık gelmediği bir kene koyun. Bu nedenle, sayfa tasarımı mutlaka çeşitli mobil cihazlara uyarlanmalıdır. Sitenin mobil versiyonu nedir, nasıl yapılır ve uygulanmanın daha iyi olduğu yolu nedir? Bu makalede daha fazlasını okuyun.

Bu nedenle, siteyi mobil versiyonun altına uyarlamanın dört önemli yolu vardır.

Yöntem Birinci - Uyarlanabilir Tasarım

Adaptif şablonlar, ekranın boyutuna bağlı olarak sitenin resmini değiştirmeyi önerir. Kural olarak, standart 1600, 1500, 1280, 1100, 1024 ve 980 piksel olarak ayarlanırlar. Uygulama için sorgular uygulayın. Kendisi değişmez.

Bu yöntemin faydaları şunları içermelidir:

• uygun geliştirme, yapının kendisi ekran parametreleri için ayarlandığından ve herhangi bir güncelleme sıfırdan tasarım gerektirmez, CSS ve HTML'yi düzeltmek için yeterlidir;
• bir URL adresi - kullanıcının birkaç isim ezberlemesi gerekmez, web yöneticisinin çalışmalarını zorlaştıran (bir adresden diğerine yönlendirilmeye gerek yoktur) ve arama motorunun bir kaynağı sıralamak ve sıralamak daha kolay olması gerekmez. tek bir adresle.

Tabii ki, adaptif modeller, bu arada, avantajlardan daha fazla olan dezavantajları vardır. Bununla birlikte, birçok geliştirici bu konsepte, örneğin, Google Corporation, sitenin mobil versiyonu olan Google Corporation'a uyarlanmış bir tasarıma sahiptir. Yani dezavantajlar:

• Adaptif tasarım, mobil cihazdaki aynı görevleri PC'deki gibi desteklemez. Bu, örneğin, bankanın web sitesinin mobil versiyonu, kullanıcının büyük olasılıkla para birimleri veya en yakın ATM'lerin seyri hakkında önemli bilgiler olacağı, o zaman böyle bir tasarım yeterlidir. Ancak, çeşitli bölümlere ve alt bölümlere sahip karmaşık bir yapısal kaynak ise, ziyaretçilere ziyaretçilere yapılması muhtemel değildir.
• Yavaş yük, favori siteyi nefret içinde döner. Bu, özellikle animasyonun, videoların, pop-up pencerelerinin ve diğer aktif elemanların bol miktarda bulunduğu kaynaklar için geçerlidir. Büyük ağırlık nedeniyle, sayfa basitçe "fren" olacak, kullanıcı kızgın ve ayrılır ve sitenin arama pozisyonu düşmektir.
• Mobil versiyonun devre dışı bırakılamaması başka bir ağırlıklı bir kusurdur. Bazı unsurlar böyle bir düzen tarafından gizlenirse, açılabileceği sitelerin aksine ve normal bir etki alanına gitmek için açmak için hiçbir şey yapamazsınız.

Bununla birlikte, sitenin böyle bir mobil versiyonu hızlı, özel beceri ve maliyetler olmadan, kaynağı herhangi bir gadget'lara uyarlamanıza izin verir. Ancak, listelenen eksikliklerin ışığında, karmaşık navigasyon ve animasyon olmadan minimum bilgi ve multimedya içeren küçük, basit kaynaklara uygun olacak şekilde uygun olacaktır. Karmaşık bir site için 2 diğer yöntem uygun olacaktır.

İkinci yöntem, sitenin ayrı bir versiyonudur.

Bu yöntem çok yaygındır ve genellikle başarı ile siteyi bir mobil cihazda algı için daha uygun hale getirir. Özü, uygulamanın altındaki sayfanın ayrı bir sürümünü oluşturmak ve örneğin, M.VK.com olarak ayrı bir URL veya alt etki alanı üzerinde bulunur. Bu durumda, ana işlevsellik korunur, sadece sitenin tasarımına benziyor. Bu yöntemin avantajları açıktır:

• kullanışlı kullanıcı arayüzü;
• sürüm ana kaynaktan ayrı olarak var olduğu için kolayca değiştirin ve düzenlemeler yapın;
• düşük ağırlık nedeniyle, sitenin ayrı bir versiyonu, adaptif bir düzenden çok daha hızlı çalışır;
• Çoğu zaman, sayfanın ana sürümüne mobil cihazla geçmek mümkündür.

Ancak burada hiçbir eksiklik yoktu:

• Birkaç adres - Sitenin masaüstü ve mobil versiyonu. Kullanıcının iki seçeneği hatırlamayı nasıl sağlar? Web sihirbazları genellikle Dexted bir versiyondan cep telefonuna reçete edilir, ancak bu sayfa mobil sürümde mevcut değilse, kullanıcı bir hata alır. Aynı zamanda, 2 özdeş kaynakları sıralaması zor olan arama motorlarıyla da zorluk çekiyor ve bu doğrudan tanıtımını etkiler.
• Sitenin bir bilgisayardan mobil versiyonu, eğer kullanıcı üzerinde bir hata yaparsa, katılım da etkileyebilecek saçma görünür.
• Bu sürüm daha sık delinmiş, masaüstü, kullanıcı çok sınırlı bir işlevsellik alacak. Ancak aynı zamanda, bir şey eksikse, ziyaretçi sayfanın tam sürümüne ulaşabilir.

Genel olarak, ayrı bir mobil site kendini haklı çıkarır ve kaynağı mobil cihazlar için uyarlamanın en yaygın yollarıdır. Muhtemel çevrimiçi mağazalar arasında popülerdir, örneğin Amazon.

Üçüncü Yol - Tasarım Tasarımı

Google arama motoru, mobil tasarımın bu yönünü aktif olarak desteklemektedir. Siteyi telefonun veya tabletin altına uyarlamak için en zor, maliyetli, ancak etkili bir yöntemdir. Bu ress denir. Bu, her cihaz için ayrı ayrı indirilebilecek bir mobil uygulamada bir kaynak hedefleyen bir kaynaktır. Android için - GooglePlay ile ve Apple için - iTunes ile.

Bu tür uygulamalar hızlı, ücretsiz, kullanışlıdır, çeşitli bilgileri barındırma yeteneğine sahiptir, telefonun hafızası ve internet trafiğinin hafızası, siteyi tarayıcıdan ziyaret ederken olduğu gibi yenilmez. Bağlantı her zaman eldeki ekranda olacağı için kolayca devam edeceklerdir ve tarayıcının adres çubuğuna zorlanmış bir ad girmeniz gerekmez.

Elbette, burada ve gelişmekte olan zorluklar gibi eksiklikleri, çok sayıda programcının yüksek maliyeti, birkaç yerleşim seçeneği yapılması gerektiği gibi. Bazen mobil cihaz uygulama tarafından tanınmaz. Düzenli teknik destek gereklidir, eksiklikleri sabitleme. Bununla birlikte, bu seçenek, üretken, kesintisiz çalışmaları nedeniyle önerilen üçün en iyisi olarak kabul edilir.

Mobil Site Yapmanın En Ucuz Yolu

Yukarıdaki yöntemlerin tümü, uzun ve karmaşık, ancak yine de web yüksek lisans çalışmasını önerir. Böyle bir gelişme için akut bir ihtiyaç görmüyorsanız, sitenin basit ve ücretsiz bir mobil versiyonuna uyacaksınız. Daha kolay nasıl yapılır?

Uyarlanabilir tasarım için özel şablonlar (eklentiler) indirin. Örneğin, WP Mobil Dedektörü, WordPress Mobile Pack, WPSMART Mobile ve diğerleri. Siteyi telefonda doğru bir şekilde göstermenize yardımcı olacaklar, sayfayı mobil versiyona daha iyi adapte olmak için düzeltilmeli birkaç ipucu alacaklar.

Tabii ki, bu yöntem ciddi kaynaklar için neredeyse hiç uygundur. Aksine, bu ücretsiz fırsat, küçük ve basit siteler, bloglar, haber yayınları için tasarlanmıştır. Ayrıca, Google arama motorunun yanı sıra Yandex'in, bugün mobil sürümler için ciddi şartlar yarattığını da unutmamalısınız, bu nedenle böyle bir yöntemi kullanarak pozisyonlarını düşürmek için büyük bir şans var.

Bu yöntemle, büyük olasılıkla, reklamcılık ve açılır pankartlar kesilecektir, ancak sayfa hızlı ve "gecikme" olmadan yüklenecektir.

Mobil sürümlerin ilkeleri

Önemli değil, sitenin mobil versiyonu ücretsiz veya web yöneticisi durumunu kullanarak oluşturuldu, RESS sisteminde yapılır veya bir uyarlamalı şablon kullanır. En önemli şey, etkili çalışmaları için, birçok son derece önemli ilkelere uymanız gerekir. Peki, sitenin mobil versiyonu ne olmalı? Verimli, verimli ve üretken nasıl yapılır?

Her şeyi çok fazla kaldırıyoruz

Minimalizm - Sitenin mobil versiyonunun geliştiricisi ne için çalışıyor olmalıdır. Çiçekler, düğmeler, afişler tarafından vurulan ve istenen malzemeyi aramada kırılgan olan bilgileri algılamanın ne kadar zor olduğunu hayal edin. Mobil tasarım basit ve temiz olmalıdır. Uzayı ayırmak için 2-3 renk seçin (örneğin, markalı). Daha iyi, bunlardan biri beyaz ise. Küçük bir ekranın boşluğunu anlaşılır ve okunabilir bölgelere paylaşın. Sanal anahtarlar görülebilir olmalı, böylece kullanıcının nerede basılacağı ve nerede basılacağını açıkça bilmesi gerekir - bu üründür, burada veri dolum için form, burada teslimat ve ödeme hakkında bilgidir.

Masaüstü versiyonunda kullanışlı olan tüm ek seçenekler kullanıcıyı kullanıcıya kolaylaştıracak, burada sadece zorluklar getirecek. Sadece en önemli unsurları bırakın. Animasyon, reklam afişleri, multimedya, büyük olasılıkla, yalnızca iş yerini veya uygulamayı yavaşlatır ve ana şeyden uzaklaşır.

Hizalama

Hizalama seviyesi daha az akut değildir, çünkü bunu yapmak yanlışsa, kullanıcı yalnızca önemli kelimelerin sonunu alır. Genel olarak kabul edilir, sol kenarın ve dikey olarak hizalanmasıdır. Telefondaki haber yayınlarında nasıl kaydırdığınızı hayal edin. Bunu yukarıdan aşağıya doğru yaparsınız, ancak sola veya sağ tarafta değilsiniz.

Bir dernek

Uzun bir geçiş zinciri olasılığı olmadığında, birkaç adımdan birine birleştirmeyi deneyin. Örneğin, site birkaç aşamada veri gerektirir - adı, ardından evin, sokak, apartmanın vb. Adresinin her bir hücrede bulunduğu adres. Kullanıcıyı çok iyi geçinmeye çalışmaya zorlamamak için Küçük hücrelerin, yalnızca 2 isim ve adresi doldurmasını sağlayın.

Ve ayrılma

Bazen, aksine, çok fazla bilgi bağlantısını kesmek gerekir. Örneğin, açılır menüde, teslimat yapıldığı 80'den fazla şehirden oluşan bir listeniz var. Kullanıcının bu büyük listede gezinmesi gerekmediği için onları bölgelerle gruplayın. İmleci bölgesel merkeze veya bölgeye engelleyeceği zaman, şehirlerin bir başka listesi düşecektir.

Listeler

Bu arada, listeler hakkında. İkisi var - alfabetik veya farklı bir düzende ve bir ikame ile düzeltildi. Onların seçimi neyin listeleneceğine bağlıdır.

Kullanıcı tam olarak aradığınızı biliyorsa, sabittir. Örneğin, bir şehir, sayı veya tarih. İkinci seçenek, uzun karmaşık adlar için uygundur veya aynı isimde birçok varyasyonun olduğu durumlar için uygundur ve her biri kullanıcıyı hedefe getirir. Otomatik dağıtım seçeneği, ziyaretçinin yardıma ihtiyacı olduğunda daha sık kullanılır. Örneğin, örgü için site, örgü iğnelerini satın almak için teklifler. Kullanıcı, arama sorgusu "Metal Spins" ve istemide "5 mm", "4,5 mm" örgü iğneleri, vb.

Otokomplete

Bu ürün, özellikle bir şeyin çevrimiçi olarak satıldığı yerler ile ilgilidir ve standart ödeme, teslimat formlarını doldurmak gerekirse, eğer kişi telefondan bir satın alma yaparsa, büyük olasılıkla, büyük olasılıkla Bu, işlem alışverişinin mümkün olduğunca hızlı ve rahat olması gerektiği anlamına gelir.

Bunun için zaten tamamlanmış verileri içerebilir, en popüler cevaplara başvurabilirsiniz. Örneğin, bir bölgede çalışırsanız, bugünün tarihini, nakit ödeme yöntemini, şehri ekleyin. Değiştirilebilirler, ancak hedefe girerseniz, kullanıcının zamanı kaydedilecektir.

Her şey okunur, her şey görünür

Sitenin bir mobil versiyonunu oluşturma, tüm telefonların farklı olduğunu ve vizyonu da unutmayın. Belki de siteniz küçük bir ekrandan görüntülenecektir, bu nedenle fontlar basit ve okunabilir olmalı, düğmeler oldukça büyüktür, böylece başka bir sayfaya ulaşamayacaksınız ve görüntüler ayrı olarak açılmalı, özellikle de İnternetten bahsediyoruz - dergi.

Bazı istatistikler

Sitenin mobil cihazlara adaptasyonu hakkında konuşan, bu sürecin tanıtım için nasıl önemli olduğunu anlamak için istatistiklere başvurmamak imkansızdır.

Sayılar takip ediyor. Günümüzde nüfusun% 87'si, görünüşe göre, en genç çocuklar ve bazı yaşlı insanlar hariç gadget'lar tarafından kullanılır. Ekonomistler, mobil ticaretin gelecek 5 yıl boyunca 100 kez büyümesini tahmin ediyor. Aynı zamanda, mobil cihazlarla çalışmak üzere uyarlanmış sitelerin sadece% 21'i. İnternet trafiğinin ve elektronik ticaret pazarının sadece küçük 5. kısımda işgal edildiği anlamına gelir.

Bu sayıları düşün. Kaynağınızı uyarlamak mantıklı mı? Tabii ki evet. Dahası, bu pazarda çok fazla boş alan olsa da, kendi segmentinizi alabilirsiniz.

Mobil bir versiyona ihtiyacınız olan yer

Mobil versiyonu kullanın, yüksek bir derecelendirmeyi amaçlayan herhangi bir platform için tavsiye edilir. Sonuçta, bu, kullanıcı üzerinde doğrudan bir etkidir, sitenizde kalmak için rahat koşullar yaratır.

Bir mobil versiyon olmadan, var olamazsınız:

• newsports, çünkü telefondan işe ya da incelemeye bakan çoğunluğu.
• sosyal ağlar - Aynı sebepten dolayı, çevrimiçi bir iletişim faktörü var, bu da uygun, anlaşılır bir sohbet oluşturulması gerektiği anlamına gelir;
• referans, navigasyonlu siteler, vb. Bir şey ararken, insanların ele alındığı yerler;
• online mağazalar, alışveriş konusunda zaman geçirmeyen ve mobil internet üzerinden her şeyi satın almayan alıcıları çekme yeteneğidir.

Hapis cezası yerine

Günümüzde, mobil teknolojiler aktif büyüme ve gelişme aşamasındadır, bu nedenle pazardaki liderlik için çabalayın, herhangi bir şirket internet kaynağının tutarlı olmasını sağlamalıdır. Büyüyen kullanıcı istekleri nedeniyle, siteler sürekli yükseltmek ve çeşitli cihazlara uyum sağlamak zorundadır. Bir kişinin bir veya başka bir kaynakta olacağı sakıncalı olması durumunda, ürün veya fiyat hakkında bilgi edemez, bir sipariş verin, teslimat hakkında bilgi edinin, o zaman tüm bunların mümkün olduğu yerleri bulacaktır. Bu nedenle, rekabetçi bir güreşte kazanmak için esnek, kullanışlı, işlevsel ve ilginç bir kaynağa sahip olmak önemlidir.

Android veya iOS web sitesinin mobil versiyonuna yardımcı olacaktır. Bunu yapmak için, yukarıdaki yeniden tasarruf yöntemlerinden birini seçin, bir adaptif şablondur, alt etki alanında yeni bir site oluşturur, serbest şablonları kullanarak veya kullanıcının kolayca gidebileceği bir mobil uygulama oluşturun. ve sayfada olun.

Hepimizin istatistiklerini duyduk: 2014 yıl bir yıldır, daha fazla insan internete erişmek için akıllı telefonlar kullandığında bilgisayarlara veya dizüstü bilgisayarlardan daha fazla. . Sitenizin geride kalmasını istemiyorsunuz, ancak bu mobil internet için bir site programını nasıl programlayabilirsiniz? Her biri avantaj ve dezavantajları olan üç temel seçenek vardır. Bu makalede, sitenizi geliştirmenin en iyi yolunu seçmek için her birinin artılarını ve eksilerini düşünün.

Seçenek 1: Uyarlanabilir Tasarım

Duyarlı tasarım, sayfaların medya istekleri kullanılarak görüntülendiği ekran çözünürlüğünü belirler, ardından elde edilen verilere göre boyut ve sayfa düzenini ayarlar. Google Bu tartışmada onu ağırlaştıran adaptif web tasarımını tercih ettiğini belirtti.

artış :

1. Her sayfanın sadece bir versiyonu. Sayfa, içeriği görüntülemek için cihazın türüne uyarlanır (cihazın türü belirlenir ve ardından çeşitli içerik görüntülenir).
2. Bu yaklaşım site bakımını büyük ölçüde basitleştirir.
3. Duyarlı tasarım, diğer iki seçeneğin yaptığı gibi, kullanıcı aracısının tespitine dayanmaz. Tespit etme Kullanıcı aracısı (Yani. Tespiti Ne Tarayıcı veya Cihaz İstediğiniz Bir Web Sayfası) Kendi içinde fena değil, ancak tamamen değil ve işlemdeki bir başarısızlık varsa, kullanıcılar sitenizin yanlış sürümünü alabilirler. Ek olarak, arama örümceklerini, sitenizi tarama ihtiyacından uzaklaştırır. Kullanıcı aracısı - Sitenizin daha iyi endeksleneceği anlamına gelir.
4. Sitenin bir kural olarak uyarlanabilir tasarımı, tarayıcılara daha hızlı yüklenir. Tüm cihazlar aynı içeriği aldığından, kullanıcı aracısı nedeniyle sorgunun olası bir yönlendirmesini tespit etme işlemi yoktur. Herkes bu hızın önemli olduğunu biliyor.

Eksi:

1. Mevcut siteyi yeniden yazmak için biraz zaman ve işçilik maliyetleri olur. Öyleyse, büyük bir siteniz varsa, adaptif tasarıma doğru hareket en iyi seçim olamaz.
2. Sitenizin konumuna bağlı olarak, cep telefonu ekranındaki içerikleri sıkın oldukça zor olacaktır.
3. Gezinme elemanları her zaman istenen boyutta görüntülenmez ve imleç durdurulduğunda, yüzey elemanları tüm dokunma ekranlarında çalışmaz. Bu, navigasyondaki değişikliklere neden olabilir.
4. Çok sayıda görüntüye sahip adaptif sayfaların yüksek tasarım tepkisinde daha yavaş yüklendiği durumlar vardır.

Duyarlı bir tasarıma sahip bir site seçmeye karar verirseniz, sitenizi çeşitli tarayıcılarda ve cihazlarda kontrol etmenin gerekli olduğunu unutmayın (veya iyi kullanın) Kullanıcı aracısı Siteyi çalıştırmadan önce emülatör).

Uyarlanabilir tasarımın iyi bir örneği bir web sitesidir. İnternet sitesi :

Mobil versiyon sitesi oldukça güzel değiştirir.

Seçenek 2: Dinamik Servis

Dinamik porsiyon veya yeniden yönlendirmenin özü, ilk olarak belirlenmesidir. Kullanıcı aracısı Ziyaretçi (yani, sitenizi görüntülemek için hangi cihazı kullanır), ardından yeniden yönlendirme sunucu seviyesinde istenen ul olarak gerçekleştirilir. Dinamik yeniden yönlendirme birkaç şekilde yapılabilir.

Dinamik yeniden yönlendirmeyi uygulamanın yollarından biri, mobil kullanıcıların ana normal siteden mobil sürümünden yönlendirildikleri tek yönlü yönlendirmedir.

İkinci tip, çift yönlendirici yönlendirme - kullanıcılar mobil sürümden olağan olana da yönlendirildiğinde. Böyle bir yönlendirmeden sorumlu kodun bazı bölümleri bazen kontrol etiketleri denir. Bunu uygularken etiketi gösterir rel \u003d »Alternatif» Her zamanki versiyonda, bir mobil siteye işaret etmek; Ve mobil sitede, etiket bulunur rel \u003d »Alternatif»Sitenin temel tam sürümünü belirtir.

Artıları:

1. Yeniden yönlendirme sunucu düzeyinde yapıldığından, sadece bir tane olacak Url Her sayfa için.
2. Dinamik yönlendirme ayrıca, sabit bir fonksiyon seti içeren, ancak akıllı telefonlar kadar geniş olmayan sıradan cep telefonları için iyi çalışır. Örneğin, cep telefonları tipik olarak uygulamaları indiremiyor, ancak bir kural olarak, belirli web sayfalarına sahip. Büyük fark, cep telefonlarının işlenemediğidir. CSS.Böylece, duyarlı tasarımla iyi başa çıkamazlar. Bu nedenle, izleyicilerinizi ve hangi tür mobil cihazları kullanmaları önemlidir.
3. Mobil kullanıcılarınız için özel olarak sahip olmak istiyorsanız, bu seçenek bunu yapmanıza izin verir, çünkü her zamanki sürümün mobil kullanıcıları ve kullanıcıları farklı kodu görüntüler. HTML..

Eksi:

1. Bu tür bir uygulama, iş miktarını iki katına çıkarır, çünkü mobil cihazlar için ayrı bir site yapmanız gerekir, ayrı bir dizine eklenmiştir. HTML.ayrı gerektiren Seo..
2. Gerekli özel ajan satırları listesi de kalıcı bakım gerektirir, çünkü yeni bir mobil cihaz ürettiklerinde yeni çizgiler eklenmelidir.
3. Sonunda, kullanmanız gerekeceğini unutmayın " Http başlığı değişken"Siteniz dinamik olarak içerik verirse. Başlık, içeriği doğru şekilde almaya yardımcı olur ve sitenin motorunun doğru şekilde önbelleğe alınmasına yardımcı olur. Google, bu başlığın nasıl ekleneceği hakkında ayrıntılı bilgi gösterir ( https://developers.google.com/webmasters/smartphone-sites/details#dynamicserving) .

Seçenek 3: Mobil Web Sitesi

Bu seçenek, adından aşağıdaki gibi, özellikle mobil kullanıcılar için ayrı bir etki alanının oluşturulmasını içerir. En yaygın örnekler m.Domain.ru.veya mobile.domain.ru.. Bu, büyük perakendeciler için popüler bir seçenektir. Bu yöntem, özellikle mobil kullanan ziyaretçiler için içerik geliştirmeyi içerir (ve sunucu seviyesindeki yönlendirme yok).

Artıları:

1. Yüz binlerce veya milyonlardaki sayfa sayısına sahip büyük siteler için, adaptif tasarımın tanıtımı çok fazla çalışmaya neden olacaktır. Bir mobil site durumunda - sitenin mobil versiyonunu (ayrı bir site olarak) yavaş yavaş artırmak mümkün olacak ve iş çok daha az olacaktır.
2. Dinamik yönlendirmede olduğu gibi, mobil cihazlar için site, adaptif bir tasarıma sahip, cep telefonlarında daha iyi görünüyor. Sitenizin demografisine bağlı olarak, bir kriter olamaz; Ancak bazı işletmeler için önemlidir.

Eksi:

1. Mobil siteniz, backlink profilinin herhangi bir pozitif büyümesinden ana siteye fayda görmeyecektir (eğer çift yönlü iletme uygulamadıysanız). Bu nedenle, mobil kullanıcılarınızın sizi organik bir aramada bulmasını istiyorsanız, bu an özel olumsuz olabilir.
2. Mobil siteniz SEO'da bazı ek işler gerektirecektir. Google ve Yandex için ayrı XML Site Haritası kartları göndermeniz gerekecektir. Ek olarak, meta etiketlerinizi düzenlemeniz gerekir. Mobil meta etiketleri, her zamanki versiyonun sitesinden daha kısa olmalıdır.

Mobil sitenin doğru yapıldığında burada bir örnek. Nytimes.com. Masaüstü PC'lerden gelen ziyaretçiler için ana bir web sitesi var:

VE mobile.nytimes.com. Mobil ziyaretçiler için:

Gördüğünüz gibi, içerik bir mobil cihazda okunabilen yapmak için önemli ölçüde yeniden biçimlendirilmiş ve azaltılmıştır.

sonuç

Siteniz için doğru seçimi yapmak için, kendinize ziyaretçilerinizden kaç kişinin siteye erişmek için mobil cihazları kullandığını sormayı unutmayın. Ödeme. Mobil trafiğin toplam yüzdesi% 5 seviyesine yakınsa, muhtemelen mobil için bir tasarım tanıtmak için acele edemezsiniz.

Tahminler haklıysa, mobil kullanımı artmaya devam edecektir. Daha sonra, siteleri mobil cihazlarda doğru bir şekilde görüntülenmeyecek olanlar, arama trafiğinin önemli bir bölümünü kaybeder. Siteleri "insanlar için" yapın ve mutlu olursunuz!

Her yıl ziyaretçiler artan bir şekilde internete giriyor ve mobil cihazlardan alımları yapıyor. Onlarla birlikte, Yandex.Metrics'e göre, Bahar 2016'dan itibaren, sitelerdeki tüm ziyaretlerin% 29'u Rusya'da gerçekleştirilir ve bu rakam sürekli büyüyor.

Son kullanıcının rahatlığı için her zaman yorgun olan arama motorları, çeşitli cihazlara cevap vermesiyle sitelerini yapmanız önerilir. Şimdi, mobil düzenlemede sıraladığınızda, sayfanın akıllı telefonlar / tabletler için uygun olup olmadığı. Bu nedenle, bir site oluştururken, hemen düşünmek daha iyidir. Site zaten var ve çalışırsa, zamana ayak uydurmak ve mobil cihazları kullanarak potansiyel müşterileri kaybetmemek için onu optimize etmek gerekir.

Akıllı telefonlar ve tabletler için bir siteyi optimize etmek için iki seçenek vardır: uyarlanabilir düzen ve mobil versiyon. Bu yollar arasındaki farkın ne olduğunu düşünün, artılarını ve eksilerini öğreneceğiz.

Uyarlanabilir Tasarım

Ana özellik, arayüzün tüm elemanlarının otomatik olarak çeşitli boyutların ekranlarına ayarlanmasıdır. Bu sayede bu tür siteler eşit derecede iyidir ve kişisel bilgisayarlarda, dizüstü bilgisayarlarda, akıllı telefonlarda ve tabletlerde rahatça görüntülenir.

Faydaları:

• site, mevcut ekran çözünürlüğü için her zaman ayarlanır - bir mobil cihazdaki oryantasyonu değiştirirken veya masaüstündeki tarayıcı penceresinde bir düşüşle;
• yöntemleri yapılandırmanıza gerek yok;
• site mobil ihracı olarak daha iyi sıralandı;
• İçeriği çeşitli cihazlar için otomatik olarak ayarlandığından, siteyi yönetmesi kolay;
• tasarruf - Adaptif Web Sitesi Düzeni, mobil cihazlar için ayrı bir sitenin geliştirilmesinden daha ucuza mal olacak.

Dezavantajları:

Bu seçeneğin ana dezavantajı, siteyi yükleme problemini çözmemesidir. Ve bilgisayarda ve bir adaptif siteyi açarken mobil cihazda, aynı miktarda bilgi yüklenir. Bu nedenle, Mobil İnternet'i kullanarak akıllı telefonda veya tablette PC'de açılacak sitenin yavaşça açılacağını dikkate almak önemlidir.

mobil versiyon

Mobil versiyon, iki sitenin oluşturulduğunu varsayar: Akıllı telefonlar ve tabletler için bilgisayarlardan ve mobil cihazlardan görüntülenmesi için ana.

Faydaları:

• uyarlanabilir düzen gibi, mobil versiyon mobil ihracinde daha iyi sıralanır;
• siteye yalnızca akıllı telefonlar ve tabletler için gerekli olan işlevsellik ve içerik gönderme yeteneği;
• menü, navigasyon ve diğer tasarım öğeleri mobil kullanıcıların ihtiyaçlarına göre tam olarak ayarlanabilir;
• ana (bilgisayarlar için) ve mobil versiyonlar birbirinden bağımsız olarak değiştirilebilir;
• hızlı yükleme süresi.

Dezavantajları:

• İki kaynağı aynı anda desteklemek ve yönetmek için kaynakları harcama ihtiyacı, her ikisiyle ilgili bilgilerin uygunluğunu izleyin;
• İçeriği yerleştirirken, hem mobil cihazlara hem de iki kez yayınlanmasına başlamak gerekir: Ana ve mobil versiyonda;
• yöntemleri yapılandırma ihtiyacı;
• İçeriğin çoğaltılmasında sorun - bir makalenin, benzersizliğin göstergesini olumsuz yönde etkiler ve ekranın arama motorlarındaki etkinliğini olumsuz yönde etkiler;
• sitenin mobil versiyonu, büyük yatırımlar gerektirir: mobil sürümünü ve ayrı bir etki alanının satın alınmasını güncelleme, geliştirme maliyetlerini dikkate almanız gerekir.

Karşılaştırmanın sonuçları

Siteyi mobil cihazlar altında optimize etmek için iki seçeneğin yukarıdaki avantajlarına ve dezavantajlarına dayanarak, uyarlanabilir düzene geçmenizi öneririz: Bu seçenek, yalnızca mobil versiyona kıyasla maliyet ve zaman içinde daha az maliyetli değil, aynı zamanda uygun bir şekilde yönetmenizi sağlar. Site.

Nethouse siteleri oluşturmak için deneyim platformu

Nethous bazında, bugün 50.000'den fazla aktif kaynak var: çevrimiçi mağazalar, firmaların ve uzmanların siteleri, leded, portföy ve bloglar. Aralık 2016'da yeni adaptif şablonlar başlattık ve kullanıcılara bilgi kaybetmeden ve kesinlikle ücretsiz olmadan birkaç fare tıklamasıyla onlara gitmelerini teklif ettik.

Bugüne kadar, kullanıcılarımızın yaklaşık% 25'i uyarlamalı şablonlara geçti. Sitelerinin istatistiklerini nasıl etkilediğini görelim.

1. Trafiği arayın.

Kullanıcılarımızdan bazıları, adaptif tasarıma geçişin trafiği olumsuz yönde etkileyebileceğini ve geri yükleninceye kadar beklemek zorunda kaldığını yaşadı. Programlara göre, bunun olmadığı açıktır.

2. Mobil trafiği arayın.

Arama motorları, mobil ihraçta yukarıdaki uyarlamalı siteleri sıralayın ve "Sayfanız akıllı telefonlar için optimize edilmez" dizgisinin uyarlanabilirliği olmadan Sitelerin Masaüstü versiyonunda bile Google. Aşağıdaki grafik şovları, adaptif düzene geçişten sonra, akıllı telefonlardan arama trafiğinin sürekli arttığını göstermektedir.

3. Davranış faktörleri.

Uyarlanabilir tasarım sadece modern trendlerin tüm gereksinimlerini harika ve harikalarla karşılamakla kalmaz, aynı zamanda, bir başarısızlık oranı, görüntüleme ve zamanın derinliği gibi, özellikle mobil cihazlardan gelen trafik için geçerli olan bölge davranışsal göstergelerini de geliştirir. Aşağıdaki grafikler, "şablonun değiştirilmesi" ve "sonrasında" olan Derslerin karşılaştırılmasında davranışsal faktörler hakkındaki istatistiklerde değişiklikler sunar.

Neyin daha iyi olduğunu belirlemek için - adaptif bir tasarım veya sitenin bir mobil versiyonu, önce tüm bunların neden gerekli olduğunu anlamanız gerekir.

Comscore.com'a göre, mobil cihazlardan gelen sitelere bakan kullanıcıların yüzdesi, her yıl daha fazla olur:

Aktif Abone Veritabanı Veritabanı, Dünya, Milyonlar, 2007-2015.

Bu bağlamda, arama motorları için yeni algoritmalar geliştirildi ve ek sıralama faktörleri tanıtıldı: Şimdi, sitenin mobile dostu (mobil cihazlarda görüntülemek için uygun) nasıl bir iadesi dikkate alındı. Google'da, mobil dost algoritması, 2 Nisan 2015'te, 2 Şubat 2016 tarihinde Yandex - Vladivostok'ta başlatıldı.

Mobil cihazlar için sitenin masaüstü versiyonu ve uyarlanmış versiyonu

Arama motorları, site sayfasının mobil cihazlardan görüntülemek için rahat olup olmadığını belirleyin:

• sayfalar, görüntülemek için yatay kaydırma veya ölçeklendirme gerektirmeyen içerik olmalıdır;
• site birçok mobil cihaz üzerinde çalışmayan unsurlar olmamalıdır - Flash, Java uygulamaları ve Silverlight-Plugins;
• sayfalardaki metinler ölçeklendirme olmadan okumasız olmalıdır;
• referanslar birbirlerinden yeterli bir mesafede olmalıdır, böylece kolayca basılabilirler.

En önemli olan arama motorları, web sitelerini açıkça değerlendiriyor - mobil dostça ya da değil.

Google PagesPeed Insights aracını kullanma (https://developers.google.com/speed/pagespeed/), site sayfalarının ne kadar hızlı yüklendiğini ve kullanılabilirliklerini belirleyebilirsiniz. Sayfa değerlendirmesi, "Sayfa Hızı" ve "Kullanıcılar İçin Kolaylık" nda 0 ila 100 puan arasında olabilir, örneğin:

85 puan ve yukarıdaki sonuçlar iyi kabul edilir.

Site sayfası, hizmetin gereksinimlerini karşılamıyorsa, sorun giderme için önerilerde bir rapor verilir, örneğin:

Bu hizmet, ilk tanılama için kullanılabilir ve web sitesinde sorunları tanımlayabilir.

Hangi durumlarda, siteler için mobil veya uyarlanabilir bir sürümü geliştirmek gerekir?

Siteyi "mobil" bir izleyici kitlesi için uyarlamayı anlamak için, kullanıcıların siteye girdiği cihazların bağlamında web analytics sistemlerinde (Yandex.metric veya Google Analytics) üzerinde analiz etmek gerekir. İzleyicinin% 15'inden fazlasının akıllı telefonları veya tabletleri kullanması durumunda, uyarlanabilir bir düzen veya mobil versiyonu geliştirmesi önerilir. Sitenin trafiğini dikkate almak önemlidir. Örneğin, çok sayıda ziyaretçiye sahip siteler için (1 000 000 ve daha yüksek), bu planın bu büyük site trafiğinin bu büyük bölümünü ihmal etmenin imkansız olduğu için bu plan azalır.

Sitenin mobil versiyonu

mobil versiyon - Mobil cihazlarda görüntülemek için uyarlanmış ayrı sürüm veya ayrı bir şablon. Sitenin ana sürümünde olan tüm blokları göstermeyebilir.

"Özel hasta mobil versiyonu: Adres çubuğuna geçerken, URL değişiklikleri -" M. "ön eki eklenir, örneğin: M.Example.ru.

Bilgisayar monitöründe ve bir mobil cihazda görüntüleyin: Mobil versiyon ana'dan farklıdır.

Uyarlanmış bir mobil versiyona sahip bir sitenin örneği: http://www.lamoda.ru/ (m.lamoda.ru).

Sitenin mobil versiyonunun ana avantajları

• Düşük ağırlık ve sonuç olarak, yüksek indirme hızı. Bu, internet erişim hızlarına (GPRS veya zayıf 3G) sahip olan kullanıcılar için gereklidir.
• Seçenek seçimi, hangi sürümün görüldüğü (mobil veya temel) varlığı.
• Siteyi mobil cihazlarda görüntüleme kolaylığı için arama motorlarının gerekliliklerine uygunluk.

Mobil versiyonun dezavantajları

• Sitede değişiklik yapmanız gerekiyorsa, sitenin normal sürümüne ve mobil cihazlara katkıda bulunmaları gerekecektir., Yani iş hacmi 2 kez artar.
• Geliştirirken, içeriğin bir bölümünü terk etmek genellikle gereklidir.
• Sitenin mobil ve ana versiyonu farklı alanlarda olduğundan, ana etki alanının davranışsal faktörlerini geliştirmez, yani SEO-optimizasyon için eksi olacaktır.

Bu, site elemanlarının farklı ekran çözünürlüklü boyutlarını ve konumlarını değiştirdiği web sayfalarının özel bir tasarımıdır. Site, bir PC monitörü, akıllı telefon veya tablet olup olmadığı açık olduğu cihazın boyutuna otomatik olarak uyarlanır. Bu düzen türü sayesinde, site çeşitli cihazlarda uygun ve açıkça görüntülenecektir. Uyarlanabilir tasarım teknolojilerinin kullanılmasıyla, sitenin işlevselliği acı çekmez.

Bilgisayar monitöründe ve bir mobil cihazda görüntüleyin - Uyarlanabilir sürüm anaden farklıdır

Uyarlanabilir bir sürüme sahip bir sitenin örneği: http://www.mvideo.ru/.

Mobil cihazlar için adaptif tasarımın avantajları

• Tüm içerik için bir URL.
• Esnek Arayüz - Herhangi bir ekran genişliği için rahat bir site ekranı yapılandırabilirsiniz.
• Adaptif tasarım, arama motorlarının gereksinimlerini, siteyi mobil cihazlarda görüntüleme rahatlığına sunar.
• Site uyarlanabilir bir sürüme sahipse, davranışsal faktörler mobil cihazlarda daha iyi hale gelir ve sitenin genel göstergeleri geliştirilmiştir. Arama yaparken sıralama için, bu büyük bir artı olacaktır.

Mobil cihazlar için adaptif tasarımın dezavantajları

• Her ekran çözünürlüğü için ayrı site sayfası düzenleri oluşturma ihtiyacı.
• Adaptif versiyon, mobil cihazın aksine normal moda geçilemez. Yani, kullanıcı site ekranının seçimi kalmaz. Dezavantajı, uyarlanabilir sürümde hatalar varsa, örneğin, elemanlar yanlış görüntülenir.
• Yeni bir sayfa şablonu ekleme karmaşıklığı, çünkü uyarlanabilir sürümdeki doğru ekran için yapılandırılmaları gerekecekleri için. Zaten var olan sayfa şablonlarına bilgi eklerseniz, eşleme ile ilgili herhangi bir sorun olmaz.

Daha iyidir: Mobil cihazlar veya sitenin mobil versiyonu için uyarlanabilir düzen mi?

Site için en iyi çözüm, mobil cihazlar için uyarlanabilir düzen kullanmaktır. Birkaç eksikliklere rağmen, adaptif düzeni olan site daha işlevseldir. Ayrıca, sayfa şablonlarının varlığı, içeriğin içeriğinin kopyalandığı mobil versiyonun aksine, içeriğin içeriğinin aksine, gerçekte iki farklı bölge olduğundan, içeriği ekleme basitliğini ifade eder. Büyük bir artı, adaptif sürümün ana sitenin davranışsal faktörlerini geliştirmesidir. Bu, tanıtım ve kullanılabilirlik açısından faydalıdır. Buna dayanarak, istediğinizi uyarlamalı düzen lehine öneririz.