Siteniz Mobile Uyumlu değil mi

21 Nisandan itibaren sitelerin mobil uyumluluklarının arama sonuçlarına etkileyeceğini açıklayan ve webmaster tools üzerinden mobile uyumlu olmayan sitelere 01/03/2015 tarihinden itibaren uyarları göndermeye başlayan Google, işi sıkı tutmaya çalışıyor.

Özellikle mobil reklam pazarında Facebook’un yükselen pazar payının artması, kullanıcıların aradıklarını bulduklarından emin olmak isteyen  Google tarafından yapılacak bu güncelleme oldukça faydalı olacak.

Bu yazımda ise sizlere sitelerinizi nasıl mobile uyumlu hale getireceğinizi ve mobile uyumun seo açısından neden önemli olduğunu anlatmaya çalışacağım.

Web Sitem Neden Mobile Uyumlu Olmalı?

Dünya nüfusunun %34’nün akıllı telefon kullandığı bir çağda yaşıyoruz. ( Credit Suisse Global Equity Themes raporu, Kasım 2014. ) Haliyle sitelerin mobile uyumlu olması, kişilerin aradıkları bilgiyi düzgün bulabilmeleri çok önemli. Aradıkları bilgiyi düzgün bulmaklarından kastım, siteye giren kişinin, kullanıcının geldiği cihaza göre web sitesini şekillendirmek önemli. Mevcut ve potansiyel müşterileriniz markanızı birçok farklı cihazda keşfediyor ve her seferinde iyi bir dijital deneyim geçirmeleri gerekiyor! Tüketiciler, markaların kendilerini önemsemelerini isterler, bu yüzden iyi bir kullanıcı deneyimi vermeyen bir markaya denk gelirlerse, bariz olanı düşünürler: “Markanız tüketiciyi umursamıyor.” Bu durum, bir markanın bu zamanda rekabetçi olabilmesi için başarması gereken müşteri deneyimi bulmacasının bir parçasıdır. Mobil Uyumlu Web Tasarım ise bulmacanın dijital ayağına ciddi bir çözüm getiriyor.

Mobil Uyumluluk Nasıl Sağlanır?

Temel fikir, web sitesinin bir kez  tasarlanıp kodlandıktan sonra birçok ekran boyutunda ve formatında olması gerektiği gibi ve düzgün görünecek olmasıdır.

Mobil uyumlu web sitesi tasarımı üç çekirdek bileşenden oluşur:

• Esnek, grid-tabanlı düzen (layout)
• Esnek resimler ve medya (sadece istedikleriniz görünecek)
• Medya sorguları, CDD3 tanımlamalı modülleri ile sağlanabilir.

Bu yazımda; özel yazılımlar için ve wordpress’te kullandığım mobil temaları da sizlerle paylaşacağım.

Mobile Tema mı? Yoksa Mobile Uyumlu, Responsive Tema mı?

Bunu değerlendirirken 2 soruya cevap vermemiz gerekiyor;

– Responsive bir tasarım yeterli geliyor mu?

– Kullanıcılarını istedikleri deneyimler nasıl? sorularının cevaplarını ararken analytics, yandex metrica gibi analiz yapan sistemleri kullanabilirsiniz. Yandex metrica’da tıklama haritalarına bakarak insanların nerelere tıkladığını, neler yaptığını görebilirsiniz. Buda size fikir verecektir.

Fakat şahsi görüşüm; responsive bir tasarım yeterli. Kullanıcılar tam uyumlu bir yazılım istiyorlarsa mobil uygulama yapıp ona yönlendirmelisiniz. Ayrıca m.siteadi.com şeklinde ki subdomainlerin kullanımına da gerek olmadığı gibi yararının olmadığını da belirtmemde fayda var.

Özel Yazılımlar İçin Mobil Uyumlu Hale Getirme

Bunun 3 yolu var;

