İpucu: SEO ve CSS optimizasyon

SEO çalışmalarının bir kısmıda sitenin içeriğinin düzenlenmesi gerekmektedir. web sayfalarının indirilmesi ve yüklenmesi esnasında yüklenmesini etkileyen en önemli unsurlar başta resimler olmak üzere CSS yüklemeleri ve JS yüklemeleri olmaktadır. Özellikle CSS dosyaalrının web sitelerinde aşırı yoğunlukta kullanılması sebebiyle sayfa yüklemeleri uzamakta ve dolayısı ile sitenin SEO durmunun düşük olması ile sonuçlanmaktadır. Ayrıca dikkatsiz CSS kullanımları sebebiyle CSS dosyalarından başka CSS dosyaları da @import komutu ile çağrılmaktadır.

Responsive WEB sayfaları yapmak için çeşitli ekran çözünürlükleri için aynı css dosyası içerisinde kilobaytlarca veri yüklemeleri veya css dosyaları içerisinde yapılan büyük resim yüklemeleri dolayısı ile her tür cihaz için aynı resimlerin yüklenmeside seo nun olumsuz etkilenmesine sebep olmaktadır.

CSS dosyalarının optimize edilmesi esnasında dikkat edilmesi gereken husuları sıralarsak

• tek CSS dosyası çağrısı yapılmalıdır.
• css dosyası içerisinden ek @import işlemleri yapılmamalıdır
• responsive css uygulamalarında kullanılan resimler her boyut için ayrı ayrı hazırlanmalı ve sunulmalıdır
• screen CSS ve print CSS olarak css dosyaları oluşturulmalıdır. Print CSS dosyaları yazdırma esnasında aktif olurlar CSS dosyası çağrıları headerless bir domainden veya cdn üzerinden yapılmalıdır.
• CSS dosyaları minimize edilmiş olarak servis edilmelidir.
• CSS dosyaları mümkünse kullanıcıya sunum esnasında head bloğuna dahil edilmelidir.
• Toplam HTML / CSS ve script dosyası büyüklüğü 64 K nın üzerinde olmamalıdır.

CSS OPTIMIZASYON ARAÇLARI

• http://www.cleancss.com/css-beautify/
• http://www.cleancss.com/css-minify/
• http://www.csstidyonline.com/
• http://www.cssportal.com/css-optimize/
• http://jigsaw.w3.org/css-validator/
• http://www.htmlhelp.com/tools/csscheck/
• http://juicystudio.com/services/csstest.php

hocam sayfa içi css kullanma seo açısında eksi birdurum diye biliyorum ama mesela buradaki tema ilgili firmada binlece satışı olmus wordpress tema ve seo uyumlu ..tema yapımıcısı css kodlarının head etikentinden önce olursa sorun olmazmıs diyor. bu konuda fikriniz nedir ? birde temiz tema yani seo uyumlu tema nasıl olmalıdır

Genelde Bilinen O şekilde ancak Kısa CSS kodlarını ek bir dosyadan çağırmak tam anlamı ile ahmaklıktan başka bir şey değil
head bloğunda yapılan her çağrı sayfanın açılmasını en az 0.3 saniye geciktirir.
Buda sizi 0.3 saniye geriye atmak anlamına gelir ayrıca sayfa içi css ile head bloğundaki css birbirinden farklı şeylerdir.