Peki masaustu ve dizustu bilgisayar yerine telefonundan veya tabletinden gelecek ziyaretcileri hesaba kattınız mı? Cevabınız hayırsa ilk bolumde anlatacaklarımızı kesinlikle dinlemelisiniz, cunku fikrinizin değişeceğinden eminiz.
Bununla beraber, hali hazırda bir mobil siteniz bulunuyorsa ve efektif bir şekilde kullanarak ziyaretcileri sitenize cekmek istiyorsanız da aradığınız tum bilgilere oluşturduğumuz bu rehberden ulaşabilirsiniz.
BOLUM 1: WEB SİTENİZ NEDEN MOBİL UYUMLU OLMALI?
Bilgisayarların buyuk ekranlarına gore tasarlanmış bir sayfa, mobil cihazlarda goruntulenirken zorluk cıkarabilir. Kullanıcılar, sitenizde yer alan metinleri telefonun veya tabletin ufak ekranından okumak icin surekli ekranı yakınlaştırmak zorunda kalabilir, sayfalarda yer alan bağlantılar parmakla tıklamak icin fazla kucuk olduğu icin web sitenizde istediği gibi gezinemeyebilir, kotu bir kullanıcı deneyimi yaşadığı icin sitenizden ayrılarak rakip web sitelerine yonlenebilir. Mobil uyumlu surum ise, uygun bir şekilde kurgulandığı takdirde, bu sorunların onune gececektir.
Soz konusu site ister bir e-ticaret sitesi olsun ister kişisel bir blog, ziyaretci kazanmak, hatta kaybetmemek istiyorsa mobile yatırım yapmalıdır.
Mobil Trafiğin Yukselişi
Mobil trafiğin onemi her gecen gun artmakta ve bu yukselişin artan bir ivmeyle devam etmesi beklenmektedir. Aşağıdaki istatistikte de goruleceği uzere, son donemde mobil kullanıcıların sayısı ciddi oranda artmış durumda.
We Are Social ’ın Ocak 2015 yılında yaptığı araştırmanın sonuclarına gore, Turkiye ’de aktif mobil internet kullanıcıların sayısı, nufusun neredeyse yarısına tekabul ediyor.
Benzer şekilde, Turkiye ’de, toplam web sayfası goruntulenme sayısının yaklaşık ucte biri mobil cihazlardan gercekleşiyor.
Şayet sizi ilgilendiren web siteniz uzerinden gercekleştirdiğiniz satışlar ise aynı araştırmanın mobil e-ticaret kullanımına dair kısmı oldukca ilginizi cekebilir. Zira 2015 Ocak ayında gercekleştirilen ankete gore, alacağı urun hakkında mobil cihazlar uzerinden araştırma yapan kullanıcıların toplam nufusa oranı %24, satın almayı mobil cihazlar uzerinden gercekleştiren kesimin nufusa oranı ise %19.
Mobil Kullanıcıların Ne Farkı Var?
Google Analytics vb. araclar uzerinden bir web sitesinin trafiğini incelediğimizde, mobil kullanıcılar ile masaustu kullanıcıların ayrı tutulduğunu goruruz. Bu kullanıcıların davranışları, sitede gecirdikleri sure, ziyaret ettikleri sayfalar, hatta siteye ulaşmak icin kullandıkları anahtar kelimeler birbirinden cok farklı olabilir. Peki kimdir bu “mobil kullanıcılar”?
Mobil kullanıcılar, sayfamızı masaustunden de ziyaret edenlerle tamamen aynı kişiler olabilir. Ancak mobil uzerinde yaptıkları ziyaret yine de farklı ele alınmalı, dolayısıyla bu ziyaretler icin gercekleştirilecek optimizasyonlar da buna gore değişiklik gostermelidir.
Mobil kullanıcıların ihtiyaclarını ve bizden beklentilerini ongormek icin dikkat etmemiz gereken birkac temel nokta var.
Oncelikle, her ne kadar gunumuzde bilgisayarlar mobil cihazlara, mobil cihazlar ise masaustu bilgisayarlara gitgide benzemeye başlamış olsa da aralarında gerek boyut gerek hız gerekse teknoloji bakımından hala pek cok fark mevcut. Dolayısıyla 13 inc bir dizustu bilgisayarda muhteşem gorunen sitenizin 4.7 inc bir akıllı telefonda da aynı keyifli tasarımı ve kolay kullanımı sağlamasını beklemeniz pek mumkun değil. Tıklanamayacak kadar kucuk linkler, okunamayacak boyutlarda yazılmış metinler ve acılamayan veya acılınca kapanması oldukca zor olan pop-up ’lar ziyaretcilerin arkalarına bakmadan kacmalarına sebep olabilir.
Mobil aramaların getirdiği en buyuk farklılıklardan biri de lokasyon bazlı olmaları. Orneğin, bir marka veya urunun ismini aratan kullanıcının evde bilgisayar başındaysa online alışveriş yapmayı veya soz konusu marka/urun hakkında bilgi edinmeyi amacladığını varsayabiliriz. Ancak bu aramayı mobil bir cihazdan gercekleştirdiyse kendisine en yakın mağazaya ulaşma ihtimali daha yuksek olabilir. Dolayısıyla kullanılan anahtar kelimelerin ne ifade ettiği, masaustu ve mobilde buyuk farklılıklar gosterebilmektedir. SEO ’nun temel kaidelerinden birinin kullanıcıların anahtar kelimelerle neyi bulmak istediğini ongormek olduğunu duşunursek, bu, mobil optimizasyonun tamamen farklı olabileceği anlamına gelmektedir. Tabii bunun web sitenizin niteliğine ve ziyaretcilerinizin sizden beklentilerine gore değiştiğini de eklemeliyiz.
Web sitenize gelen ziyaretcilerin mobil cihazlar uzerinden arama yaparken niyetleri farklı olduğu gibi, iceriğinizi tuketirken davranışları da farklı olabiliyor. Artık kullanıcıların mobil cihazlar uzerinden arama yapmasının tek sebebi buyuk ekranlı bir bilgisayara erişimlerinin olmaması değil. Zira hepimiz bilgisayarımızın başında otururken bir yandan akıllı telefonumuzu kullanıyor, yanıbaşımızda bilgisayarımız olduğu halde televizyon karşısında tabletimizle ilgilenmeyi tercih edebiliyor, bazı ihtiyaclarımız icin mobil cihazımızı, bazıları icin ise akıllı telefonumuzu tercih ediyoruz. Farklı cihazları bazen aynı anda bazen de ayrı zamanlarda kullandığımız icin, bu cihazlar arası senkronizasyon da son derece onemli bir hale geliyor. Orneğin bir e-ticaret sitesinde mobilden sepetimize eklediğimiz urunleri bilgisayar başına gectiğimizde de sepetimizde gormek, odemeyi oradan yapmak isteyebiliyoruz.
Google ’ın sesli arama ozelliği mobilin gelecekte daha da artacak onemini ortaya koyuyor. Kullanıcıların mobil cihaz uzerinden sozel bir şekilde arama yapabilmesi, kullanılan anahtar kelimelerden mobil uzerinden arama yapma sıklığına kadar tum arama alışkanlıklarını değiştirmektedir.
21 Nisan ’da Her Şey Değişiyor!
Zaten bir suredir mobil cihazlardan yapılan aramalarda mobil uyumlu siteleri “Mobile-friendly” etiketiyle sunan Google, bu davranışını bir adım oteye taşıdı ve 21 Nisan 2015 tarihinde algoritmasında onemli bir değişikliğe giderek mobil uyumlu sitelere oncelik vereceğini acıkladı. Yani sitenizi Google arama sonucu sayfalarında daha yukarılara taşımak icin yalnızca mobil uyumluluk konusunda calışmalar yapmanız bile yeterli olabilecek. Google ’ın amacı, arama yapan kullanıcıların, kullandıkları cihaz ne olursa olsun cihazına optimize edilmiş web siteleriyle karşılaşmasını sağlamak.
Web sitenizin ne kadar mobil uyumlu olduğunu test etmek icin yine Google ’ın aracından faydalanabilirsiniz.
BOLUM 2: MOBİL SİTENİZİ KULLANICILARA NASIL SUNABİLİRSİNİZ?
Mobil uyumlu web sitenizi tasarlarken dikkat etmeniz gereken en onemli etkenlerden birisi de mobil sitenizi kullanıcılarınıza nasıl sunmanız gerektiği. Bu konuda, tabii ki web sitenizin amacını ve kullanıcı kitlesini net olarak belirleyebilmenin işinizi oldukca kolaylaştıracağı bir gercek. Orneğin, web sitenizin iceriğini olduğu gibi kullanıcınıza aktarmak istiyorsanız responsive design (duyarlı tasarım) tercih etmenizde fayda var. Hem Google ’ın hem de diğer arama motorlarının da tavsiyesi, web sitenizi bu şekilde kullanıcılarınıza aktarmanız yonunde.
Fakat bir haber sitesiyseniz ve tum iceriğinizi sunmaktan ziyade, son dakika haberleri gibi daha cok mobil kullanıcı kitlesine hitap eden icerikleri on planda sunmak istiyorsanız dynamic serving, yani mobil ve masaustu kullanıcılarına aynı URL ’de farklı icerikler sunmak, sizler icin daha kullanışlı olabilir.
Bir diğer alternatif ise mobil ve masaustu versiyonları farklı sitelerde sunmak. Orneğin, m.seozeo.com ve www.seozeo.com gibi. Bunun temel amacı da olcumlemeleri daha rahat yapabilmek ve yoğun icerikli web sitelerini farklı sunucularda barındırmak olabilir.
Bunlar tabii ki biraz da sizlerin tercihinize kalmış metodlar. Daha detaylı bilgilere aşağıdaki başlıklardan ulaşarak web siteniz icin en doğru tercihi yapabilmeniz de mumkun.
1. Responsive Design
Responsive tasarımın oncelikle calışma mantığından bahsetmek istiyoruz. Turkce haliyle duyarlı web tasarımı, ister masaustu ister tablet isterse de telefon ile web sitesine girildiğinde aynı sitenin acılması, fakat CSS kodlarının kullanılarak gorsel ve iceriklerin farklı şekilde sunulmasıdır. Responsive tasarım sayesinde farklı ekran boyutlarına sahip cihazlardaki tarayıcılar, en uygun şekilde web sitesini son kullanıcıya sunar. Fakat oncelikli olarak tarayıcıların bu tasarımı algılayabilmesi adına, dokumanın başındaki meta etiketlerine “viewport” adında bir etiket eklenir. Bu kod aşağıdaki gibidir:
Bu etiket sayesinde tarayıcı, giriş yapılan cihazın cozunurluğunu algılayarak yazıları daha rahat okunabilir şekilde buyutur, gorselleri ise genişliği ilgili cihazın sınırlarını aşmayacak şekilde duzenler. Hatta Google, bunun nasıl olduğuna dair oluşturduğu animasyonda detaylı bir gosterimde bulunuyor.
Responsive tasarımı, Turkiye ’de oldukca verimli bir şekilde kullanan web sitelerinden birisi de Chip.com.tr. Chip ’in sitesinin masaustunde ve bir akıllı telefonda nasıl gorunduğune goz atalım:
Web sayfasının tamamen aynı icerikle fakat farklı boyutlardaki gorsel-metin dengesi ile sunulduğunu gorebiliyoruz. Peki, Google ’ın da kesinlikle tercih edilmesini onerdiği bu tasarımı kullanmanın artıları ve eksileri neler?
Artıları
Yalnızca bir URL'den son kullanıcıya ulaşılması. Kullanım kolaylığı sağlayarak, tek bir URL'den iceriğin paylaşılabilmesi imkanı. Google botlarının web sitesini crawl ederken sadece tek bir siteyi analiz etmesi. Yazılım ekibinin kontrolunu kolaylaştırması. Mobil sitenin sebep olabileceği olası problemlerin onune gecilmesi. Herhangi bir yeniden yonlendirmeye ihtiyac duyulmaması ve bu sayede yukleme zamanının kısalması. Eksileri
Farklı boyutlardaki cihazlara iceriğin sunulması icin ekstra tasarım maliyeti. Mobil ve masaustu sitenin ayrıştırılmaması. Kullanıcı deneyiminin, ayrı tasarlanan mobil siteye gore biraz daha duşuk olma riski. 2. Dynamic Serving
Dynamic serving'de ise web sitesi, mobil kullanıcılar ile masaustu kullanıcılara aynı URL uzerinden gosteriliyor olsa da farklı HTML kodları devreye giriyor ve iki kullanıcıya farklı icerikler sunuyor. Burada dikkat edilmesi gereken en kritik nokta, mobil ve masaustu cihaz kullanıcılarının doğru hedeflenmesi ve aynı şekilde Google botlarının da en doğru bicimde bilgilendirilmesidir.
Şu anda, aktif olarak dynamic serving modelini kullanan cok sayıda web sitesi bulunmasa da, bazı haber siteleri ve kurumsal siteler, bu yontemi tercih edebiliyor. Hepimizin bildiği bir ornek uzerinden gitmek icin Tumblr'a goz atalım:
Tumblr, masaustu kullanıcılarına mobilde sunduğundan daha farklı bir sayfa sunuyor. Buradaki temel amac da mobil kullanıcıları daha cok uygulama kullanmaya yoneltmek. Bu benzer modeli, bircok mobil uygulamanın resmi sitesinde gorebilmemiz mumkun.
Artıları
Responsive'e oranla tasarımda daha ozgur olma ve farklılaşma imkanı. Daha iyi kullanıcı deneyimi sunma imkanı. Tek bir URL'den iki versiyon icin de yayın yapılabilmesi. Eksileri
Teknik altyapı yonetiminin, diğer alternatiflere gore daha zor olması. Her platformdan aynı iceriğe ulaşmak isteyen son kullanıcıların deneyimini duşurmesi. 3. Paralel Site (m.siteadi.com)
Mobil siteyi farklı bir subdomain (URL structure) ve farklı tasarım altında sunmak da sıkca tercih edilen alternatiflerden birisidir. Bu yontem dahilinde de URL yapıları farklı olduğu icin yonlendirme kurgularının oldukca iyi yapılması gerekmektedir. Hem kullanıcıların hem de Google botlarının hangi platformdan ziyaret ettiği, sistem tarafından en doğru şekilde tespit edilmeli ve icerikler bu doğrultuda sunulmalıdır.
Orneğin, mobil Googlebot'un ya da mobil cihazını kullanan bir kullanıcının siteadi.com/urun/abc adresine girmek istediğini varsayalım. Bu durumda, sistemin talebin mobil bir cihaz uzerinden geldiğini anlayarak ziyaretciyi mobil alternatife (buyuk ihtimalle m.siteadi.com/urun/abc) yonlendirmesi gerekmektedir.
Ayrıca dikkat edilmesi gereken diğer noktalardan birisi ise mobil ve asıl URL'ler arasındaki ilişkinin rel="canonical" ve rel="alternate" etiketleriyle bildirilmesidir. Bu da arama motorlarının işini kolaylaştıracak calışmalardan birisidir.
Genellikle buyuk capta e-ticaret sitelerinin sıkca tercih ettiği bu modeli guzel bir şekilde uygulayan Evmanya.com'u ele alalım:
Bu ornekte, farklı iki site farklı domainlerde, farklı kullanıcılara hitap etmekte. Masaustu sitede daha cok slider'lardaki urun tanıtımları, populer kampanyalar ve gunun fırsatları sunulurken, mobil sitede ise oncelikle kategorilerin muşterilere sunulması, mobil kullanıcı deneyimini doğrudan arttırmayı amaclamaktadır.
Artıları
Mobil iceriği, masaustu icerikten ayrıştırabilme fırsatı. Tamamen ozelleştirilmiş tasarımın kullanılmasıyla daha yuksek kullanıcı deneyimi. Diğer alternatiflere oranla daha rahat bir implementasyon surecinin bulunması. Eksileri
Doğru yazılım kurgusu yapılmadığı takdirde external duplicate probleminin oluşması riski. Link değerlerinin ikiye bolunmesi nedeniyle mobil ve masaustu değerlerinin birleştirilememesi. Barındırma ve bakım maliyetlerinin daha yuksek olması. BOLUM 3: MOBİL SİTE TASARIMI
Yukarıdaki yöntemlerden hangisini seçmiş olursanız olun, es geçmemeniz ve tasarım süresince dikkat etmeniz gereken bazı noktalar var. Ancak bunların hepsini uymanız gereken “kurallar” olarak değil de kendi sitenize uyarlanabilecek farklı görüşler olarak ele almanızı istiyoruz.
Benzer Tasarım Dili
Kullanıcılar mobil sitenin daha kompakt, sayfalarının daha ulaşılabilir olmasını bekleyecektir. Ancak tamamen ayrı bir site tasarımı geliştirmek istiyor olsanız bile gerek kullandığınız renklerle gerekse tercih ettiğiniz fontla ziyaretçilere tanıdık görünmeniz oldukça önemli. Baştan aşağı tasarımı değiştirilmiş bir site, ziyaretçilerin aynı sitede olduğundan şüphe etmesine sebep olabilir.
“Mobile First” İlkesi
Eğer fırsatınız varsa önce mobil siteyi tasarlamak, daha sonra bu tasarımı masaüstü kullanıcılara uyarlamak, tam tersini yapmaktan daha kolay ve efektif olacaktır. Çünkü bir iPhone ekranına yerleştirip de monitöre sığdıramayacağınız hiçbir içerik türü olamaz; ancak tam tersi gayet mümkündür. İster duyarlı ister dinamik bir tasarım yapacak olun, öyle bir imkanınız varsa bu tasarımı ilk önce mobil için gerçekleştirmenizi öneriyoruz. Tabii bu mümkün değilse de mükemmel bir tasarım ortaya çıkarabilirsiniz; sadece bunun için daha fazla efor sarf etmeniz gerekebilir. Çünkü zor olandan başlayıp kolay olana entegre etmek her zaman daha verimli olacaktır.
Eğer seçtiğiniz yöntem tamamen ayrı bir site tasarımı kurgulamaksa bu ilkenin anlamlı olmadığını da eklemeliyiz.
Mobil tasarıma başlamadan önce masaüstü sitenizi hayata geçirdiyseniz elbette bunun da avantajları var. Google Analytics ve benzeri ziyaretçi takip araçları sayesinde hangi cihazlardan gelen kullanıcıların hangi linklere tıkladığını, hangi davranış biçimine sahip olduğunu, hangi sayfalarda ne kadar vakit geçirdiğini vb. işinize yarayacak pek çok veriyi elde edip mobil sitenin tasarımında bunlardan faydalanmanız mümkün.
Kullanım Kolaylığı
Daha küçük ekranlı cihazların getirdiği en büyük sorunlardan biri, web sitenizde kullandığınız site içi link sisteminin kullanışsız kalabilmesi. Mouse kullanan kullanıcılar gerek üst menüde gerek footer ’da bulunan linklere tıklayarak sayfalar arasında rahatlıkla gezinebilirken, telefon ekranından kategorilerinize ulaşmaya çalışan ziyaretçiler zorluk yaşabilir.
Dolayısıyla dokunmatik ekranlarda kullanıcıların parmak boyutlarına uygun linkler oluşturmak hayati önem taşımaktadır. Kullanıcıların rahatlıkla tıklayabileceği linklerin 28x28 piksel ebatlarında olması gerektiğini söyleyebiliriz.
Benzer şekilde, mobil bağlantıların zaman zaman daha yavaş olabileceği de hesaba katılmalı. Bir linke tıklandığında kullanıcıya bir feedback vermek, ziyaretcinin sayfanın açılacağına dair umudunu kesip başka sitelere yönelmesinin önüne geçecektir.
Mouse ile bir metin veya görselin üzerine gittiğinizde orada bir link olup olmadığını anlamak oldukça kolay; ancak aynısını maalesef dokunmatik ekranlar için söyleyemiyoruz. Dolayısıyla kullanıcıların etkileşime geçmesini istediğiniz linklerin tıklanabilir olduğunu ifade etmeli, mümkün olan her yerde butonlar kullanmalısınız.
Dropdown menüler, mobilde de işleyişini yitirmez, ancak yine aynı şekilde mouse kullanmayan kullanıcılar burada açılır kapanır bir menü olup olmadığını anlamak için bir işarete ihtiyaç duyacaktır. Üst menüyü dropdown yapmak her ne kadar yerden tasarrufu sağlasa da (ki mobil tasarım için yeri iyi kullanmak oldukça önemlidir) burada kullanışlılığı düşünmek gereklidir.
Mouse nasıl eksikliğini hissettiriyorsa klavyenin yokluğu da aynı ölçüde hissedilebilir. Telefon ve tabletlerin küçük klavyeleri, kullanıcıların yazmaktan olabildiğince kaçınmasına sebep olmaktadır. Dolayısıyla ziyaretçilerinizi uzun metinler yazmaya zorlayacak hamlelerden kaçınmalısınız. Ayrıca klavye aktif olduğunda ekranın yarı yarıya küçülmesi de bir dezavantaj teşkil eder. Ziyaretçilerin doldurmasını istediğiniz bir form varsa bunu mümkün olduğunca çok sayfaya bölerek kısa metinler girip “Sonraki sayfa” vb. tuşlarla sayfalar arası geçiş yapabilmelerini sağlamanız faydalı olacaktır.
Elbette mobilin birçok zorluğunun yanında avantajları da var. Web sitenizde yer alan tüm telefon numaralarının tıklayınca aranabilir olmasını sağlamak, masaüstü sitelerde yakalayamayacağınız bir fırsat; dolayısıyla bunu değerlendirmenizi tavsiye ediyoruz.
Duyarlı Siteler için Tasarım Önerileri
Yukarıda belirtmiş olduğumuz gibi, burada amaç her cihaza aynı HTML ’i sunmak, ancak CSS komutları sayesinde bu içeriği ekran boyutuna göre ayarlamak.
En büyük avantajınız tek bir tasarımla her boydaki ekrana hitap edebilmek olduğu için, bu avantajınızı sonuna kadar kullanmanızı öneriyoruz. Yani sitenizin her türlü cep telefonu, tablet ve bilgisayar ekranından mükemmel görünmesini sağlayabilirsiniz; dolayısıyla kendinizi yalnızca iPhone ekranıyla sınırlamak durumunda değilsiniz.
Burada web sitenizde yer alacak sayfaları tek başlarına birer bütün değil, onlarca unsurun bir araya gelmesiyle oluşan, modifiye edilebilir bir toplam olarak düşünmelisiniz. Ekran küçüldükçe tüm unsurlar küçülmemeli, bazıları küçülürken bazıları şekil değiştirmeli, hatta bazıları kaybolmalıdır. Yani her bir unsurun varlığını ve bicimini koruyacağı minimum ekran boyutunu belirlemeniz gerekmektedir. Dolayısıyla tek bir tasarım kararıyla aynı içeriği telefonda farklı, tablette farklı, bilgisayarda farklı sunmuş olacaksınız.
Tasarım şablonunuzu çıkarırken hangi öğenin ne kadar önemli olduğunu belirleyerek ilk önce hangilerini gözden çıkarabileceğinize de karar vermiş olacaksınız.
Burada dikkat edilmesi gereken önemli bir nokta, ekran küçülse de metin içeriklerin puntolarının küçülmemesi. Böylece aynı ekranda daha az içerik sunmuş olsanız da ziyaretçilerin içeriğinizi okumakta zorlanmasını engellemiş olacaksınız.
Ayrıca her öğenin en çok ne kadar küçülebileceğini de belirlemelisiniz. Örneğin, görseller kullanıcılara fayda sağlamayacak noktaya kadar küçüleceğine, bir yerden sonra görünmeyebilir; böylece görüntü kirliliğinin ve yer israfının da önüne geçilmiş olacaktır. Veya söz konusu görselin sol tarafı daha önemliyse gorselin o kısmının sabit kalması, ekran küçüldükçe gorselin sağ taraftan eksilmesi ve yeni açılan bu yere başka bir öğenin yerleşmesi sağlanabilir. Bu tür kararlar, sayfa tasarımının gidişatına ve sayfa içi önceliklerinize bağlı olarak alınmalıdır.
Benzer şekilde, masaüstünde sol tarafta yer alacak menü, daha küçük ekranlarda içeriğin en üstüne konumlandırılabilir; çünkü sayfa tasarımını dikey olarak ikiye veya üçe bölmek çok kullanışlı olmayacaktır. Bu nedenle cep telefonu gibi küçük ekranlarda her türlü içeriği tek sütunda vermek akıllıca olacaktır.
Dinamik veya Paralel Siteler için Tasarım Önerileri
Burada esas sitenize bağımlı olmadığınız için her türlü kararı almakta özgürsünüz; ancak yukarıda da belirtmiş olduğumuz genel kurallara bağlı kalmanız çok önemli.
Ayrı bir site kurguluyor olsanız da oluşturmuş olduğunuz içeriğin mümkün olduğunca buyuk bir kısmını mobil sitenize dahil etmeye çalışmanızı öneriyoruz.
BOLUM 4: TEKNİK OLARAK DİKKAT EDİLMESİ GEREKENLER
Mobil web sitesi uygulamaya gecirilirken, secilen yontemden belki de daha cok dikkat etmeniz gereken nokta, bu metodu en doğru şekilde sisteme entegre etmek olacaktır. Doğru yapılmayan bir kurgu, hem mobil cihazından websitenizi ziyaret eden kullanıcıları hem de arama motoru botlarını doğru bir şekilde bilgilendiremeyeceği icin ciddi problemler yaratabilir. Bu nedenle, bu işlemlerin aşağıda belirtilen maddeler doğrultusunda dikkatlice kurgulanması gerekmektedir.
1. CSS, JavaScript ve Resim Dosyalarını Erişilebilir Kılın
Mobil kullanımda CSS, JavaScript ya da resim dosyalarının erişimine izin verilmemesi, uzun vadede de listelenme başarısını duşurebilecek, dolayısıyla SEO performansını olumsuz etkileyecek durumlar arasındadır. Bu nedenle aşağıda bahsi gecen maddelere dikkat etmek oldukca onemli gorunuyor.
Google Webmaster Tools dahilinde bulunan "Google gibi getir" aracını kullanarak, Google orumceklerinin sitenizi nasıl taradığını rahatlıkla gorebilirsiniz. Bu sayede, ilgili dosyaların erişime acık olup olmadığını gorebilirsiniz. Bir diğer alternatif de SEO ajansınızdan ya da personelinizden crawl araclarıyla analiz yapmasını talep etmek olabilir. Robots.txt dosyanızın arama motorlarını doğru bir şekilde bilgilendirdiğine emin olun. Manuel kontrollerin yanı sıra, yine Webmaster Tools uzerinden de bu kontrolleri sağlayabilirsiniz. Bu sayede, botların tum ilgili alanlara erişiminin olup olmadığını test etmiş olursunuz. Google'ın hizmetlerinden birisi olan Mobil uyumluluk testi'ni de uygulayarak, web sitenizin uyumlu bir şekilde sisteme gecip gecmediğini tespit edebilir, olası problemlere mudahale edebilirsiniz. 2. Yonlendirmelerin Doğru Kurgulandığından Emin Olun
Eğer web sitenizin mobil versiyonu farklı bir subdomain'de bulunuyorsa bu problemin yaşanma ihtimali olduğunu belirtmemiz gerek. Orneğin, www.siteadi.com/abc sayfasının mobil versiyonunun doğru bir şekilde m.siteadi.com/abc olarak kurgulanmaması, hem son kullanıcının hem de arama motorlarının negatif etkilenmesine neden olacaktır. Bu konuda dikkat etmemiz gereken noktalar ise şu şekilde:
Masaustu versiyonuyla tam eşleşmeyen sayfalara yonlendirmelerin yapılması, en sık karşılaşılan hatalardandır. Google'ın kendi rehberinde acıkladığı gorseldeki gibi, masaustu URL'in her alternatifine girildiğinde (orn: abc.com/ornek), bu sayfanın ilgili mobil versiyonu direkt olarak mobil anasayfaya yonlenmesi, problem yaratan sebeplerin en başında geliyor. Hataları tespit edebilmek adına, Google Webmaster Tools'un Akıllı Telefon Tarama Hataları kısmını dikkatli bir şekilde kullanmanızı oneriyoruz. Bu aracında Google, farklı URL'lerden (anasayfa haricindeki) doğrudan mobil anasayfaya giden yonlendirmeleri tespit ederek, "Hatalı Yonlendirme" sekmesi altında sizlerin bilgisine sunuyor. Bir diğer kritik ve akıllarda soru işareti yaratan nokta ise, mobil bir anasayfa bulunmasına rağmen tum ya da bazı alt sayfalarda bulunmayan mobil sayfanın nasıl idare edilmesi gerektiği. Bu tarafta yapılması gereken işlemi Google kendi rehberinde de acık bir şekilde belirtiyor: "Sitenizdeki bir sayfanın akıllı telefon eşdeğeri yoksa kullanıcıları akıllı telefon sitesinin ana sayfasına yonlendirmek yerine masaustu sayfasında tutun. Bu durumda, hicbir şey yapmamak, yanlış bir şey yapmaktan daha iyidir." Tabii ki bu problemin hic yaşanmaması adına bazı alternatif yontemler de mevcut. Bu yontemlerin başında da responsive tasarıma geciş yapmak geliyor. Fakat, sanıyoruz ki, yalnızca bu hataların yaşanmasını engellemek, koklu bir değişiklik icin yeterli bir sebep olmayabilir.
3. Mobil Uygulamanın Tanıtıldığı Reklamları Doğru Konumlandırın
Yukarıda Tumblr'dan bahsederken de gorduğumuz uygulama indirme reklamlarının doğru şekilde konumlandırılması da oldukca onemli. Bunun temel sebebi de kullanıcıların ya da arama motoru orumceklerinin web sitesine geciş yapamama ya da problem yaşama ihtimali. Dikkat edilmesi gereken en onemli nokta ise şu şekilde:
Mobil siteye yonlenme esnasında cıkan reklam şeklindeki uygulama indirme linkleri, kullanıcı deneyimini ciddi oranda negatif etkileyen ve arama motoru botlarının asıl sayfaya erişimini engelleyebilen bir faktor. Bu nedenle, neredeyse artık bir cok web sitesinin yaptığı şekilde, ust kısımda bir banner olarak indirme linklerinin belirtilmesi ya da tasarım dahilinde bir buton oluşturularak, kullanıcının oradan uygulama merkezine gitmesinin sağlanması gerekmektedir. 4. Mobil Site Haritasını Kullanmayı Unutmayın
Eğer web sitenizin mobil versiyonu farklı bir subdomain'de bulunuyorsa, sitenizin mobil cihazlardaki versiyonuna ozel bir site haritası hazırlanması faydalı olacaktır. Burada temel amac, arama motorlarını doğru bir şekilde bilgilendirmek ve herhangi bir sebeple listelenemeyebilecek ya da site icerisinden linklenmeyen sayfaların mobil site haritası tarafından bulunmasını sağlayabilmektir. Bu konu hakkında ayrıntılı bilgi almak icin buradan yararlanabilirsiniz.
Aşağıda tek bir giriş iceren ornek bir mobil site haritası gorebilirsiniz:
http://mobile.example.com/article100.html
5. Tarama Hatası Olup Olmadığını Kontrol Edin
Sitenizin, Google mobil robotları tarafından ziyaret edildiğinde karşılaştığı hataların listelendiği Google Webmaster Tools'da bulunan Tarama Hataları kısmının sıkca kontrol edilmesi oldukca onemli. Gerek sunucu bazlı hatalar gerekse site icerisinde karşılaşılan ulaşılamayan sayfa hatalarının buradan kontrol edilmesi gerekmektedir ve herhangi bir problemde yazılım ekibi tarafından mudahale edilmesi de oldukca kritiktir.
Akıllı telefon sekmesini kullanarak Google botlarının erişemediği ya da erişmesine rağmen bulamadığı sayfaları gorebilirsiniz.
Dort farklı ana madde uzerinden sizlerle paylaştığımız bu rehber dahilindeki temel amacımız, Google'ın 21 Nisan 2015 tarihinde uygulamaya gecirdiği Mobilegeddon guncellemesinden kÂrlı cıkabilmek adına dikkat etmeniz gereken noktaları gostermekti. Uc farklı tasarım alternatifi uzerinden, farklı uygulamalar ve entegrasyonlarla mobil sitenizi başarılı bir noktaya getirebilmek icin, paylaşmış olduğumuz onerileri dikkate almanızda fayda var.
kaynak https://zeo.org/tr/blog/mobil-seo-rehberi/