– Simenty’ye web site adresini yazıp bir sipariş oluşturarak yapabilir,
– Responsive Grid System, Bootstrap yada Mobile Angular UI gibi frameworkleri kullanarak,

– Simenty.com , http://www.onbile.com/create-mobile-website/ veya https://www.dudamobile.com/ tarzı hazır sistemler kullanarak mobile uyumlu hale getirmeniz mümkün. Burada biraz tercih sebepleri maddi ve vakit olayı da ön plana çıkıyor. Framework kullanırsanız ya da yazdırırsanız belirli bir bütçe ayırmanız gerekecektir. Sıfırdan mobile uyumlu hale getirmek masraflı olabilir fakat sitenize faydası büyüktür. Ya da Simenty ile web sitenizi sanki sıfırdan yapabiliyormuşcasına oluşturabilirsiniz fakat bu da özel bir hizmettir tabi ki de.

Benim genelde kullandığım yapılardan bahsedecek olursam yukarıda da bahsettiğim üzere; Responsive Grid System, Bootstrap yada Mobile Angular UI tercih ediyorum. Farklı ve alternatif frameworkleri görmek isterseniz, Mashable’de yayımlanan 20 Exceptional CSS Boilerplates and Frameworks yazısını okumanız faydalı olacaktır.

WordPress’i Nasıl Uyumlu Hale Getirebiliriz?

WordPress gibi hazır CMS Sistemleri kullanıyorsanız, kendinize özel yazılımlardan daha çok şanslısınız. Ben bun yazımda sadece wordpress için neler yapabilirsiniz ondan bahsedeceğim fakat Google’nin diğer CMS Sistemleri için oluşturmuş olduğu “Sitemi nasıl mobil uyumlu hale getirebilirim?” başlığında ki içeriği oldukça yararlı. Joomla’dan tutun Magento’ya kadar bir çok sistem hakkında bilgi verilmiş. Okursanız baya faydalı olacaktır.

WordPress sitenizi mobil uyumlu yapmanızın diğer yazılımlara nazaran daha kolay olduğunu bahsetmiştim. Özellikle son 1 yılda yapılan wordpress temalarının çoğu responsivedir. Yani Hangi cihazla girerseniz girin ona uygun şekilde açılmaktadır. Themeforest gibi platformlardan tema aldıysanız şanslısınız fakat kendinize özel wordpress temanız varsa iki seçeneğinizin olduğunu belirteyim;

– Mobil tema alabilirsiniz. Bu konuda kullanıp önerdiği alternatifleri de paylaşmak istiyorum. Themeforest’te mobil tema etiketi altında toplamda 45 tane tema mevcut.  Fakat hepsi aynı derecede kaliteli ve özenli yapılmış değil ne yazık ki. Benim diğer sitelerim de kullanmış olduğum  ” Aura Premium Mobile Theme ” ve “Moby Elite – WordPress Mobile Theme” temaları oldukça kaliteli ve başarılıdır. Tercih edebilirsiniz. Özellikle Aura Mobil kullanıcı deneyimi açısından güzel başarılı olduğunun altını çizmek istiyorum. Themeforest dışından bir Türk yapımcı tarafından yapılan ” EsenMobile WordPress Mobil Teması” da tercih sebebi olabilir. Gayet kaliteli güzel bir iş çıkartmış arkadaş.  75 TL’ye sahip olabileceğiniz bu temada kurulum desteği de var. Bu yüzden ben çok kodla haşır neşir değilim kurulumu da yapsın diyorsanız tercih etmeniz de fayda var. Ayrıca  Esen Mobil temasını bileşen desteği sayesinde de istediğiniz özellikleri eklemeniz de çok kolay. Bir de türkçe olması avantaj tabii. EsenMobil WordPress temasına ait yönetim paneli videosunu da sizlerle paylaşarak ücretli eklenti önerilerime son veriyorum.

