Eyl 3, 2022 1403 reads

JavaScript SEO Nedir, Nasıl Yapılır?

SEO çalışmaları yapan kişiler tarafından en çok karşılaşılan problemlerden birisi JavaScript içeriğinin arama motorları tarafından keşfedilmemesidir. JavaScript ile geliştirilmiş sitelerle uğraşıyorsanız karşılaşacağınız sorunlar klasik yapıdaki içerik yönetim sistemlerine göre çok daha farklı olacaktır.JavaScript ağırlıklı bir siteyle arama motorunda başarılı olmak istiyorsanız JavaScript SEO çalışmalarını gerçekleştirmelisiniz. Sitenize ait sayfaların doğru şekilde oluşturulduğundan, indekslendiğinden ve arama motoru dostu olduğundan emin olmalısınız.JavaScript Nedir?JavaScript web geliştirme çözümleri düşünüldüğünde oldukça değerlidir. HTML ve CSS bu işin temelidir ama birçok geliştirici JavaScript kullanımından yararlanmak ister. Bunun sebebi, JavaScript kullanılarak siteleri daha etkileşimli hale getirmek mümkündür.JavaScript kullanıldığında sayfalarda yer alan içeriği dinamik olarak güncelleştirmek kolaylaşır. Örneğin sürekli veri akışının olduğu maç skoru paylaşma sitelerinde JavaScript kullanılır. Böylelikle veriler minimum düzeyde gecikmeyle anlık olarak güncellenir.JavaScript olmasaydı söz konusu verileri takip edebilmek için sayfayı sürekli yenilemek gerekirdi. Bu nedenle, HTML ve CSS kullanarak sitenin temelini oluştursanız bile siteyi etkileşimli hale getirmek ve anlık olarak güncelleştirmeler yapmak için JavaScript kullanmanız gerekir.JavaScript SEO Nedir?JavaScript SEO, teknik SEO çalışmalarının bir parçasıdır. JavaScript ile geliştirilmiş sitelerde olmazsa olmazlardandır. JavaScript kullanımı oldukça popülerdir. Özellikle e-ticaret sitelerinde ana içeriğin oluşturulmasında veya benzer ürünlere linkler verildiğinde kullanılır.JavaScript popüler olmasına rağmen JavaScript kullanılarak oluşturulmuş siteler arama motorlarında düşük performans gösterirler. Bunun temel sebebi JavaScript SEO çalışmalarının doğru şekilde gerçekleştirilmemiş olmasıdır.Google Index ve JavaScriptJavaScript kullanımı kullanıcılar açısından oldukça iyidir. Ancak Google gibi arama motorları açısından aynı şeyi söylemek kolay değildir. JavaScript içeriğinin Google tarafından indekse eklenmesi her zaman gerçekleşen bir şey değildir. Google'ın bu konuya yaklaşımı biraz farklıdır.Google JavaScript ile oluşturulmuş bazı içeriği kolayca dizine eklerken bazı içerikleri eklemez. Burada JavaScript içeriğini kullanan sitenin doğru şekilde yapılandırılmış olması önemlidir. Ancak, siteniz HTML ile oluşturulmuş olsa bile benzer durumla karşı karşıya kalabilirsiniz. JavaScript Tarama Zorluğu: HTML sitelerde içerikleri taramak oldukça kolaydır. Arama motoru tarayıcıları her şeyi hızlı bir şekilde tararlar. JavaScript sitelerinde ise tarayıcı siteyi ziyaret eder ama linkleri bulamaz. JS dosyalarını indirir ve oluşturduktan sonra onları inceler. Tarayıcı Sınırlamaları: Google'a ait tarayıcı tüm içerikleri her zaman taramaz. Sitenizde yer alan içerikler çerezlere ve diğer kayıtlı verilere dayalıysa tarayıcı bunları göremez. Bu nedenle Google'ın JavaScript oluşturmada oldukça iyi olduğunu söylemek kolay değildir. Bu zorluklara ve sınırlamalara rağmen Google arama motoru tarayıcısını geliştirmeye devam eder. Google açısından içerik önemli olduğu sürece oluşturmaya değer görülür. Ayrıca Google tarayıcısı oluşturma süreci uzun sürdüğünde onu es geçecek şekilde geliştirilmiştir.JavaScript Kullanımı SEO Açısından Kötü müdür?JavaScript çeşitli SEO problemlerinin keşfedilmesini zorlaştırır. Çünkü Google'ın bir sayfada yer alan her JavaScript kodunu çalıştıracağı kesin değildir. Sitenizi başarıya ulaştırmaya çalışırken ekstra çaba göstermeniz ama en önemlisi JavaScript SEO yöntemlerini kullanmanız gerekir.JavaScript, SEO açısından tamamen kötü değildir. JavaScript kullanımında aşırıya kaçan pek çok sitenin organik görünürlüğü oldukça iyidir. Modern web geliştirme teknikleri düşünüldüğünde JavaScript tıpkı HTML ve CSS gibi bir gerekliliktir.JavaScript SEO Çalışması Şart mıdır?JavaScript ağırlıklı bir siteye sahipseniz JavaScript SEO çalışması şarttır. Bu çalışmalar olmadan site içeriklerinin Google tarafından fark edilmesini sağlamakta zorluk yaşarsınız. JavaScript kullanılan kısımda yer alan içeriğin fark edilmemesi aynı zamanda sayfanın fark edilmemesi anlamına gelebilir.Google günden güne JavaScript içeriğini okuma ve yorumlama konusunda daha iyi bir noktaya gelse bile keşfedilebilir olmak için gerekli adımları atmak zorundasınız. Site içeriğiniz JavaScript ile bağlantılıysa JavaScript SEO yöntemlerini kullanarak onların indekslenmesini sağlamalısınız.JavaScript SEO: Temel GereksinimlerJavaScript ile SEO arasındaki durumu en iyi şekilde anladıktan sonra JavaScript SEO çalışmaları için ilk adımı atabilirsiniz. JavaScript ile geliştirilmiş sitenizin Google'da iyi performans göstermesini istiyorsanız JavaScript SEO çalışmalarına vakit ayırmak zorunda olduğunuzu bilmelisiniz. Google sitenizi taramalı, sitenizin yapısını anlamalı ve değerli kaynaklarını keşfetmelidir. Google sitenizi zahmetsiz bir biçimde oluşturmayı başarmalıdır. Google sitenizi tararken ve oluştururken gereğinden fazla tarama bütçesi kullanmamalıdır. JavaScript SEO konusunda başarılı olmak istiyorsanız bu üç gereksinimi karşılamalısınız. JavaScript oluşturma işlemleri tarama bütçesi açısından ciddi bir yüktür. Google'ın size ayırdığı tarama bütçesini doldurduğunuz zaman bazı sayfalarınız Google tarafından görmezden gelinecektir.Arama Motoru Dostu JavaScript İçeriğiJavaScript içeriğinin Google tarafından fark edilip indekse eklenip eklenmediğini kontrol edebilmek için iki önemli yöntem vardır. En hızlı yöntem "site:" arama operatörünü kullanmaktır. Diğer yöntem ise Google Search Console mülkünü kontrol etmektir. Ancak öncelikle şu kontrolleri yapmalısınız: Google'ın teknik olarak JavaScript içeriğini kolayca oluşturabildiğinden emin olmalısınız. Google Chrome'u açıp siteyi kontrol etmek yeterli değildir. Bunun yerine Google Search Console mülküne gitmeli ve URL Denetleme Aracı yardımıyla sitenizi kontrol etmelisiniz. Kontroller sırasında ana içeriğin görünüp görünmediğini kontrol etmelisiniz. Google'ın benzer yazılar veya benzer ürünler kısmına erişip erişmediğine bakmalısınız. Bu kontroller sırasında sorun olduğunu fark ederseniz JavaScript SEO kapsamında gerekli düzenlemeleri yapmalısınız. Google sitenizi oluşturma konusunda problem yaşıyorsa bunun sebebi zaman aşımı, çeşitli hatalar veya engellenen JavaScript dosyaları olabilir.Gerekli temel kontrollerin ardından sitenizin Google'da olup olmadığını kontrol etmelisiniz. Bunu yapabilmek için "site:https://www.analyticahouse.com/tr/blog/seo-terimler-sozlugu" şeklinde arama yapıp içeriğin Google'da olup olmadığını kontrol etmelisiniz.Kontrol ettiğiniz URL Google'da yer alıyorsa bu durumda detaylı inceleme kısmına geçiş yapabilirsiniz. Sitenizde JavaScript ile oluşturulmuş kısımda yer alan içeriği alıp Google'da arama yapmalısınız. Bu arama sonucunda JavaScript içeriğinin taranıp taranmadığını öğrenebilirsiniz.Şimdiye kadar denediğimiz yöntem en basit yöntemdi. Ancak çok daha gelişmiş bir inceleme yapmak istiyorsanız Google Search Console'a başvurmanız gerekir. Google Search Console mülkünde gerekli incelemeleri yapabilmek için aşağıdaki adımları takip edebilirsiniz: Google Search Console'a giriş yapın ve ardından ilgili URL'yi URL Denetleme kısmındaki araca yapıştırın. Denetlenen URL'yi inceleyin ve JavaScript ile oluşturulmuş içeriğine göz atarak gerekli kontrolleri yapın. Benzer işlemleri sitenizde yer alan farklı URL'ler için gerçekleştirin. Kontrol için tek bir URL'nin yeterli olmadığını unutmayın. Kontroller sırasında JavaScript içeriğinin taranmadığını fark edebilirsiniz. Bunun sebepleri Google'ın tarayıcısının zaman aşımına uğraması, içerikte oluşturma problemlerinin yaşanması, bazı kaynakların atlanması, içeriğin düşük kaliteli olması ve sayfanın fark edilmemesi gibi durumlardır.JavaScript İçeriğinin Google'a UlaştırılmasıJavaScript içeriğini arama motoru dostu hale getirdikten sonra onun doğru şekilde Google'a ulaştırılmasını sağlamanız gerekir. Bu noktada sunucu tarafında oluşturma ve istemci tarafında oluşturma şeklinde iki farklı yöntem kullanılır. Oluşturma İşlemi: Oluşturma site içeriğinin, şablonlarının ve diğer özelliklerinin kullanıcıya gösterilmesi işlemidir. Oluşturma sunucu tarafı oluşturma (server-side rendering) ve istemci tarafı oluşturma (client-side rendering) olarak iki farklı türe sahiptir. Sunucu Tarafı Oluşturma: Sunucu tarafı oluşturma işleminde bir kullanıcı siteye girdiğinde sayfa sunucusu oluşturularak tarayıcıya gönderilir. JavaScript ayrı olarak oluşturulması gerekmediğinden genellikle SEO açısından en uygun yöntemdir. İstemci Tarafı Oluşturma: İstemci tarafı oluşturma performans açısından problemli olabilir. Sayfaların yavaş yüklenmesi genel sayfa sıralamasına olumsuz etki eder. Problem yaşamamak için JavaScript SEO yöntemlerini ve CSS kodlarını etkili bir şekilde kullanmak gerekir. Bazı sitelerde bu iki ana oluşturma biçimi birlikte kullanılır. Bu yaklaşımla dinamik oluşturma (dynamic rendering) gerçekleştirilir. Dinamik oluşturmada siteye kimin eriştiğine bağlı olarak sitenin iki oluşturma tekniği arasında geçiş yapmasına imkan tanınır. Böylece kullanıcılara önceden oluşturulmuş sayfalar sunulur.JavaScript içeriği doğru şekilde sunulduğunda Google, JavaScript kodlarını hemen fark eder ve onları doğru şekilde işler. Google'a ait arama motoru tarayıcısı milyonlarca siteyi taramaya çalışır. Bu nedenle sitelere ayrılan bir tarama bütçesi söz konusudur.Google'ın tarayıcısı JavaScript sitelerini iki aşamalı olacak şekilde ele alır. İlk aşamada tarayıcı HTML içeriğine bakar ve siteyi bununla değerlendirir. Ardından ise oluşturulması gereken JavaScript oluşturulur. Sunucu tarafında oluşturma kullanıldığında sitenin indekse eklenmesi daha kolaydır.JavaScript SEO çalışmalarından yararlanmak isteyen herkesin olabildiğince fazla HTML içeriğini kullanması gerekir. Böylece kritik olan bilgiler tarayıcıya ilk aşamada iletilecektir ve bu bilgilere göre sitenin sıralama alması mümkün hale gelecektir.JavaScript SEO Çalışmalarındaki Yaygın HatalarJavaScript site geliştirmede eşsiz öneme sahip olsa bile doğru kullanılmadığı zaman baş ağrıtıcı olabilir. Site ne kadar iyi olursa olsun, JavaScript hatalı kullanıldığında teknik anlamda yetersizlik söz konusu olacaktır. Bu nedenle JavaScript kullanımında yaygın hatalara dikkat etmek gerekir:HTML'i Görmezden Gelmek: Sitedeki en önemli bilgilerin JavaScript ile değil HTML ile aktarılması gerekir. Arama motoru tarayıcıları ilk HTML verilerini işlerler. Sitenizin hızlı bir şekilde dizine eklenmesini istiyorsanız kritik bilgileri HTML ile oluşturmalısınız.Linkleri Hatalı Kullanmak: Linkler insanların sitenizle daha iyi etkileşim kurmasına yardımcı olurlar. JavaScript kullanıldığında linklerin doğru şekilde yapılandırmanız gerekir. Site JavaScript ile yapılandırılmış ise Google linklerde HTML ögelerinin kullanılmamasını önerir.Google Botlarını Engellemek: Google'ın tarayıcıları ikinci kez sitenize gelmedikleri sürece JavaScript kodlarını algılayamazlar. Bazı geliştiriciler "noindex" etiketini kullanarak bu ziyareti imkansız hale getirirler. Sitenizde bu şekilde bir problemin olmadığından emin olmalısınız.JavaScript ve SayfalandırmaBirçok site sayfalandırma (pagination) yöntemini kullanarak uzun olan içerikleri birden fazla sayfaya yaymaya çalışırlar. Ancak bu sitelerin büyük bir kısmı Google'a sadece ilk sayfayı ziyaret etme izni verirler. Dolayısıyla Google tarama yaparken değerli olan diğer içerikleri fark edemez.Bu hatanın sebebi link yapısıdır. Siteler sayfalandırma yapabilmek için kullanmazlar. Bunun yerine kullanıcının tıklama eylemine bağlı olarak bir sayfalandırma gerçekleştirirler. Sonuç olarak, Google'ın tarayıcısı diğer sayfaları görebilmek için bir tıklama yapmak zorundadır.Google'ın tarayıcısı bir siteyi ziyaret ettiğinde tıklama veya kaydırma işlemi yapmaz. Google'ın bir sonraki sayfayı fark edebilmesi için linklerinin kullanılması gerekir. Linkler bu şekilde kullanılmadığı zaman Google tarafından fark edilmezler ve içerikleriniz keşfedilemez.Hash Kullanımı ve YönlendirmelerJavaScript sitelerinde en çok karşılaşılan durumlardan birisi hash (#) kullanılarak URL oluşturmaktır. Google, hash kullanılan bir sayfayı tarama konusunda sorun yaşayabilir. Doğru URL yapısını kullanarak Google'ın işini kolaylaştırmanız gerekir.Hatalı URL: https://www.analyticahouse.com/tr/#/seo-terimler-sozlugu Hatalı URL: https://www.analyticahouse.com/#seo-terimler-sozlugu Doğru URL: site:https://www.analyticahouse.com/tr/blog/seo-terimler-sozlugu Belirtilen türde hatalı URL kullanmanız durumunda çeşitli tarama problemleriyle karşılaşmanız oldukça olasıdır. Küçük bir detayı bile es geçtiğiniz zaman JavaScript SEO açısından sorunlu bir adım atmış olursunuz. Bu tür durumlarla karşılaşmamak için gerekli kontrolleri yapmalısınız.Hash kullanımına ek olarak çeşitli yönlendirmelere dikkat etmelisiniz. Sitenizdeki yönlendirmeleri JavaScript yoluyla yapıyorsanız çeşitli sorunlar yaşayabilirsiniz. Bu nedenle yönlendirmeleri sunucu tarafındaki 301 yönlendirmeleriyle yapmanız çok daha doğru olacaktır.JavaScript SEO çalışmaları teknik SEO çalışmalarının bir parçasıdır. Teknik SEO konusunda sitenizi iyileştirmeye çalışırken işin JavaScript yönünü unutmamanız gerekir. Her hatanın sorumlusu JavaScript olmayabilir. Bu nedenle doğru SEO denetimleri gerçekleştirmek çok önemlidir.

Eyl 3, 2022 1036 reads

2022 UI Tasarım Trendleri

2021 tasarım dünyasında pek çok anlamda yeniliklerle dolu geçti. Metaverse’ün piyasaya çıkmasıyla birlikte trendlerde ciddi değişiklikler görülmeye başlandı. UI tasarım trendleri konusunda karşımıza çok farklı başlıklar çıkan 2022 senesinde, kullanıcı arayüz tasarımı ve kullanıcı deneyimi konusunda yeni deneyimler yaşatmaya devam ediyor. Dijitalle gelişen deneyimler “ui nedir, ux nedir, ui ve ux farkı nelerdir” gibi soruları hayatımıza dahil etti. Başlıklara geçmeden önce kısaca açıklamak gerekirse; UI, user interface yani kullanıcı arayüzü demektir. Kullanıcının arayüzde konforlu şekilde vakit geçirmesini sağlayan tasarımlar bütünü olarak isimlendirilebilir. Ux tasarımı ise user experience yani “kullanıcı deneyimi” anlamına gelmektedir. UI tasarımı tamamen arayüzün nasıl göründüğü ve tasarlandığı ile ilgiliyken, ux tasarımı kullanılacak arayüzü kolaylaştırmayı, daha efektif kullanılır hale getirmeyi ve konforunu arttırmayı hedefler. Dolayısıyla hem kullanıcı arayüz tasarımı hem de kullanıcı deneyimi tasarımı, konforlu bir deneyim için aynı düzlemde ilerleyen başlıklardır. Tüm bu deneyimler için her sene gelişen ve değişen başlıklar var. 2022 boyunca sıkça karşımıza çıkan ve çıkmaya devam edecek olan grafik tasarım akımlarına göz atalım.Minimalizm ve SadeleştirmeUzun zamandır tanıdığımız minimalist yaklaşımı 2021 gibi 2022’de de tasarımlarda sıkça görüyoruz. Minimalizm yalnızca tasarımlarda değil hayatın her alanında; hatta hayat biçimi olarak da karşımıza çıkıyor. Son zamanlarda sıkça duyduğumuz “hayatını minimalize eden / sadeleştiren insanlar” topluluğu gittikçe büyümeye devam ediyor. Özellikle büyük teknoloji şirketlerinin benimsediği minimalizmi yakından incelemek için Apple, Meta, Oculus gibi markaların arayüzlerine göz atabiliriz. Mümkün olan en sade tasarımların yer aldığı ve objelerin boşlukta süzüldüğü bu trend, her geçen sene daha çok büyüyerek varlığını ui trendleri içerisinde de sürdürmeye devam ediyor.BrütalizmSıkça gördüğümüz yoğun degradeler ve sevimli 3D objeler ve gölgelere karşın brütalizm, sadeliğini ve netliğini koruyor. Brütalizm; keskin ana hatları, cesur tipografisi, düz tasarımı ve zıt renkleriyle gerçekliği önümüze seriyor. Bu akımda bolca ince hatlı detaylar, net görseller ve farklı tipografiler yer alıyor. Son olarak Spotify Wrapped’da gördüğümüz bu ui trendi ile daha sık karşılaşmaya devam edeceğiz gibi görünüyor.NFT ve Demokratik SanatGenelde insanların anlamakta zorlandığı NFT’ler hayatımıza son sürat girmeye ve bizi büyük bir çılgınlığın parçası haline getirmeye devam ediyor. Artık yarattığımız çevrimiçi görselleri satabilir ve bunlardan para kazanabilir duruma geldik. Bu, herkesin dahil olabileceği ve neredeyse her şeyin sanat olarak tanımlanabileceği anlamına gelen akımda herhangi bir sınırlama bulunmuyor. 2022 UI trendleri arasında sıkça duyduğumuz başlıkların bir araya geldiği hissini veren bu akımda içeriğe sanatçı karar veriyor. NFT ve demokratik sanat bolca kullanıcı deneyiminde varlığını artırmaya devam edecek gibi görünüyor.Kleymorfizm 3DBu zamana kadar bildiğimiz 3D artık farklılaşıyor. Daha basitleşmiş bu versiyonu ise Kleymorfizm diye adlandırıyoruz. Kleymorfizm’de objelerin üzerindeki bol ışık-gölge etkisi, çılgın renk geçişleri ve hissettirdiği soft doku bizi gerçek sanallığın içine sürüklüyor. Özellikle bir süredir bu akım mobil uygulamaların UI tasarımlarında da yerini sıkça almaya başladı. Teknoloji şirketleri tarafından sıklıkla mobil ve web tasarımlarda kullanılmakla birlikte, çoğu zaman “oyun” hissiyatı da vererek teknoloji ile iç içe bir görsellik yaratıyor. Dolayısıyla bu akım oyun şirketlerinin UI tasarımlarında da sıkça kendini gösteriyor.Vahşi TipografiGeçmiş zamanda tasarımcılardan beklenen ve onların da sıkça doğru bilerek yaptığı şey “birbirini takip eden, mutlak bir düzen içinde olan ve dinamizmi değişmeyen fontlarla” tasarımlar oluşturmaktı. Fakat şu an tasarımda yazıları dilediğimiz gibi süsleyebilir, harfleri yatırabilir, uzatabilir, kesebilir ve koparabilir hatta emojilerle bile yer değiştirebilir olduk. Tüm bunların kullanım alanları birbirinden farklılık gösterirken, bizim daima okuyucunun rahat etmesini ve konforlu bir deneyim yaşamasını göz ardı etmemek gerektiğini unutmamalıyız.Vahşi tipografi adının da hissettirdiği gibi; net ve keskin anlatımlarda sıkça tercih ediliyor. UI ve UX tasarım dünyasında ise yerini sağlamlaştırarak kullanımını sürdürmeye devam ediyor. Birçok oyun şirketinin de faydalandığı bu akım, UI trendlerinde yerini kaptırmamak konusunda iddialı görünüyor.Çevreye Duyarlı “Karton” StiliToplum olarak bilinçlendikçe geri dönüştürülebilir olan her ürüne karşı ilgimiz daha çok artıyor. Tüm bunlar olurken, bu düşüncenin geri dönüştürülebilir markaları da desteklediğini söyleyebiliriz. Her anlamda hayatımızda büyük bir yer edinen bu “geri dönüştürülebilirlik” akımı, UI trendleri arasında da yerini sağlamlaştırdı. Kullanıcı arayüz tasarımlarında ise dönüşümü vurguladığı için, fonları “kartonu” temsilen gri renk kullanım sıkça görülüyor. Renkler genellikle soğuk ve yumuşakken, ilgi çekici ve canlı 3D nesneler kullanılmıyor ve her şey doğallıktan yana ilerliyor. Bu trend gerçek yaşamı ve doğallığı gözler önüne sererken, UI ve UX dünyasında karşısına çıkan kullanıcılara keyifli bir deneyim yaşatıyor.HolografiGeçmişte çok göz yorduğu, rahatsız ettiği söylenen ve aşırı bulunan holografik desenler 2022 yılında tasarım trendlerinin ortasında yer almaya devam ediyor. Bu tasarım trendi; metaverse, hologram ve VR dünyasına çok iyi uyum sağlıyor ve yaratıcılığı destekleyerek en üst seviyeye çıkarıyor. Renkli degrade ve neon objeler, göz alıcı parlak şekiller bu trend için vazgeçilmez kullanımlardır diyebiliriz. Ayrıca kripto dünyasında da tüm bu fütürist görünümünden dolayı sıkça kullanılan holografi; kullanıcı arayüzü tasarımlarında da sıkça kendini göstermeye devam ediyor. Holografi, aynı zamanda oyun dünyasını yansıtmak için de son zamanlarda bolca kullanılan bir akım haline geldi. Oyunların büyülü dünyasında kullanılan farklı renkler ve desenler, göz alıcı ışıklar, yansımalar ve ışıklı görüntü; hayal dünyasının büyüleyiciliğine sürekli bir destek sağlıyor diyebiliriz.Aura ArkaplanlarBu arkaplan tarzı; genellikle tasarımcıların vurgulamak istediği alanın arkasında kullandığı, soft renk geçişlerinde oluşan fırça darbeleri bütünü olarak değerlendirilebilir. Aynı zamanda sanal dünyada boşluğu anlatmanın renkli ve dikkat çekici hali de diyebiliriz. Bu trend için soft fırça takımı, yumuşak renkler ve biraz blur yeterli görünüyor. Renk kullanımı ve tarzı tamamen tasarlayanın inisiyatifinde olan bu akım kullanıcıya yansıyan cam etkisini verirken, görsel beğeniyi de arttırdığını söyleyebiliriz. Son zamanlarda sıkça karşımıza çıkan aura akımını zaman geçtikçe birçok sektörde artarak görmeye devam edeceğiz.Cam morfizm ve Camdan Esinlenilen ÖğelerGerçek dünyada cam objelerden bildiğimiz bir trend cammorfizm. Cam ve arkasındakiler, camın verdiği blur etkisinin yüksek hazzı bu trendin tam olarak kendisini ifade ediyor. Arka plan bulanıklığı, yarı saydam nesneler ve renklerin yumuşak karışımı dikkat çekici ve bir o kadar da akıcı görünüyor. UI dünyasında bolca kullanılan bu trend; kullanıcıyı tasarım farklılığı ile etkilerken arayüz içerisindeki deneyimi konforlu hale getiriyor. Daha çok dijital bankacılık, oyun ve son zamanlarda da finans sektöründe bolca karşımıza çıkan bu akım, birçok farklı alanda varlığını sürdürmeye devam edecek gibi görünüyor.

Eyl 3, 2022 3501 reads

4 Maddede SEO Uyumlu İçerik Nasıl Yazılır?

Organik trafiği artırmayı hedefleyen ve arama motorlarının parametrelerine uygun olarak yapılan iyileştirmelere, search engine optimization (SEO), yani arama motoru optimizasyonu adı verilir. SEO optimizasyonlarının ve arama motorlarının önceliği kullanıcılara iyi bir deneyim ve iyi bir içerik sunmaktır. Arama motorları, iyi içerik sunan websitelerini daha üst sıralarda sıralayarak bu siteleri ödüllendirir. SEO uyumlu içerik: arama motorları parametrelerine uygun olarak optimize edilmiş, bir ana anahtar kelime etrafında şekillenen, doğru hedef kitleye hitap eden, kullanıcı niyetine cevap veren, kullanıcıya fayda sağlayan, kolaylıkla okunabilir, dikkat çekici,  marka diline uygun, görseller ve infografikler ile zenginleştirilmiş,  kapsayıcı, doğal ve özgün bir içeriktir.  SEO Uyumlu İçerik Nasıl Yazılır?SEO uyumlu içerik yazılmadan önce, yazılırken ve yazıldıktan sonra dikkat edilmesi gereken adımlar bulunur. Bunlardan ilk ikisi içeriğin konusunu belirlemek ve ardından ana hatlarını oluşturmaktır.1. İçeriğin Konusunu BelirleyinSeçtiğiniz konu hedef kitlenizin kolaylıkla tüketebileceği, ilgisini çekecek, niche konular olmalıdır. İçeriğinizin websiteniz ve sunduğunuz hizmetlerle ile ilgili olması önemlidir. Arama motorları, kullanıcılara sundukların içeriklerin, kullanıcılara değer katmasına özen gösterir. Bu yüzden içerikler, güncel ve yeni bilgiler sunmalıdır. Ortak hedef kitlesine sahip olduğunuz rakipleriniz sayesinde hedef kitlenizin ilgisinin neleri çektiğini görmeniz mümkündür. Ayrıca haber sitelerini ve forumları inceleyerek hedef kitlenizin aradığı ancak cevap bulamadığı sorulara ulaşabilirsiniz.Kısacası içeriğinizin konusunu belirlerken: rakip markaların blog sayfalarını, forum ve haber sitelerini inceleyebilirsiniz. 2. Anahtar Kelimeleri Analiz Edin ve AraştırınKonuyu seçtikten sonra, konunuz ile alakalı olabilecek anahtar kelimeleri tespit etmelisiniz. Anahtar kelimeleri ana anahtar kelime ve yan anahtar kelime olarak ikiye ayırmak mümkündür.İçerikleriniz arama motorları tarafından indekslendikten sonra ilgili sorgularda sıralanır. Öncelikli olarak sıralanmak istediğiniz sorgu, sizin ana anahtar kelimeniz olacaktır. Bu anahtar kelimeyi, bir içeriğin ana konusu olarak düşünebilirsiniz. Ana anahtar kelime içeriğinizi, en doğru, bilgilendirici ve doğal şekilde özetleyen ve içeriğinizle en alakalı olan kelime öbeğidir. Ek olarak, tıpkı yan başlıklar gibi, yan anahtar kelimeler bulunur. Bu kelimeler, içerik ve ana anahtar kelime ile alakalı ve içeriği destekleyici konumda olmalıdırlar. Örneğin “arama motoru optimizasyonu” kelimesini ana anahtar kelime olarak belirlersek, “organik trafik” bir yan anahtar kelime olacaktır.İçeriğinizin doğru kişilere ulaşması için anahtar kelimeleri seçerken göz önünde bulundurmanız gereken üç temel nokta bulunur: kullanıcı niyeti, aranma hacmi ve rekabet. Seçtiğiniz anahtar kelimeler, içeriğinizin hitap ettiği kullanıcı niyetine ne kadar uygun olursa, içeriğinizin doğru kişilere ulaşması o kadar kolay olacaktır. Anahtar kelimelerin kullanıcı niyetine uyup uymadığını kontrol etmek için en iyi kaynak arama motorlarıdır. Seçtiğiniz anahtar kelimeyi aratıp arama sonuçlarının içeriğinizle ne kadar uyumlu olduğunu tespit ederek anahtar kelimenizin kullanıcı niyetine uygun olup olmadığını ölçebilirsiniz.Örneğin; içeriğiniz “dijital pazarlama trendleri” üzerine olacaksa, içeriğinizde öncelikli olarak  “dijital pazarlama” anahtar kelimesini hedeflemek yanlış olacaktır. “Dijital Pazarlama Nedir?” başlıklı içerikler bu sorguda karşımıza çıkmaktadır. Bu sorgunun, içerik konumuza göre fazla genel kaldığını söyleyebiliriz.Aranma Hacmi: Aranma hacmi, bir sorgunun ortalama olarak ne kadar arama trafiği aldığına dair verileri gösterir. Aranma hacminin yüksek olduğu sorgular, insanlar tarafından arama motorları üzerinde daha fazla aranmış ve daha fazla talep görmüştür. Ancak bu, yüksek aranma hacmine sahip kelimeleri kullanarak daha yüksek organik trafik elde edeceğiniz anlamına gelmez. Aksine, bu sorgularda rekabet daha fazladır ve bu sorgularda sıralama almak daha zor olacaktır. Rekabet: Rekabet, bir web sitesini bir sorguda en üst sıraya taşıyabilmek için gerekli olan zorluk derecelerini gösterir. Yüksek, orta ve düşük olmak üzere üç derece bulunmaktadır. Eğer web siteniz yeniyse ve henüz belirli bir ziyaretçi kitlesine sahip değilse, düşük veya orta ölçekli zorluk derecesine sahip olan anahtar kelimeleri tercih etmeniz önerilir.Anahtar kelime planlayıcı olarak adlandırılan, kelimelerle ilgili aranma hacmi ve rekabet gibi verileri size sunan ücretli ve ücretsiz bazı araçlar bulunmaktadır. Bunlardan ücretsiz olanları, Google Ads Keyword Planner (Anahtar Kelime Planlayıcı), Ahrefs Free Keyword Generator ve Answer the Public araçlarıdır. Google Ads – Keyword Planner Arama motorları, kullanıcılara en alakalı ve kaliteli içeriği sunmayı amaçladıklarından dolayı, anahtar kelimeler konusunda en güvenilir olan kaynaklardır. Statista Eylül 2021 arama motorları market payı raporu verilerine göre %86,64 market payına sahip olan Google ise, Google Ads Keyword Planner ile site sahiplerinin yeni anahtar kelime varyasyonlarını keşfetmesini sağlayan ve her anahtar kelime için ortalama aranma hacmini ve rekabet oranını belirten bir araç sunar.Keyword Planner’da verdiğiniz hizmetler veya ürününüz ile en alakalı bulduğunuz terimi girmenizi isteyen bir alan bulunur. Araç, bu alana girdiğiniz terimler ile alakalı önerilerde bulunacaktır. Bu alana birden fazla terim girebilir, sonuçları dil ve coğrafi bölgelere göre filtreleyebilirsiniz. Bu sayede, Keyword Planner ürününüzün veya hizmetinizin kapsamını daha iyi anlayarak hedef kitlenize uygun daha iyi öneriler sunar. Bunun yanı sıra, websitenizin veya rakibinizin URL’ini ekleyerek websitenizin veya rakibinizin hangi anahtar kelimelerde sıralandığını görebilir ve bu anahtar kelimelerde hedeflemeler yapabilirsiniz. “Anahtar kelimeleri hassaslaştır” alanından listelenen kelimeleri “branded” “non-branded” olarak veya ürün veya hizmete göre özelleştirerek filtrelemeniz mümkündür. Bu sayede markaya spesifik olan kelimeleri seçebilir veya seçiminizden çıkarabilir, verdiğiniz hizmete daha uygun seçeneklere ulaşabilirsiniz. “Avg. monthly searches“ alanından anahtar kelimelerin aranma hacimlerini ve “competition” alanından ise kelime bazındaki rekabeti görebilirsiniz. “Avg. monthly searches” alanında belli bir tarih aralığını seçerek anahtar kelimelerin aranma hacmi verilerini görüntüleyebileceğiniz gibi, aynı zamanda bu sorguların gelecekte nasıl performans göstereceklerine dair tahminlere de ulaşabilirsiniz.  Örneğin, yukarıdaki sonuçları inceleyerek “seo” kelimesinin Kasım 2020-Ekim 2021 ayları arasında aylık ortalama olarak 27,100 aranma hacmine ve orta düzeyde rekabet oranına sahip olduğunu görebilirsiniz.  Ahrefs Free Keyword Generator En popüler SEO araçlarından biri olan Ahrefs, Free Keyword Generator adlı aranma hacimlerinin ve anahtar kelime zorluğunun bulunduğu ücretsiz SEO aracı sunar. Tıpkı Keyword Planner’da olduğu gibi, bu araçta da coğrafi bölgelere göre filtreleme yapmak mümkündür. Örneğin, bölgeyi Türkiye seçerek anahtar kelimelerin Türkiye’deki verilerine ulaşabilirsiniz. Ahrefs, Google Ads Keyword Planner’a ek olarak, Google haricinde Bing, Amazon ve YouTube gibi arama motorlarının verilerine de ulaşmanızı sağlar.Ahrefs Free Keyword Generator aracında deyim eşleşmesi ve sorular olmak üzere iki alan bulunur. Deyim eşleşmesi girdiğiniz sorguyu barındıran kelime öbeklerini sunar.“Sorular” alanı ise, sağladığınız anahtar kelimeyle ilgili hangi soruların sorulduğunu gösterir. Hem Sorular hem de Deyim Eşleşmesi bölümlerinde görebileceğiniz KD (keyword difficulty) & Hacim alanları sırasıyla, rekabeti ve aranma hacmini gösterir. KD alanı, logaritmik aralığa sahiptir. 0-10 rekabetin az, 10-31 orta, 31-70 çok, 70-100 ise çok zor olduğunu gösterir. “Güncellenmiş” alanı, anahtar kelimeye dair verilen en son ne zaman güncellediğine dair bilgi sunar. Answer The Public Answer the Public, kullanıcıların Google üzerinden yaptığı aramaları gruplayan, anahtar kelimelerin hangi anahtar kelimelerle kombinlendiğini alfabetik olarak gösteren ücretsiz bir araçtır. Ahrefs & Google Ads Keyword Planner’dan farklı olarak Answer the Public’te kelimelerin aranma hacimlerini ve kelimelerdeki rekabeti görmeniz mümkün değildir. Answer the Public’in bir diğer dezavantajı ise, Türkçe dil desteği sunmamasıdır. Buna rağmen Türkiye üzerinden yapılan arama verilerini sunar. Bölgenizi seçtikten sonra anahtar kelimenizi girerek arama yapabilirsiniz.3. Kullanıcı Niyetini (Intent) AraştırınKullanıcı Niyeti: Kullanıcı niyeti, bir kullanıcının arama yaparken neden bu aramayı yaptığını, yani “niyetini” ifade eder. Bilgilendirici (informational), yönlendirici (navigational), ticari (commercial) ve satın alımsal (transactional) olarak dört temel başlıkta incelenebilir:Bilgilendirici Kullanıcı Niyeti: Burada kullanıcı, bir konu hakkında bilgi edinmek için arama yapar. Genellikle bu sorgular, soru formatında olur veya bu sorgulara “ne, nasıl, neden, ne zaman, nerede, kim?” gibi soru kalıpları eşlik eder. Bir kullanıcının SEO hakkında bilgi edinmek için “SEO nedir?” şeklinde yaptığı aramalar bu kullanıcı niyetine birer örnektir. Bu kullanıcı niyetine genellikle blog içerikleri cevap verir.Yönlendirici Kullanıcı Niyeti: Burada kullanıcı, bir kaynağa ulaşmayı amaçlar. Bu kaynak bir websitesi veya marka olabilir. “AnalyticaHouse”, “Google Search Console” gibi aramalar bu kullanıcı niyetine birer örnektir.Ticari Kullanıcı Niyeti: Kullanıcıların bir şeye satın almadan önce karar verirken yaptığı aramalardır. “En iyi 10 SEO Aracı”, “En ucuz uçak bileti” gibi aramalar bu kullanıcı niyetine birer örnektir. Satın Alımsal Kullanıcı Niyeti: Burada kullanıcılar, satın almaya karar vermiştir ve aramayı satın almak için yapmaktadır. “iPhone 13 satın al.” sorgusu bu kullanıcı niyetine bir örnektir.4. İçeriğinizin Ana Hatlarını Oluşturunİçeriğinizin iskeletini oluşturmak için öncelikli olarak içeriğin: uzunluğuna ve alt başlıklarına karar vermeniz gerekir. SEO uyumlu makaleniz güncel ve güvenilir bilgilerle dolu olmalıdır ve seçtiğiniz konuyu kapsamlı bir şekilde ele almalıdır. Makaleniz ile iyi bir sıralama elde etmek istiyorsanız rakiplerinizden daha kapsamlı bir içerik oluşturmanız gerekir. Alt BaşlıklarMakalenizin ana hatlarını ve kapsamını oluşturacak şey, alt başlıklardır. Bu yüzden alt başlıkları seçerken rakiplerinizin seçtiğiniz konuyla ilgili oluşturduğu blog makalelerinizi inceleyebilirsiniz. Rakiplerinizin yer verdiği konulara içeriğinizde mutlaka yer vermeli ve bu konulara ek olarak kullanıcıyı besleyecek güncel bilgiler eklemelisiniz. Bu noktada, Ahrefs Free Keyword Generator ve Answer the Public araçlarının “Sorular” kısmındaki ve Google’ın “Kullanıcılar bunları da sordu” kısmındaki sorulardan faydalanabilirsiniz. Bu sayede kullanıcıların merak ettiği konulara makalenizde yer verebilirsiniz. Alt başlıklar arasında hem yapısal, hem biçimsel, hem de anlamsal olarak bir hiyerarşi kurmanız gerekir. Bu noktada, heading etiketlerinin SEO uyumlu yazılarda doğru bir şekilde kullanılması oldukça önem taşır. Başlıklar arasındaki hiyerarşiyi genelden özele giderek kurabilirsiniz. Örneğin H1 etiketine sahip başlık ana başlık olmak üzere, H2 etiketini ikincil başlık için, H3 etiketini ise üçüncül başlık için kullanabilirsiniz. Başlık boyutları arasında da hiyerarşik düzen kurulmalıdır. Örneğin, H1 etiketli başlık, en büyük boyuta sahip olmalı ve boyut heading seviyesi düştükçe azalmalıdır.Alt başlıklarda, dolayısıyla heading etiketlerinde seo anahtar kelimesi bulundurmanız önem taşır. Bu sayede hem kullanıcılarınızı içerik içerisinde doğru bir şekilde yönlendirebilir hem de arama motorlarına içeriğinizin ne ile alakalı olduğuyla alakalı daha çok bilgi vermiş olursunuz.UzunlukBacklinko’nun 912 milyon blog içeriği üzerinde yaptığı araştırmaya göre, bir SEO uyumlu makalenin 1000 ila 2000 kelime arasında bir uzunlukta olması idealdir. Ayrıca daha uzun makaleler, daha kısa makalelere göre daha fazla backlink almaktadır. Ancak, bir içeriğin uzunluğundan çok, ne kadar bilgi aktardığı ve bu bilgilerin kullanıcılar için ne kadar kullanışlı olduğunun önemli olduğunu unutmamalısınız.5. İçeriğinizin Okunabilir Olduğundan Emin OlunKaliteli bir SEO içeriği, okunabilir, doğal ve özgün bir içeriktir. İçeriğiniz her okuyucu tarafından okunabilir olmalıdır. Yani SEO uyumlu makalenizin robotik bir dille yazılmaması, kullanıcıyla etkileşime geçmesi ve akıcı olması önemlidir. Bu yüzden:Paragraflar çok uzun veya çok kısa olmamalıdır. Yaklaşık olarak 100 ila 150 kelime bir paragrafın rahat bir şekilde okunabilmesi için idealdir. Paragrafta önemli olan ana fikri sunmak ve bunu yan fikirlerle desteklemektir. Okuyucuyu sıkmamak adına, paragraf veya içerik içerisinde tekrara düşmemek önem taşır.İçeriğinizde Görsellere Yer Verin ve Görselleri Optimize Edinİçeriğinizin anlaşılabilirliğini ve okunabilirliğini artırmak adına, içeriğinizi alakalı görsellerle, videolarla veya infografiklerle destekleyebilirsiniz. Açıklayıcı infografikler veya grafikler kullanmak konunun anlaşılmasını kolaylaştıracağı gibi aynı zamanda SEO uyumlu makaleyi zenginleştirir.Kullanacağınız görsellerin dosya isminde anahtar kelimeyi geçirmeye özen gösterin. Örneğin “2017IS232738.jpg” yerine “ay-resmi.jpg” daha iyi bir dosya ismi olacaktır.SEO Uyumlu İçeriğin Faydaları Nelerdir?SEO uyumlu makale aynı zamanda kaliteli ve güvenilir makale anlamına gelir. İçeriğinizin kalitesi, rakiplerinizin arasından sıyrılmanıza yardımcı olur. Güvenilir içerikler sunmak, kullanıcılarınızın gözünde otoritenizin artmasına yardımcı olur.SEO uyumlu içerikler birden fazla anahtar kelimede görünür olmanızı sağlar. Bu sayede organik görünürlüğünüzün artar ve potansiyel müşterileri keşfetmeniz kolaylaşır. Kısacası, SEO uyumlu içerik sayesinde markanızın: dönüşüm oranı  organik trafik marka bilinirliği marka bağlılığı artar. SEO Uyumlu İçerik ChecklistSizler için SEO uyumlu içeriklerin özelliklerini taşıyan 13 maddelik bir checklist oluşturduk: İçerik rakip içeriklerden daha kapsamlı olmalıdır.  İçerik doğru ve güvenilir bilgilere sahip olmalıdır.  İçerik konuya hâkim biri tarafından yazılmalıdır. İçerikte görsellere ve infografiklere yer verilmelidir. İçerik, açıklayıcı, aranma hacmi yüksek, orta seviyede rekabete sahip bir anahtar kelime etrafında şekillenmelidir. Ana anahtar kelimeyi destekleyecek, eş veya yan anlamlı, içerik konusuyla alakalı yan anahtar kelimeler kullanılmalıdır. Bir alt başlıkta en az bir ana fikir ve onu destekleyen yan fikirler olmalıdır. İçerikte aynı fikirler farklı cümlelerle tekrar edilmemelidir.  Ana anahtar kelime ana başlık ve alt başlıklarında kullanılmalıdır. Başlıklar arasında yapısal ve biçimsel bir hiyerarşi kurulmalıdır. Yani, başlıkların heading işaretlemeleri yapılmalı ve bu başlıklar, punto boyutu olarak bir düzen içerisinde olmalıdır. İfade dili tutarlı olmalıdır. Örneğin, “sen” diliyle yazılan bir içerikte birden “siz” diline geçiş yapılmamalıdır. Kiplerin kullanımı tutarlı olmalıdır. Örneğin, geniş zaman kullanılarak yazılan bir içerikte birden geçmiş zaman kipine geçiş yapılmamalıdır. Takip edilmesi kolay, akıcı metinler yazılmalıdır. Çok sayıda yazım ve dil bilgisi hatası olan özensiz metinler yazılmamalıdır. Kopya içerik oluşturulmamalıdır. İçerikler birden fazla platformda kullanılmamalıdır.

Eyl 3, 2022 1449 reads

Yeni Bir Web Sitesi Kurulurken SEO Uyumlulukta Nelere Dikkat Edilmeli?

Bir web sitesi yapım aşamasındayken arama motoru uyumluluğu açısından en rahat optimizasyonların ve altyapı kurulumlarının yapılacağı zamandır. Hız, görseller, canonical ve meta düzenlemesi gibi pek çok SEO metriği, web sitesi yapım aşamasındayken rahatlıkla düzenlenerek, belirli kurallar çerçevesinde kodlanabilir ve web sitesi yayına alındıktan sonra büyük kolaylık sağlar.1- Hızsal FaktörlerHız, başarılı bir arama motoru optimizasyonu ve kullanıcı deneyimi için en önemli faktörlerden bir tanesidir. Web sitelerinin büyük çoğunluğunda hızı etkileyen en belirgin faktörler arasında: Görsel & Medya İçerikleri CSS Dosyaları JS Dosyaları Sunucu Kalitesi yer almaktadır. Web sitesi hazırlanırken öncelikle sitedeki tüm görsellerin optimize olması ve verimliliği kaybettirmeyecek boyutlarda olması gerekmektedir. Bunun için görselleri WebP, JPEG2000, JPEG, SVG formatlarında kullanmak önemlidir. WebP formatı Safari tarayıcılarda görünmediği için HTML kısmında “one-error” fonksiyonu kullanılarak Safari tarayıcılarda görselin JPEG versiyonu gösterilirken diğer (Chrome, Mozilla, Opera vb.) tarayıcılarda WebP formatı gösterilebilir. Görsel ve medya içeriklerinin mümkün olabildiğince optimize olması son derece önemlidir. Görsellerin sıkıştırılarak 150 KiB altına düşürülmesi, tarayıcı açılış hızını olumlu yönde etkilemektedir. Görsel ve medya içeriklerinin bulundukları alandan daha yüksek boyutta olmamaları da önemlidir. Örneğin Ana Sayfa’da yer alan bir grid modül içerisinde ortalama 400x400 pixellik alana eklenecek görselin 400px den daha büyük olmaması gerekir. Zira görsel, tarayıcı tarafında 400px’lik alan kaplarken, yüklenme sırasında daha yüksek boyut ve çözünürlük yükleyecektir. Bu da açılış hızını olumsuz etkileyecektir.JS (JavaScript) ve CSS dosyalarında ise yapılan en belirgin hata, hazır JS ve CSS kütüphanelerinin optimize edilmeden kullanılmasıdır. Örneğin jQuery JS kütüphanesi veya Bootstrap CSS kütüphanesi, içerisinde pek çok class ve fonksiyon barındırır. Ancak web sitelerimizde genellikle bu class ve fonksiyonların pek azını kullanırız. Bu yüzden sayfaya include edilmeden önce mutlaka gereksiz class ve fonksiyonlar bu dosyalardan temizlenerek, sıkıştırma işlemleri yapılmalıdır.Web site hızını etkileyen bir diğer faktör ise sunucu kalitesidir. Bir kullanıcı web sayfasını ziyaret ettiği sırada, sayfadaki DOM ögelerinin sunucu tarafından yüklenmesi, Request isteklerinin sunucu taraflı geç yanıtlanması, sayfa performansını olumsuz etkilemektedir. Bu yüzden web sitesinin işlemci, CPU ve RAM bakımından kaliteli bir sunucuda yer alması, bant genişliğinin yüksek olması önemlidir.2- Meta DüzenlemeleriBir web sayfasının olmazsa olmaz metaları bulunmaktadır. Meta title, meta description (Google harici arama motorları için meta keywords) bunlardan başlıcalarıdır. Öncelikle meta title ve description alanlarının mutlaka CMS tarafında düzenlenebilir ve özelleştirilebilir olması gerekmektedir. Ancak bir sayfanın metalarının boş olmaması gerektiğinden ve bazen bazı sayfalar gözden kaçabildiği için, eğer özel bir meta açıklamaları girilmediyse kural tanımlanarak metalar oluşturulabilir. Örneğin:Sayfa H1’i + Site Adı<pre><title>Sayfa H1’i + Site Adı</title> <meta name="”description”" content="”Sayfadaki" ilk="" paragraf="" karakteri=""></pre> Bu sayede unutulan/gözden kaçan sayfalarda meta etiketleri boş gelmek yerine bir kurala bağlı olarak standart oluşacaktır. Meta etiketleri mutlaka sayfanın etiketleri arasında yer almalıdır.3- Canonical İşaretlemesiCanonical etiketleri, bir web sayfasının tarama ve indekslenme kriterini belirten en önemli işaretlemelerden bir tanesidir. Web sitelerinde duplicate (kopya) sayfa sorunu yaşamamak, bir sayfanın aslının kendisi mi yoksa başka bir sayfa mı olduğunu belirtmek için canonical işaretlemesi kullanılmaktadır. Canonical işaretlemesi mutlaka CMS tarafında düzenlenebilir ve özelleştirilebilir olmalıdır. Ancak düzenlenmesi unutulan/gözden kaçan sayfalar olabileceği için tıpkı meta düzenlemelerinde olduğu gibi bir kural tanımlanarak tüm sayfalarda canonical işaretlemesi oluşturulmalıdır. Örneğin:Bu sayede opsiyonel olarak düzenlenmemiş tüm sayfalarda otomatik kendisini işaret eden canonical işaretlemesi yapılmış olacak. Canonical işaretlemesi mutlaka sayfanın etiketleri arasında yer almalıdır.4- H1 Başlık EtiketiH1 başlık etiketi, bir web sayfasının çatı başlığıdır. İlgili sayfanın doğrudan hedeflenen anahtar kelimesini taşımakta ve sayfada yer alan tüm içeriğin başlığını yansıtmaktadır. Her sayfada mutlaka 1 adet H1 etiketi yer almalıdır. H1 etiketleri mutlaka CMS tarafında düzenlenebilir ve özelleştirilebilir olmalıdır. Ancak meta ve canonicalda olduğu gibi, düzenlemesi unutulan sayfalarda boş gelmek yerine bir kural tanımlanabilir. Örneğin:Sayfa AdıHer sayfada en fazla 1 adet H1 başlık etiketi bulunmalıdır. Bu yüzden sayfada farklı H1 etiketlerinin yer aldığı alanlar varsa bu alanlar H1 yerine veya etiketleriyle tanımlanmalıdır.5- Robots.txt DosyasıRobots.txt dosyası, arama motoru botlarının bir web sitesinde ilk ziyaret ettikleri bir çeşit giriş navigasyonudur. Site içerisinde taranması veya taranmaması istenen sayfalar/klasörler, site haritasının yolu, robots.txt dosyasında belirtilmektedir. “Allow” komutu ile başlayan robots.txt satırı, taranabilir web sayfasını ifade ederken “Disallow” komutu ise taranması istenmeyen sayfaları ifade eder. “User-agent” komutu ise hangi botlara yönelik komut verileceğini belirtir. Örneğin bir web sitesi Google botlarına taramaya açık tutulurken screaming frog vb. tarama botlarına kapatılabilir. “*” işareti tüm botlar için komutların geçerli olacağını ifade etmektedir. Yönetici paneli olan bir web sayfası için standart robots.txt dosyası şu şekilde oluşturulabilir:User-agent: * Allow: / Disallow: /admin Sitemap: https://siteadi.com/sitemap.xmlRobots.txt’in Site İçine EtkisiBir robots.txt oluşturulduğu zaman mutlaka tarama bütçesine yardımcı olmak için burada tanımlanan komutların site içerisindeki sayfalara dinamik etkisi olmalıdır.Örneğin robots.txt dosyasında /hesabim URL’ini disallow vererek taramaya kapatıyoruz. Bu durumda arama motoru botlarına yardımcı olabilmek için site içerisinde dinamik bir şekilde /hesabim adresi verilen tüm linklere “nofollow” etiketi eklenmelidir. Aksi halde arama motoru botları robots.txt’de taramaması gereken bir sayfayı site içi linklemeleri takip ederek tarayabilir. Bu durum tarama bütçesini olumsuz etkilemektedir. Nofollow etiketinin yanı sıra yine robots.txt sayfasında disallow edilen bir sayfa varsa doğrudan bu sayfa içerisine meta robots etiketi eklenmelidir. Örnek:Robots.txt dosyasında disallow edilen sayfalar site haritasında da yer almamalıdır. Tüm bu süreç web sitesi hazırlanırken dinamik bir şekilde oluşturulmalıdır. Robots.txt tarafında disallow edilen bir sayfanın, site içerisinde yer aldığı tüm linklerin nofollow edilmesi, sayfa içine meta robots etiketinin eklenmesi dinamik olmalıdır. 6- Site Haritası – Sitemap.xmlSite haritası, web sitesini ziyaret eden arama motoru botlarına, site gezinmesinde ve taramasında kolaylık sağlayan bir çeşit navigasyon dosyalarıdır. Site haritaları manuel değil dinamik oluşturulmalıdır. Bir web sayfasının hizmet, blog, ürün gibi kullanıcıya listelenen tüm sayfaları site haritasında yer almalıdır. Elbette site haritasını dinamik oluştururken mutlaka öncelikli faktör robots.txt dosyası olmalıdır. Robots.txt dosyasında disallow eklenerek taramaya kapatılan bir sayfa/URL varsa, bu sayfa/URL’in site haritasında yer almaması gerekmektedir. Site haritaları mutlaka .xml uzantılı ve okunabilir olmalıdır. Örnek bir site haritası modeli için Google dökümanını ziyaret edebilirsiniz:https://developers.google.com/search/docs/advanced/sitemaps/build-sitemap 7- Pagination & Infinite Scroll KullanımıÖzellikle e-ticaret sitelerindeki ürün listeleme ve blog listeleme sayfalarında pagination (sayfalama) mutlaka kullanılmalıdır. Bir kategori sayfası ziyaret edildiğinde o kategoriye ait tüm ürün/içeriklerin aynı sayfada listelenmesi, tarayıcı performansını ve kullanıcı deneyimini olumsuz etkileyecektir. Bu durumu önlemek ve sayfa verimliliğini arttırmak için sayfada pagination yapısı kullanılmalıdır. Birden çok pagination yapısı bulunmaktadır. Örneğin:Sayfalanarak yapılan pagination:Veya infinite scroll dediğimiz sayfa kaydırıldıkça yüklenen içerik paginationı. Bu pagination çeşitleri arasından günümüzde en yaygın kullanılanı Load More ve Infitine Scroll sayfalamadır. Zira kullanıcılar için doğrudan farklı sayfalara geçmek yerine, sayfa kaydırma işlemi yapıldıkça içeriklerin/ürünlerin yüklenmesi kullanıcı deneyimini arttırmaktadır. Günümüzde Google’da infinite scroll pagination yapısına geçmektedir ve tavsiye etmektedir. Örnek Google dökümanı:https://developers.google.com/search/blog/2014/02/infinite-scroll-search-friendly8- Dil / Hreflang EtiketleriBir web sitesinde birden çok dil seçeneği kullanılıyorsa, hem duplicate sorunu yaşamamak hem de lokasyon bazlı aramalarda daha alakalı sonuçların listelenmesini sağlamak için web sitesinde hreflang etiketi kullanılmalıdır. Bu etiketler her dil sayfasında, alternatif dil sayfalarını işaret etmelidir. Örneğin varsayılan olarak Türkçe dilinde açılan bir web sayfasının İngilizce dilinde versiyonu varsa;Türkçe sayfada yer alacak hreflang:İngilizce sayfada yer alacak hreflang:9- Yapısal Veri İşaretlemeleriStructured Data / Yapısal Veri İşaretlemeleri bir web sayfasının, arama motorları tarafından daha anlaşılabilir yorumlanmasını sağlayan bir çeşit schema işaretlemeleridir. Web sayfaları için pek çok yapısal veri işaret türü bulunmaktadır. En çok kullanılan yapısal veri işaretlemelerine örnek verecek olursak: Organization İşaretlemesiOrganization işaretlemesi web sitesinin sadece ana sayfasında yer alması gereken, web sitenin kartvizitini temsil eden işaretleme türüdür. Bu işaretlemede web sitesinin organizasyonu, iletişim bilgileri vb. yer almaktadır. Organization işaretlemesi şu şekilde yapılabilir:  {"@context": "http://schema.org", "@type": "Organization", "name": "SİTE ADI", "logo": "LOGO ADRESİ”, "url": "https://siteadi.com/", "email": "SİTE E-MAİL", "address": "ŞİRKET ADRESİ", "telephone": "İLETİŞİM TELEFONU" } Breadcrumb İşaretlemesiBreadcrumb işaretlemesi hali hazırda olan breadcrumb yapısının daha düzenli bir şekilde arama botlarına sunulmasına fayda sağlayacağından tüm sayfalarımızda hiyerarşiyi göstermek adına mutlaka kullanılmasını önermekteyiz.Tüm iç sayfalarda yer alacak breadcrumb işaretlemesi, hiyerarşik olarak kendisinden önce gelen tüm kategorileri işaret etmelidir. Örnek: { "@context": "https://schema.org", "@type": "BreadcrumbList", "itemListElement": [ { "@type": "ListItem", "position": 1, "item": { "@id": "https://siteadi.com/", "name": "Ana Sayfa" } }, { "@type": "ListItem", "position": 2, "item": { "@id": "https://siteadi.com/kategori", "name": "Kategori Adı" } }, { "@type": "ListItem", "position": 3, "item": { "@id": "https://siteadi.com/kategori/urun-adi", "name": "Ürün Adı" } } ]}Product İşaretlemesi (E-Ticaret Siteleri İçin)Product işaretlemesi, ürün sayfaları için kullanılmakta ve doğrudan ürün hakkında bilgileri içermektedir. Örnek: { "@context": "http://schema.org/", "@type": "Product", "name": "ÜRÜN ADI", "url": "ÜRÜN URL", "description": "ÜRÜN AÇIKLAMASI", "sku": "ÜRÜN SKU", "brand": { "@type": "Thing", "name": "MARKA ADI" }, "offers": { "@type": "Offer", "url": "ÜRÜN URL", "priceCurrency": "PARA CİNSİ ÖRN: TRY", "price": "ÜRÜN FİYATI", "availability": "http://schema.org/InStock", "seller": { "@type": "Organization", "name": "MARKA ADI" } } } Service İşaretlemesi (Hizmet Sayfaları İçin)Danışmanlık, eğitim vb. hizmet alanında satış yapan siteler için product yerine service işaretlemesi kullanabilir. Örnek kullanımı: { "@context": "https://schema.org/", "@type": "Service", "provider": { "@type": "Service", "name": "HİZMET ADI", "description": "HİZMET AÇIKLAMASI" }, "providerMobility": "dynamic", "url": "HİZMET URL" } BlogPosting İşaretlemesi (Blog Sayfaları İçin)Web sitesinde yer alan blog sayfaları için blogposting işaretlemesi kullanılmaktadır. Örnek kullanımı: { "@context": "https://schema.org", "@type": "BlogPosting", "mainEntityOfPage": { "@type": "WebPage", "@id": "BLOG URL" }, "headline": "BLOG ADI", "image": [ "ÖNE ÇIKAN GÖRSEL URL’İ" ], "url": "BLOG URL", "datePublished": "PAYLAŞIM TARİHİ", "dateModified": "SON GÜNCELLEME TARİHİ", "author": { "@type": "Organization", "name": "SİTE ADI" }, "publisher": { "@type": "Organization", "name": " SİTE ADI ", "logo": { "@type": "ImageObject", "url": "SİTE LOGO" } }, "description": "BLOG DESCRİPTİON" } FAQ İşaretlemesi (Sıkça Sorulan Sorular Sayfası İçin)FAQ işaretlemesi web sitelerindeki sıkça sorulan sorular sayfaları için kullanılmaktadır. Bu işaretlemenin en önemli faydası Google snippet dediğimiz arama sonuçlarında listelenmesidir. Örnek faq işaretlemesi kullanımı: { "@context": "https://schema.org", "@type": "FAQPage", "mainEntity": [{ "@type": "Question", "name": "SORU 1", "acceptedAnswer": { "@type": "Answer", "text": "CEVAP 1" } },{ "@type": "Question", "name": "SORU 2", "acceptedAnswer": { "@type": "Answer", "text": "CEVAP 2" } },{ "@type": "Question", "name": "SORU 3", "acceptedAnswer": { "@type": "Answer", "text": "CEVAP 3" } } ] } 10- Breadcrumb YapısıBreadcrumb site içerisinde gezinmeyi kolaylaştıran header navigasyon çeşididir. Kullanıcıların hangi sayfada olduğunu, ilgili sayfanın hangi kategoriye bağlı olduğunu hiyerarşik bir şekilde görerek kategoriler ve sayfalar arası gezinmesini kolaylaştıran yapıdır. Breadcrumb yapısı dinamik bir şekilde oluşturulması ve sayfanın en üstünde yer almalıdır. Örnek breadcrumb kullanımı şu şekilde olabilir:E-ticaret siteleri için bir örnek:Ana Sayfa > Kategori > Ürün AdıDaha fazla bilgi için w3 dökümanını ziyaret edebilirsiniz:https://www.w3schools.com/howto/howto_css_breadcrumbs.asp 

Eyl 3, 2022 864 reads

3 Adımda Markanızı Black Friday’e Nasıl Hazırlayabilirsiniz?

Büyük Kasım indirimleri başlıyor! Peki markanız Black Friday’e Hazır mı? Yazıdaki 3 adımı takip edin, ve bu karmaşık dönemde markanızından olabilecek en verimli sonuçları alın.1. Black Friday Kampanya Takviminin PlanlanmasıBlack Friday başlamadan önceki süreçte planlama aşaması büyük önem taşır. Bu aşamada ilk olarak kampanya takvimini belirleyerek hangi kitleye ne zaman nasıl bir iletişim uygulanacağına dair planlama yapmalısınız. Black Friday öncesinde, black friday döneminde ve sonrasında farklı stratejiler üzerine farklı planlar oluşturmalısınız.2. Bütçeleri ÖngörmekBu aşamada doğru bir tahmin yapabilmek için performans planlayıcı, anahtar kelime planlayıcı, Google Trends gibi araçlardan yararlanabilir, geçmiş dönemdeki Black Friday Google Analytics verilerine bakabilirsiniz. Böylelikle ortalama bir tahminde bulunmak ve bütçenizi yönetmek sizin için daha kolay bir hale gelecektir.Bütçe planı yaparken tüm dinamikleri düşünmeniz gerekir. Mecra planlaması, kanal dağılımı, maksimum görünürlük için marka ve programatik planını tam olarak çıkarmanız ve üçüncü parti kanallarını da plana eklemeniz önemlidir.3. Planları Fazlara AyırmakÖnceki dönemlerden analiz edilen verilere göre alışveriş trendinin kasım ayından önce artmaya başlayıp Black Friday haftasında zirve yaparak ilerlediğini, Black Friday sonrasında ise bir süre daha azalarak devam ettiğini görüyoruz. Bu sebeple planlamaların alışveriş dönemi öncesi, alışveriş dönemi ve alışveriş sonrası dönem olmak üzere 3 faza ayırmanız gerekiyor.a) Black Friday Öncesi DönemAlışveriş döneminde rekabet ve maliyetler arttığı için alışveriş dönemi öncesinde hem yeniden pazarlama kitlesini arttırmak hem de kullanıcılara farkındalık kazandırmak amacıyla kampanya duyurularına önceden başlamanız gerekir. Böylelikle daha az maliyet ile yeni kullanıcıları sayfanıza getirerek verilerini alıp kampanya dönemi başlayınca maliyeti daha az kanallar ile sitenize çekebilir ve reklam tarafında tekrardan hedefleme yapabilirsiniz.Alışveriş dönemi öncesinde tamamlamanız gerekenler arasında görsel ve video kreatifleri de yer alıyor. Özellikle tanıtım döneminde kullanılacak dinamik görseller oldukça önem taşıyor.Geçmiş dönemlerde online offline olarak satın alım yapmış kullanıcıları kaçırmamak için Google Ads ve Facebook tarafında müşteri bilgilerini güncel hale getirerek panelleri segmentlere ayrılmış CRM verileriyle beslemelisiniz.Alışveriş döneminde site trafiğinin zirve yaptığı günlerde kullanıcı yoğunluğu artacağı için site alt yapısında mutlaka optimizasyonlar yapmalısınız. Kampanya sırasında teknik bir problem yaşamamak için Google Tag Manager ve Google Ads’te yer alan dönüşüm kodlarının, Facebook etkinliklerinin kontrolünü alışveriş öncesi dönemde sağlamalısınız.Marka tarafında ise yine alışverişin zirve yaptığı Black Friday döneminde sıkıntı yaşamamak için stok derinliği ve ürün çeşitliliği için hazırlık yapmalısınız. En çok satan ürünlerde ve indirime girmesi planlanan ürün gruplarında yeterli sayıda ürün ve stok derinliği olduğundan emin olmalısınız.b) Black Friday DönemiGoogle Ads tarafında kampanyaların bütçeyle sınırlı uyarısına dikkat etmeniz gerekir. Hacimdeki yüksek artışlardan dolayı özellikle manuel teklif stratejileri ile ilerleyen kampanyaları yakından takip etmelisiniz. Mümkün olduğunca otomatik teklif stratejileri ile ilerlemek markanız için daha sağlıklı olacaktır.Kapsam alanını genişletmek için panellerde kullanacağınız kampanyaları çeşitlendirmeniz gerekir. Üçüncü parti kanallar, ortak kanallar, medya satın alma ve programatiğin yanı sıra Google Ads tarafında Discovery, YouTube ve dinamik arama kanallarını kullanmak ve uzantıları da çeşitlendirmek önemlidir.Facebook tarafında ise pazarlama hunisindeki farkındalık, değerlendirme ve dönüşüm kitlelerini baz alarak farklı amaçlara göre kampanya yapısı kurulmalı ve iletişimleri hedef kitleye uygun bir şekilde farklılaştırmalısınız.Düşük rekabet kategorileri önceliklendirilerek olumsuz rekabet ortamından verim alabilirsiniz. Buna ek olarak arama motoru tarafında “Black Friday”, “Efsane Cuma” gibi niyet belirtmeyen rekabeti çok yüksek olan kelimeler yerine, uzun kuyruklu anahtar kelimelere yönelmelisiniz.Google Ads ve Facebook tarafında ise yeni açılacak kampanyaların alışveriş dönemine girmeden önce açılması ve öğrenimlerini tamamlamış bir şekilde alışveriş dönemine başlaması büyük önem arz ediyor.Bütün kullanıcılara aynı iletişimlerle gitmek yerine reklamlardaki iletişimlerin ve görsellerin çeşitlendirilmesi için Facebook tarafında dinamik kreatif seçeneği kullanılabilir. Google Ads tarafında ise responsive display (duyarlı görüntülü reklamlar) ve responsive search (duyarlı arama ağı reklamları) kullanmalı, uzantıları çeşitlendirmelisiniz.Kampanya döneminde siteden alışveriş yapan kitlenin kampanya sonrasında da sitenize gelmesi çok muhtemeldir. Bu yüzden kampanya dönemi içinde siteye gelen kullanıcıları davranışlarına göre segmentlere ayırıp Google Analytics üzerinden kampanya tarihleri arasında özel kitleler oluşturmalısınız. Örnek vermek gerekirse; Black Friday sonrasındaki faz için bu dönemde gelip sepetini terk eden kitlelere özel indirimler oluşturabilirsiniz.c) Black Friday Sonrası DönemEn başta söylediğimiz gibi Black Friday sonrası dönemde alışveriş trendinin bir süre daha azalarak devam ettiğini daha önceki senelerden gözlemliyoruz. Dolayısıyla alışveriş devam ettiği için planlama aşamasında bu dönem için de strateji çalışmalısınız. Alışveriş dönemi sonrasındaki iletişim için kampanya stratejinizi ve kreatiflerinizi önceden hazırlamış olmanız gerekiyor.Bu süreçte en çok yapılan hatalardan birinin Black Friday dönemi sonrasında açık unutulan kampanyalar olduğunu görüyoruz. Bu sebeple panellerdeki açma kapama kurallarını kullanmanızı ve geçmiş dönemden kalan iletişimleri tekrardan gözden geçirmenizi öneririz.

