Akıllı telefonlar, hızla günlük yaşamımızın vazgeçilme bir parçası haline geldi. Bugün neredeyse kimse telefonunu yanından ayırmıyor. Bu sebeple mobil kullanımın yoğun olduğu bir dönemdeyiz.
Web sitesi sahipleri için bu, web sitenizin iyi bir mobil deneyim sunmasının zorunlu olduğu anlamına geliyor.
2016 yılında ilk kez mobil internet kullanımı bilgisayar kullanımını geride bıraktı. Ve trend o zamandan bu yana hızla arttı. Dünya genelindeki tüm web sitesi trafiğinin yarısından fazlası artık akıllı telefonlarda gerçekleşiyor.
Tek tek web siteleri için web sitesi trafiğinin dağılımı değişiklik gösterse de, ziyaretçilerinizin yaklaşık yarısı web sitenizi bir telefonun küçük ekranında görüntülüyor olabilir. Mobil uyumlu bir web sitesine sahip olmak artık isteğe bağlı değildir. Mobil ziyaretçilerinizin sitenizde iyi bir deneyimi yoksa, trafiğinizin büyük bir bölümünü kaybedebilirsiniz (ve bu süreçte arama motoru sıralamanıza zarar verirsiniz).
Şimdiye kadar bununla ilgili bir atmadıysanız artık kabul etmenin yazanı geldi, web sitenizin mobil uyumlu olması gerekiyor.
İçerik Tablosu
Web Siteniz Zaten Mobil Uyumlu mu?
Web siteniz son birkaç yıl içinde oluşturulduysa veya güncellendiyse, kullandığınız tasarımcı veya web sitesi oluşturucu, mobil deneyimi en üst düzeyde tutmuş olabilir. Web sitenizi nasıl mobil uyumlu hale getireceğiniz konusunda endişelenmeden önce, web sitenizin şu anda nasıl performans gösterdiğini kontrol edinmek iyi bir başlangıç olacaktır.
Google’ın sunduğu mobil uyumluluk testi aracını kullanarak, hızlı bir şekilde sitenizin mobil uyumlu olup olmadığının yanı sıra, aynı zamanda sayfanın bir akıllı telefon ekranında nasıl göründüğüne dair bir ekran görüntüsü ve mobil deneyimi daha iyi hale getirmek için neler yapabileceğinizle ilgili bir öneri listesi alarak, sitenizde gerekli düzenlemeleri yapabilirsiniz.
Mobil uyumluluk test aracı, web sitenizin çok fazla düzenlemeye ihtiyacı olduğunu söylüyorsa, web sitenizi mobil uyumlu hale getirmek en önemli öncelik olarak ele alınmalıdır. Bunu yapmak, web sitenizin arama motorlarındaki görünürlüğünü artıracak, ziyaretçilerinizin web sitenizde daha uzun kalmasını sağlayacak ve web sitenizdeki dönüşümleri artırmanıza yardımcı olacaktır.
Web Sitenizi Mobil Uyumlu Hale Getirmek için 12 Adım
İşte web sitenizin masaüstü kullanıcılarınız için olduğu kadar, mobil ziyaretçileriniz için de iyi çalıştığından emin olmak için atabileceğiniz birkaç adım.
Web Sitenizi Duyarlı Hale Getirin.
Çoğu web tasarım uzmanı, duyarlı bir web sitesi oluşturmanın hem masaüstü hem de mobil platformlarda iyi çalışan bir site oluşturmanın en iyi yolu olduğu konusunda hemfikir. Bunun nedeni, duyarlı bir web sitesini ziyaret eden kullanıcının hangi cihazı kullanıyor olduğundan bağımsız olarak web sitenizi o an kullanılan ekran çözünürlüğüne uygun bir şekilde görüntüleyebilmesine olanak sağlamasıdır. Ekran çözünürlüğü dinamik olarak değişse bile duyarlı tasarım yeni çözünürlüğe hemen adapte olarak, içeriği ekran boyutuna uygun hale getirerek servis eder.
Başka bir deyişle, bir sayfanın görüntülenme ve düzenleme şekli, cihaz ekranının boyutuna göre değişir. Örneğin, bir masaüstünde bir metin bloğunun yanında görünen bir görüntü, bir akıllı telefona yüklendiğinde bunun üzerinde görünebilir.
Duyarlı tasarım da SEO için iyidir. Google bunu doğrudan tavsiye ediyor .
Kendi başınıza duyarlı bir web sitesi oluşturamayacağınızı düşünebilirsiniz. Ancak, duyarlı tasarım artık bir norm haline geldiğinden, artık birçok araç bunu kolaylaştırıyor.
Veya en kolay şekilde duyarlı şablonlar sunan bir web sitesi oluşturucu kullanın. IHS Telekom’un Sitebaz hazır web sitesi oluşturucusundaki tüm tasarım şablonları zaten mobil cihazlar için optimize edilmiştir. Web sitenizin bir mobil cihazda çalışması için özel bir şey yapmanız gerekmez. Sadece şablonunuzu seçin ve hızlı bir şekilde tüm cihazlarla uyumlu bir web siteniz olsun.
İnsanların Daha Kolay Bulmasını Sağlayın.
İnsanlar genellikle belirli bir şeyi (bir sorunun cevabını, yakındaki bir restoranın adresini veya bir müşteri hizmetleri telefon numarasını) aramak için akıllı telefonlarını kullanırlar. Bu durumlarda, ihtiyaç duydukları bilgileri olabildiğince hızlı ve kolay bulmak isterler.
Mobil ziyaretçilerinizin web sitenize geldiklerinde en çok hangi bilgileri aradıklarını düşünün ve bunları web sitenizin mobil versiyonunda sayfada açık ve kolay bir yere koyun. Ayrıca, insanların web sitenizi ziyaret ettiklerinde en çok aradıkları sıkça sorulan soruları da göz önünde bulundurun. Tüm yanıtları mobil ana sayfanızın başına veya ortasına koymak mantıklı olmayabilir, ancak bir mobil cihazda bulmanın ve gezinmenin kolay olduğundan emin olun. Bunun için sayfanın sonu uygun olabilir.
Mobil ziyaretçilerinizin sitenize geldiklerinde ne aradıklarından emin değilseniz, analizlerinizi kullanın. Google Analytics‘te, Mobil Trafik’i Davranış bölümüne Segment olarak ekleyebilir, böylece mobil ziyaretçilerin web sitenizle nasıl etkileşimde bulunduğunu görebilirsiniz.
Ziyaretçileriniz iletişim bilgilerinizin bulunduğu sayfayı sık sık ziyaret ediyorsa, bunu ana sayfanızın altına ekleyebilirsiniz. Aradıkları bilgileri bulmak için atmaları gereken adımları azaltmak, web sitenizdeki genel deneyimlerini daha iyi hale getirecektir.
Metin Engelleyici Reklamlardan ve Açılır Pencerelerden Kurtulun.
Kullanıcılar web site içeriğini görüntülemeyi engelleyen hiçbir şeyi sevmez. Zaten küçük bir ekranda metin okumaya çalışmak yeterince zorken bir de büyük bir reklam veya açılır pencerenin içeriği kaplıyor olması sayfanın görünümünü engellediğinden, kullanıcılar çok can sıkıcı bir durum ortaya çıkacaktır.
Ziyaretçilerinizin çoğu, pop-up’ı kapatmak için küçük X’i bulmaya zaman ayırmayacak veya X’e tıklayamayacak, iki türlü de ya reklama tıklayıp başka bir web sitesine geçiş yapacak veya siteden ayrılacaklardır. Olumlu bir kullanıcı deneyimi oluşturmak istiyorsanız, bir sayfanın içeriğini tamamen engelleyen reklamlara veya açılır pencerelere izin vermeyin.
Eğer pop-up reklamlar sizin için vazgeçilmez olacaksa, en azından ya mobil kullanıcılar için devre dışı bırakın ya da yalnızca sayfanın alt kısmına kaydırdıklarında görünecek şekilde ayarlayın. Ayrıca reklamı veya pop-up’ı iptal etmek için X’in kolayca bulup seçebilecekleri kadar büyük olduğundan emin olun.
Web Site Hızına Öncelik Verin.
Belki çevirmeli ağ günlerini ve web sitelerinin yavaş yüklenmesini sabırsızlıkla beklemek zorunda olduğunuzu hatırlıyorsunuz. Ancak artık herkes daha hızlı internet hızlarına alıştığına göre, web siteniz çok da iyi olmayan eski günlerin hızında yüklenirse, ziyaretçileriniz sıkılacak ve siteden ayrılacaklardır.
Google’ın mobil yükleme hızları üzerine yaptığı araştırma , çoğu web sitesinin tam olarak yüklenmesinin beş saniyeden fazla sürdüğünü, ancak çok az ziyaretçinin sitenizle etkileşime geçebileceği içerik yüklenmeden önce bu kadar uzun süre bekleyeceğini ortaya çıkardı.
Web sitesi sahipleri, site hızını artırmak için bir dizi taktik uygulayabilir . Mobil cihazlarda hızınızı artırmak için atabileceğiniz bazı önemli adımlar şunlardır:
- AMP’yi (Hızlandırılmış Mobil Sayfalar) Kullanın – AMP, Google’ın mobil cihazlarda web sayfalarınızın yükleme sürelerini hızlandırmak için önerdiği bir çerçevedir. Bir WordPress web siteniz varsa, AMP eklentisini kullanmaya başlayabilirsiniz. Bunun avantajı; sitenizin çok hızlı bir şekilde direkt olarak google tarafından servis ediliyor olması.
- Resimlerinizi ve CSS’yi sıkıştırın –Bir web sayfasının en yavaş yüklenen kısımları, yüksek çözünürlüklü resimleriniz ve CSS gibi büyük ve çok yer kaplayan kısımlardır. Görüntü dosya boyutlarınızı sıkıştırarak web sitesi yükleme süresini hızlandırabilirsiniz , böylece insanların sitede gördüklerinin kalitesini olumsuz yönde etkilemeden daha hızlı yüklenirler.
- Hızlı web hosting planı– Web siteniz varsa iyi bir hosting sağlayıcı ve hızlı bir hosting seçmek performans açısından önemlidir. Başlangıç olarak düşük veya kalitesiz hosting planlarını kullanırsanız negatif sonuçlar ve yavaş yükleme süreleriyle karşılaşabilirsiniz. Mevcut ihtiyaçlarınıza uygun bir web barındırma planına geçerek işleri hızlandırabilirsiniz.
Web Tasarımınızı Basit Tutun.
Çok fazla dağınıklığa sahip karmaşık web siteleri kafa karıştırıcıdır ve ziyaretçilerin mobil ekranda gezinmesini zorlaştırır.
Dağınıklıktan kaçının. İnsanların aradıklarını bulmalarını kolaylaştıran sade, minimalist bir tasarıma sadık kalın. Ayrıca her sayfada yüklenmesi gereken daha az dosya olması sayesinde, basit bir tasarım daha hızlı yükleme sürelerine de katkıda bulunacaktır.
Bu düşünceyi menünüze de uygulayın. Web sitenizde çok sayıda sayfa ve kategori varsa, masaüstü ekranlarda geniş bir menü sunmak mantıklı olabilir. Ancak mobil cihazlarda bunu en önemli seçeneklere indirgemek istersiniz. Yeni web siteleri, menülerini mobil cihazlarda bir hamburger düğmesine tıklandığında gösterir. Bu şekilde mobil ekranda fazla yer kaplamaz, ancak ziyaretçiler ihtiyaç duyduklarında açmak için tıklayabilirler.
Düğme Boyutlarınızı Mobil Cihazlarda Çalışacak Kadar Büyük Yapın.
Herhangi bir boyuttaki düğmeye fare ile tıklamak yeterince kolaydır, ancak küçük bir akıllı telefon ekranında parmaklarınızla “tıklamaya” çalıştığınızda genel olarak tıklamakta sorun yaşarsınız. Özellikle birbirine yakın birden fazla küçük düğme varsa diğerini seçmeye çalışırken diğerine basmak ziyaretçileriniz için gerçek sıkıntıya neden olur.
Ziyaretçilerinizi bu hayal kırıklığından kurtarmanın en iyi yolu, daha büyük düğmeler kullanmaktır.
Sitenize bir düğme eklediğinizde (ve zaten var olanlar için), bunları ne kadar çok mobil cihazda çalışanlarınız ve aileniz arasında gezinebileceğinizi kendiniz test etmek için biraz zaman ayırın. Tüm cihazlarda her düğmeyi seçmenin makul derecede kolay olduğundan emin olun ve değilse, öyle olacak şekilde güncelleyin.
Google mobil uyumluluk testi aracı da eğer tıklanabilir alanlar yeterli büyüklükte alana sahip değilse “tıklanabilir alanlar birbirine çok yakın” uyarısı verecektir.
Büyük Yazı Tipi Boyutları kullanın.
Küçük bir ekranda içerik okumak, yazı tipi küçükse çok daha zordur. Web sayfalarınızda en az 14 piksel yazı tipi boyutu kullanmak en iyisidir, ancak daha büyük fontlar kullanmanın daha iyi olup olmadığını görmek için bunun nasıl göründüğünü test edin.
Standart yazı tiplerine bağlı kalmak da en iyisidir. Ziyaretçinizin tarayıcısının indirmesi gerekebilecek herhangi bir yazı tipi, web sitenizin yüklenmesini yavaşlatır, bu da mobil cihazlarda kötü bir deneyim demektir.
Eğer Hâlâ Kullanıyorsanız Flash Kullanmayın.
Web sitenizde flash kullanmak bir sayfanın yükleme süresini yavaşlatabilir ve flash’ın hiç çalışmadığı çok sayıda tarayıcı ve cihaz vardır. Ne Android ne de iOS cihazları flash’ı desteklemez, bu nedenle herhangi bir şekilde flash animasyon deneyimine bağlı bir web sitesi kurarsanız, mobil kullanıcılarınız dışarıda kalacaktır.
Çoğu tasarımcı bir web sitesinde flash kullanmamak gerektiğini biliyor, ancak sizin siteniz birkaç yıl önce oluşturulmuş ve flash içeriyorsa bunları kaldırmak yeni bir tasarım modeline geçmek en iyisidir. Özellikle son zamanlarda Chrome’un da flash desteğini kaldırmış olması bu konuda daha fazla aksiyon almanız için sizi zorlamaktadır.
Sitenize Viewport Meta Etiketini ekleyin.
Viewport meta etiketi kullanmak mobil cihazlarda web sitesinin nasıl görüntüleneceğini tarayıcıya söylemenin en iyi yoludur. Sayfanız, telefonunuzun küçük ekranında masaüstünüzde olduğu gibi aynı genişlikte açılırsa, her bir metin satırını okumak ve sayfanın farklı taraflarını görmek için garip bir şekilde bir yandan diğer yana kaydırmanız gerekir. Viewport meta etiketi, tarayıcılara sayfanızın genişliğini ziyaretçinin geldiği cihaz türünün ekranına sığdırmasını söyler.
Bunu html’nize eklemek oldukça basittir. Bunu her sayfa için <head>…</head> etiketleri içine yapıştırmanız yeterlidir:
<meta name = ”viewport” content = ”width = device-width, initial-scale = 1 ″>
Formlar için Otomatik Düzeltme’yi kapatın.
Hepimiz her zaman otomatik düzeltmenin sıkıntılarıyla karşılaşırız, ancak buna rağmen, bazı web sitesi sahipleri genellikle otomatik düzeltmenin bir kullanıcının web sitesiyle etkileşimini uygunsuz hale getirebileceği konusunda düşünmezler.
Web sitenizde ad veya adres bilgilerini isteyen formlar varsa, mobil ziyaretçilerinizde bu bilgileri sağlamanın küçük bir yolu, her form alanı için otomatik düzeltmeyi kapatmaktır, aksi takdirde telefonları adlarını veya sokak adlarını olarak değiştirmeyi deneyecektir.
Form etiketlerinde, html’ye autocorrect=“off” ve autocomplete=”off” eklediğinizden emin olun .
Henüz yapmadıysanız, formlarınızın kısa olduğundan emin olun. Ziyaretçilerinizden gereğinden fazla bilgi istemeyin. Hangi cihazda olurlarsa olsunlar, formun doldurulması çok uzun sürerse veya ziyaretçinin paylaşmak istemediği ayrıntılar istenirrse, rahatsız olabilirler.
Masaüstü Görünümüne Geçmenin Bir Yolu’na izin verin.
Mobil ziyaretçilerinizden bazıları, aslında web sitenizin mobil versiyonu yerine masaüstü versiyonunu görmeyi tercih edebilir (özellikle web sitenizin duyarlı bir site yerine mobil bir versiyonunu kullanıyorsanız).
Tercihleri buysa, onlara bunu yapmaları için bir yol verin. Böylece ziyaretçilerinizin web sitenizle en mantıklı şekilde etkileşimde bulunmasını sağlamış olursunuz.
Düzenli Olarak Mobil Test Yapın.
Web sitenizin iyi bir mobil deneyim sunduğundan emin olmak için yapabileceğiniz en iyi şey, mobil cihazınızda düzenli olarak test etmektir. Sık sık, web sitenizi telefonunuzda ve tabletinizde açın ve görülmesi zor veya yapılması zor bir şey olup olmadığını görmek için biraz zaman ayırın. Çalışanlarınız veya arkadaşlarınızdan da aynısını yapmalarını isteyin (çünkü her şeyi yeni gözlerle göreceklerdir).
Ziyaretçileriniz için daha kötü bir deneyim oluşturan küçük sorunları yakalamanın en iyi yolu düzenli test yapmaktır. Sorunları veya kullanım zorluklarını ne kadar hızlı fark ederseniz, gerçekten mobil uyumlu bir deneyim sağlamak için web sitenizi o kadar çabuk güncelleyebilirsiniz.
Web Sitenizi Mobil Uyumlu Hale Getirin
Her şeyi bugün doğru yapsanız bile, mobil cihazların görünümü ve çalışma şekli sürekli olarak değişecek ve bugünün mobil uyumlu web sitesi yarın aynı performansı göstermeyebilir. Test etmeye devam edin, gereken yerlerde yapılaması gereken en küçük düzeltmeleri bile atlamayın. Mobil kullanıcılarınızı öncelikli olarak düşünmeye devam edin bu sayede mobil performans ve genel performansta başarıyı yakalayabilirsiniz.