Hüseyin MERT

Fatih Hayrioğlu‘nu, css ile uğraşmış veya ilgilenmiş birçok kişi bu faydalı siteden çözümler bulmuş yeni şeyler öğrenmiştir. Sitesinde bulunan css ile alakalı yazıları bir de e-kitap olarak çıkarmıştır.

RSS, Twitter, FriendFeed ‘ten de takip edebilirsiniz.

Birçok sitede import işe yarıyor ancak Steve Souders yaptığı deneyde “don’t use @import ” import ve link kullanımı karşılaştırmış. Karşılaştırması sonucu IE’de paralel indirmede bazen sorunlar olduğunu görmüş. Kendi görüşüm bir sitede iç içe style import ederekten kullanmak çok önemli değilse yapılmaması yönünde. Misal:
style.css
[sourcecode language='css']
@import url(‘reset.css’);
@import url(‘panel.css’);

body{
// gibi gibi
}[/sourcecode]
şimdi performans için çok büyük bir css dosyası yerine bölümler için ayrı css dosyaları ayarlayaraktan hem kullanıcı (client) taraflı daha az veri transferi sağlamış olursunuz hem sunucunuzdan daha az bant harcamış olursunuz.
şimdi sıkı durun size php ile eğer dosya değiştirilmediyse kullanıcıya yeniden dosyayı çektirmemek için bir yöntem var.
[sourcecode language='php']
$last_modified_time = filemtime($file);
$etag = md5_file($file);
header(“Last-Modified: “.gmdate(“D, d M Y H:i:s”, $last_modified_time).” GMT”);
header(“Etag: $etag”);
if (@strtotime($_SERVER['HTTP_IF_MODIFIED_SINCE']) == $last_modified_time ||
trim($_SERVER['HTTP_IF_NONE_MATCH']) == $etag) {
header(“HTTP/1.1 304 Not Modified”);
exit;
}
[/sourcecode]

* kaynak
zaten tarayıcıların birçoğu eğer değiştirilmediyse dosyayı yeniden çekmiyor hatta değişse bile çekmiyor ya, ondan Ajax uygulamarında IE’nin önbelleklemesini (cache) engellemek diye bir çözümü sizlerle paylaşmıştım.

Tabi insan söyleyeceği şeyi söylerken bir ton şey daha araya giriyor siz anladınız diyeceğimi

Kutu modeli (Box model) css için kullanılan bir elementin diğer elementlere uzaklığı, kendi içindeki ötelemesi, konumu ve kenarlarının ne kadar uzaklıkta olduğunu belirlersiniz. Her web tasarımcının bilmesi gereken çok önemli konudur. Bu modeli anlamadığınız zaman yazdığınız css kodları üzerine bina edilmiş xhml veya html kodlar tarayıcı bağımsız olmayacaktır.

kaynaklar:

http://tantek.com/CSS/Examples/boxmodelhack.html
http://www.altiustutasarim.com/arsiv/2005/02/kutucuk_modeli.php
http://en.wikipedia.org/wiki/Internet_Explorer_box_model_bug
http://de.selfhtml.org/css/formate/box_modell.htm
http://www.quirksmode.org/css/box.html

Microsoft Internet explorerda min-height diye bir özellik olmadığı için genellikle css de kullanılan hack diye tabir edilen kandırmacalar, ayak oyunları mevcuttur.

Min-height problemi Çözümü

[sourcecode language='css']
.min300px{
min-height: 300px;
height: auto;
_height: 300px;
}[/sourcecode]
devamı»