Arayüz CSS

Reset CSS ve Normalize CSS Farkları

HTML proje yaparken yazdığınız bir kod tarayıcılarda farklı görünebiliyor. Bunun sebebi ise her tarayıcının kendi varsayılan ayarlarıdır. Reset.CSS ve Normalize.CSS kullanarak bu sorunu çözebilirsiniz. Bu iki CSS ‘i karşılaştırdık.

HTML bir projeyi sıfırdan yazanların muhtemelen karşılaştığı sıkıntılardan bir tanesi de sitenin kenar boşluklarının tarayıcıdan tarayıcıya değişmesidir. Her tarayıcının kendine göre varsayılan biçimlendirmesi vardır. Bu durum projenizin her tarayıcıda farklı görünmesine neden olur. Bu durum sonucunda Reset CSS ve Normalize CSS çözümleri doğmuştur.

Okuma Önerisi: Vital CSS Nedir ? Basit Web Framework

Siz olsanız bu sorunu nasıl çözerdiniz?

Reset CSS Nedir?

Reset CSS tüm tarayıcıların varsayılan değerlerini sıfırlamaya yarar. Örnekle anlatmam gerekirse Firefox site kenar boşluğu için 5px verdiğini düşünelim. Safari ise 10 px veriyor olsun. Reset CSS alıyor bunu sıfırlıyor. Her iki tarayıcı da aynı şekilde görmüş oluyor.

Normalize CSS Nedir?

Reset CSS’de tüm değerlerin sıfırlanması sıkıntı çıkarabiliyordu. Bunun üzerine Normalize CSS çıkarıldı. Normalize CSS tüm özellikleri sıfırlamak yerine bunlara bir değer atıyordu. Örneğin site kenar boşluğuna 5 px atıyordu. Bu sayede her tarayıcı kenar boşluğunu 5 px olarak gösteriyordu.

Kodlar uzun olduğu için siteye eklemedim. Gist adresimden Normalize.CSS Örneğini inceleyebilirsiniz.
GitHub Normalize.css sayfasından son sürüme erişebilirsiniz.

Reset.CSS ve Normalize.CSS Arasındaki Farklar Nelerdir?

  • Normalize.css her şeyi sıfırlamaz. Gerekli özellikleri sizin belirlediğiniz kadar değiştir.
  • Normalize.css, reset.css kapsamının dışında kalan bazı hataları düzeltir.
  • Normalize.css modüler bir yapıdadır. Örneğin projenizde form kullanmayacaksanız form normalizasyonu bölümünü kolayca kaldırabilmenizi sağlar. Yani normalizasyonda bölümler bağımsızdır diyebiliriz.
  • Normalize.css ‘in dokümantasyonu daha gelişmiştir. Normalize.css kodu Github’da kapsamlı olarak belgelenmiştir. Her kod satırının ne işe yaradığı anlatılmaktadır. Yalnızca ne işe yaradığıyla kalmayıp tarayıcılar arasındaki farkın ne olduğunu da gösteriyor.

Karar yine tabiki sizlerin. Ancak bana sorarsanız hem dokümantasyon hem özellik açısından Normalize.CSS diyorum. Bu konudaki düşüncelerinizi yorum yaparak bizlerle paylaşabilirsiniz.



Yazar hakkında

Bilal UÇAR

Web Developer @Webmaster.Kitchen.
Wordpress üzerinde çalışmalar yapıyorum. Bu konuda öğrendiklerimi mutfakta paylaşıyorum. Siz de yaptığınız çalışmaları, edindiğiniz bilgileri paylaşabilirsiniz.
Yorum alanı ile mutfağa katkıda bulunun.

Yorumlar

1 Yorum

Bir yorum yaz