Eyl 3, 2022 33622 reads

React ve Google Analytics: GA4 React'a Nasıl Entegre Edilir?

React ve Google Analytics’in web analist topluluğu arasında en popüler araçlardan ve kütüphanelerden biri olduğu inkâr edilemez bir gerçektir. Google Analytics, kullanıcılarınızı kolayca takip etmenizi ve yeniden hedeflemenizi sağlayan en yaygın kullanılan web analiz aracıdır.Google Analytics 4 (GA4), web ve mobil uygulamanızı bir araya getirerek kişiselleştirilmiş raporlar ve yapay zekâ destekli analizler gibi daha kapsamlı ölçüm yöntemleri sunar. Dahası, Universal Analytics (UA)’a kıyasla dijital pazarlama stratejileriniz hakkında daha iyi içgörüler sağlar.Hızlı ve basit olmasıyla bilinen React, web geliştirme alanında en popüler front-end JavaScript kütüphanesidir. React tabanlı web sitenizde Google Analytics kullanmanın size sağlayacağı faydalar şunlardır: Kullanıcılarınızın hangi ülkeden trafik getirdiğini ve hangi demografik özelliklere sahip olduğunu öğrenebilirsiniz. Kullanıcılarınızın hangi sayfalarda ne kadar zaman geçirdiğini görebilirsiniz. Gelişmiş E-ticaret ve özel etkinlikleri ölçebilirsiniz. React uygulamanızdaki hataları raporlayabilirsiniz. Uygulamanızda A/B testleri için kullanıcı davranışını ölçebilirsiniz. Google Analytics 4 hesabınız ve React tabanlı bir web siteniz olduğunu varsayarsak, adım adım sağlıklı bir React Google Analytics kurulumu nasıl yapılır görelim.Öncelikle mevcut Universal Analytics hesabınız içinde bir GA4 mülkü oluşturmanız gerekir. Bunun için GA4 Property Setup Assistant’ı kullanabilirsiniz. Başlat’a tıklayın, önceden herhangi bir yapılandırmaya gerek kalmadan anında kurulacaktır.Connected Property bölümünden GA4 kurulumunun başarılı olduğunu görebilirsiniz.Google Analytics 4 Ölçüm Kimliğiİşimizin yarısı bitti. Artık React tabanlı web sitemize GA4 kurulumunu tamamlayabilmemiz için en önemli parça olan, G- ile başlayan GA4 Ölçüm Kimliğini aldık.React Google Analytics EntegrasyonuDijital pazarlama dünyasında React ekosisteminde genellikle sayfa yönetimi, eklenti desteği, CMS, site hızı ve SEO uyumluluğu gibi konular için Gatsby ve NextJS gibi Statik Site Üreticileri (SSG) kullanılır.Şimdi olası entegrasyon yöntemlerine bakalım.Gtag Script EklemeÖncelikle uygulamanıza react-ga paketini kurmanız gerekir.yarn add react-gaDaha sonra react-ga paketini index.js veya app.js dosyanıza eklemeniz gerekir.import ReactGA from 'react-ga'; const TRACKING_ID = "UA-12341234-1"; // YOUR_OWN_TRACKING_ID ReactGA.initialize(TRACKING_ID);React uygulamalarında en sık karşılaşılan sorunlardan biri render yöntemlerinde ortaya çıkar, özellikle CSR (Client Side Rendering) ve SSR (Server Side Rendering). Render yöntemleri hakkında detaylı bilgiye buradan ulaşabilirsiniz.SPA (Single Page Application) uygulamalarınızda, bu render sorunlarını önlemek için react-router-dom kullanarak history.listen ile etkinliklerinizi göndermeniz gerekir.import React from 'react' import { withRouter } from 'react-router-dom'; import ReactGA from 'react-ga'; const RouteChangeTracker = ({ history }) => { history.listen((location, action) => { ReactGA.set({ page: location.pathname }); ReactGA.pageview(location.pathname); }); return ; }; export default withRouter(RouteChangeTracker);Gatsby GTAG EklentisiEğer web sitenizde Gatsby motorunu kullanıyorsanız, gatsby-plugin-google-gtag eklemeniz tavsiye edilir.Öncelikle gatsby-plugin-google-gtag eklentisini kurmanız gerekir.yarn add gatsby-plugin-google-gtagDaha sonra gatsby-config.js dosyanızı şu şekilde güncellemelisiniz:Gördüğünüz gibi farklı framework’lere göre farklı Google Analytics 4 entegrasyon yöntemleri bulunmaktadır.Ancak, hangi React framework’ünü kullanıyor olursanız olun, öncelikle Google Analytics’in herhangi bir web uygulamasından verileri nasıl çektiğini anlamanız gerekir. Bu, web sitenizde olası ölçüm ve entegrasyon hatalarını önleyecektir.Google Analytics 4’ün Gtag script üzerinden nasıl çalıştığına dair kaynağa buradan ulaşabilirsiniz.