En iyi yuvarlak köşe yöntemi hangisi [CSS/JS/Resim]03Feb

Şurada köşesiz kutu çeşitlerinden en iyi verimi hangisinin verdiği araştırılmış. Çeşitler derken şu şekilde:

- 5 Resim dosyalı
- Tek resim dosyalı
- Tamamen CSS
- Javascript [örnek sayfası]

Evet bu şekilde. Şimdi alınan verimlere bakın:

Tek Resim Dosyalı:

Yüklenme Zamanı: 0.125 saniye
Toplam Obje: 3 (33.9 KB)
(X)HTML: 1 (11.5KB)
Script: 0 (0KB)
Resim Dosyası: 1 (1.9KB)
Gözlemler: Tek bir resim dosyasına sahip olduğunuz için boyut konusunda sıkıntınız olacaktır. Faklı boyut sahibi kutular için farklı boyutlarda resim dosyasına sahip olmalısınız. Aynı zaman boyut gibi diğer önemli faktörler ise çerçeve kalınlığı rengi ve ayrıca arkaplan rengi gibi kısıtlamalarada sahipsiniz.
Sağlayıcı: SpiffyBox

5 Resim Dosyalı:

Yüklenme Zamanı: 0.255 seconds
Toplam Obje: 6 (17.7 KB)
(X)HTML: 1 (17.2KB)
Script: 0 (0KB)
Resim Dosyası: 5 (0.5KB)
Gözlemler: Bu yöntemin en büyük sıkıntısı arkaplan için fazladan resim koyamamaktır. Çünkü kullandığınız 5. resim bunu engelliyor. (Bilgi!) Ama eğer kutunuz tek renk olursa ve çerçeve kullanmazsanız 5. resimden yerine background-color kullanırsınız ve arkaplan’a resim koyma şansı yakalarsınız.
Sağlayıcı: Round Box Generator

Tamamen CSS:

Yüklenme Zamanı: 0.3 seconds
Toplam Obje: 1 (30.2 KB)
(X)HTML: 1 (30.2KB)
Script: 0 (0KB)
Resim Dosyalası: 0 (0KB)
Gözlemler: Bu yöntem biraz işkenceli oluyor.Çünkü yuvarlak köşe oluştururken her bir piksel satır için ayrı bir ayar yapmanız lazım. Buda sonradan genişlik yada renk değişimi sıradında sizi biraz zorlaştıracak.
Sağlayıcı: Spiffy Corners

Javascript:

Yüklenme Zamanı: 0.225 seconds
Toplam Obje: 2 (32.4 KB)
(X)HTML: 1 (7.9KB)
Script: 1 (24.5KB)
Resim Dosyası: 0 (0KB)
Gözlemler: En iyi yöntem olarak seçilebilir. Çünkü siz Javascript ile elde yapmanız gereken ayarları otomatik olarak ona o anda yapmasını söylüyorsunuz. Boyut renk gibi nitelikler sonradan kolayca değiştirilebilir. Hızlı bir sistem ayrıca.
Sağlayıcı: Curvy Corners

Kişisel Yorumum: En iyisi tabi ki JS kullanmak. Çünkü kullanım kolaylığı üst seviyede ayrıca hız konusunda gayet başarılı.