Ayrıca ücretsiz WordPress Mobile uyumlu hale getirebileceğiniz eklentiler var elbette. Önerebileceğim eklentiler; ” WPtouch Mobile Plugin” listenin başını çekse de ” WordPress Mobile Pack ” adlı yeni çıkan eklentiyi  kullanmanızı öneririm. Daha performanslı daha, bir de sunucu taraflı optimizasyon kısmı oldukça güzel ve daha iyi sonuçlar veriyor.

– İkinci seçeneğiniz ise responsive bir tema alarak yolunuza devam edebilirsiniz.

Yukarıda WordPress ve özel yazılımlı sitenizi mobile nasıl uyumlu hale getireceğinizden bahsettim. Sitenizi mobile uyumlu hale getirmek için gereken teknik çalışmaları yaptınız.  Bundan sonra Google’nin Hizmeti Olan ” Mobil Uyumluluk Testi ” ni yapmanız gerekiyor. Eğer siteniz burada mobile uyumlu çıkıyorsa, işlem başarıyla tamamlanmıştır. Bloguma ait analiz sonucunu göreceğiniz üzere sitem responsive bir yapı da olduğu için mobile de uyumlu oluyor. 🙂

Elimden geldiğince 21 Nisan 2015’te Google’nin yapacağı mobil güncellemesinden önce size mobile uyumlu hale getirmenin önemini anlatmaya çalıştım. Yazınının sonuna gelirken Arama Motoru Optimizasyonunda mobil kısım için yapacaklarınızı bununla bitmediğini belirtmek isterim. Bir kaç tüyo vererek yazıyı bitiriyorum. Umarım faydalı olmuştur.

– Cache Eklentisi kullanın ve sunucunun yanıt süresini düşürmeye özen gösterin,

– Resim optimizasyonu önemlidir. Bugüne kadar bir çok yazılım denedim. Çoğu fotoğraf/resim’in kalitesini inanılmaz derecede düşürüyordu. Bu da haliyle kullanıcıyı itebilir, siteden çıkmasına sebep olabilir. Fotoğraf/Resimlerin kalitesini düşürmeden boyutunu düşüre bileceğimiz bir yazılımı sizinle paylaşmak istiyorum; RIOT (Radical Image Optimization) Programın kullanımı oldukça basit. PNG, JPG ve GİF gibi resim uzantılarını destekleyen bu boyutu küçük işlevi büyük canavar programı kullanmanızı tavsiye ederim.

RIOT sadece boyutu düşürmekle kalmıyor! RIOT ile;

– Resim boyutunu ayarlayabilirsiniz,
– Resim kalitesi yüzde olarak kaydırma çubuğu yardımı ile kolayca ayarlayabilirsiniz,
– Orjinal resim/fotoğraf ve en iyileme sonrası oluşturulacak resim/fotoğraf boyutunu görüntüleyebilir ona göre işlemlere devam edebilir ve ya kaydedebilirsiniz,
– Çift görüntüleme paneli ile resim üzerinde yapılan değişiklikler anında görüntülenme avantajı da var,
– Çoklu dosya ile işlem yapabilirsiniz,
– Parlaklık, karşıtlık ve renk ayarlaması gibi temel işlemleri de yapabilirsiniz,
– Tam ekran çalışma imkanı sunmaktadır. (F11 kısayol tuşu ile) RIOT’u http://download.criosweb.ro/download.php?sid=R&type=installer bu adresten kolayca indirmeniz mümkün 😉

– Kullanıcı deneyimini ölçün; siteye gelen kullanıcıların deneyimi oldukça önemli. Bunu test edip ona göre ilerlemeniz gerekiyor.

– Site içi navigasyonu geliştirin; mobil kısımda önem verilmeyen alanlardan bir tanesi site için optimizasyondur. Mobil kısımda navigasyon ve diğer yazılara yönlendirme işlemini titizlikle yapın. Bunu yapmanız hem site içi etkileşimi arttırır hem de site de kalma süresini yükseltir. Bu da size sıralamada pozitif etki eder.