‘Firefox’ etiketi için sonuçlar
CSS İpucu 18: Optimizasyon İçin CSS Medya Dosyalarını Birleştirmek
Şubat 16th, 2009 • 4 yorum CSS, XHTML
Etiketler: birleştirme, CSS, firebug, Firefox, optimize, yazıcı, YSlow
Bir çok web kod yazarı için sayfaların yavaş açılması büyük bir sorundur. Bu sorunun çözümü için çeşitli metotlar uygulanır. Farklı araçlar ile testler yapılır çözümler üretilmeye çalışılır. Sonuçta en kararlı hale ulaşılmaya çalışılır.
Bende bir test aracı ile(Firefox – FireBug – YSlow) test ediyorum. Test ettiğim siteler HTTP isteklerinin çokluğundan dolayı düşük puan alıyor. Fazla sayıda css ve javascript dosyasının eklenmesi bu soruna neden oluyor. Bunun için en kolay ve basit yöntem css ve js dosyalarını birleştirmekten geçiyor.
Genelde projelermizde css dosyalarımızı genel stil için ve yazıcı için olmak üzere ikiye ayırıyoruz.
<link rel="stylesheet" href="/style/iskelet.css" type="text/css" media="screen" /> <link rel="stylesheet" href="/style/yazici.css" type="text/css" media="print" />
Normal ve çıktı almak için bunları bir css dosyasında birleştirerek HTTP istek sayısını azaltabiliriz.
<link rel="stylesheet" href="/style/iskelet.css" type="text/css" />
gibi iskelet.css içeriğinin yapısı ise aşağıdaki gibi olacaktır.
/* all media */
@media all
{
body { color:#666; font:13px arial, helvetica, sans-serif; padding:20px 0 30px 0; }
}
@media print
{
body { color:#000; font:12px arial, helvetica, sans-serif; padding:0; }
}
şeklinde yaparak css dosyalarımızı tek dosya içerisinde toplayabiliriz.
Daha fazla sayıda css dosyası kullanmamız durumunda ise sunucu veya istemci taraflı kod yardımı ile css veya js dosyalarımızı tek bir dosya gibi gösterebiliriz. Bu konuya burada girmeyeceğim. Konu ile alakalı çalışmaların linklerini aşağıda veriyorum.
Kaynak
- http://davidwalsh.name/combine-css-media-styles-file
- http://developer.yahoo.com/performance/rules.html#num_http
- http://www.vulgarisoip.com/2007/06/21/minify-your-external-javascript-and-css-with-php/
- http://www.websiteoptimization.com/speed/tweak/http/
- http://www.javascriptkit.com/javatutors/loadjavascriptcss.shtml
- http://yuiblog.com/blog/2006/11/28/performance-research-part-1/
- http://www.sitepoint.com/blogs/2007/04/10/faster-page-loads-bundle-your-css-and-javascript/
- http://www.jaisenmathai.com/blog/2008/02/27/speed-up-apache-how-i-went-from-f-to-a-in-yslow/
- http://www.cloudfour.com/77/easy-steps-to-speedup-your-wordpress-blog/
sIFR, Flash Player10 ve Firefox sorunu
Ocak 7th, 2009 • 12 yorum CSS, Javascript, Web Standartları, XHTML
Etiketler: Firefox, Flash Player, safari, sIFR
Bir çok projemde sIFR kullanıyorum. Yaklaşık 1-2 ay önce Flash Player 10 çıktıktan sonra sIFR kullandığım başlıklarımda sorun çıkmaya başladı.
İlk başta anlayamadım. Biraz araştırınca sIFR’ın bazı tarayıcılarda(Firefox ve Safari) Flash Player’ı tespit edemediği için böyle bir sorun ile karşılaşıldığı söyleniyor.
Çözüm için yapmamız gerek sifr.js dosyamızı güncellemek ve eğer sIFR 2.0.4′den önceki sürümleri kullandı isek yeni sürümü indirip sifr.fla dosyamızı yeniden export ederek oluşan .swf dosyasını atmak.
sIFR’ın yeni sürümü sIFR3 beta’da böyle bir sorun yok.
Bu kadar basit bir çözüm. Ama içimdeki sIFR sevgisini biraz daha azaltan bir gelişme oldu bu benim için.
FireBug İpucu : FireBug’ın Yetenekleri
Ekim 23rd, 2008 • 9 yorum CSS, XHTML
Etiketler: anında-düzeltme, eklenti, firebug, Firefox
FireBug ile ilgili bir makale yazacağım ama bugün internette gezerken bir makaleye(50’den fazla doku kaynağı ile ilgili olan) bakıyordum birden aklıma yau benim sitenin ardalanına bunlardan hangisi uygun kaçar diye düşünmeye başladım. Sonra düşünmekten daha kolay bir yolunu buldum.
Aslında bir yazı olacak bir konu değil ama FireBug’ın yapabildiklerini görmek açısından önemli bir bilgi.
Sitedeki dokuları tek tek denemeye başladım. Resme sağ tıklayıp konumunu kopyaladım.
Sonrada kendi siteme gidip FireBug’ı açıp body elementini yakaladım ve ardalan olarak konumunu kopyaladığım resmi koydum. İlkini beğenmedim. Sonunda beğendiğim bir doku buldum.
Adım adım yaptıklarımı görmek için tıklayınız.(hareketli gif)
Siteme bu dokuyu uygulamasam da anında sonucu görebilmem ne kadar güzel bir şey olduğunu gördüm ve bunu sizlerle paylaşmak istedim.
Hiç sitenin kodlarına dokunmadan, herhangi bir resim kopyalamadan, site üzerinde bu dokuyu test edebilmek çok güzel.
Firefox 3.1 Yenilikleri
Ekim 21st, 2008 • 9 yorum CSS, Haberler, Javascript, Web Standartları, XHTML
Etiketler: Firefox, font-face, geode, gps, internet, İnternet Tarayıcısı, Javascript, tarayıcı, yazı tipi
Firefox 3.1 Beta1 çıktı. Aslında sadece bir haber değeri taşıyan bir bilgi, ancak Firefox 3.1 ile birlikte bir çok sevindirici gelişmeler getirdiği için dikkate değer bir yenileme. Bir ara sürüm değilde sanki yeni bir sürüm gibi. Yeni özelliklere bir göz atalım. Okumaya devam edin »
18 Ağustos 2008 web’den seçme haberler
Ağustos 18th, 2008 • 1 yorum Haberler
Etiketler: CSS, firebug, Firefox, jquery, Monitör çözünürlüğü, seo, tablo, Twitter, Web Standartları, yui
- Firefox 3.1 ile birlikte gelen yeni CSS3 desteklerinden biri yeni border-images tanımı. Bağlantı
- SmasingMagazine CSS ile yapılmış 10 güzel tabloyu seçmiş. Bağlantı
- CSS ile Amazon sitesi arama sonuç ekranındaki görünümü yapmak. Bağlantı
- İyi bir jQuery kullanmak için izlenmesi gerek yol. Bağlantı
- Web kod yazarları için kod örnekleri sunan güzel bir site. Zamanla içeriğinin dahada artacağını ümit ediyorum. Bağlantı
- İnternette yazı tipi kullanma seçenekleri. Bağlantı
- CSS ve SEO – brkcan.com Bağlantı
- SEO Dediğin Tek Dişi Kalmış Canavar – mafiamax.com Bağlantı
- FireBug yardımı ile güzel sayfa kodlamak. Bağlantı
- Twitter Nedir? Ne değildir? – webdeneyimleri.com Bağlantı
- Yahoo’nun javascript kütüphanesinin(YUI) 3. sürümü çıkıyor. Bağlantı
- jQuery ile otomatik dipnot yapmak. Bağlantı
- Monitör çözünürlükleri ve site tasarımları üzerine güzel bir makale. Bağlantı
- Mailing hakkında geniş bilgi. Bağlantı
- Web standartlarında yanlış anladığımız 5 konu. Bağlantı
FireBug – Genel Bakış
Ağustos 13th, 2008 • 15 yorum CSS, Javascript, XHTML
Etiketler: CSS Düzenleme, css ile site yapmak, CSS yazma, firebug, Firefox, Javascript, XHTML düzenleme
Uzun zamandır kullandığım halde neden FireBug hakkında bir makale yazmadığımı bilmiyorum. Aslında bu makaleyi yaklaşık 3 ay önce yazacaktım ama biraz üşengeçlikten ve tembellikten dolayı ancak şimdi yazabildim. Birazda Volkan Görgülü’nün video anlatımı benim bu makaleyi devam ettirmem için bir kıvılcım oldu diyebiliriz. FireBug gelişmiş bir araç bu nedenle tek makalede anlatmamın mümkünatı yoktu ben şimdilik iki makale ile anlatmaya çalışacağım. İlk makalemi Michael Sync sitesinden çok fazla yararlanarak hazırlıyorum. http://michaelsync.net/ sitesi bu konudaki en iyi kaynak diyebilrim. FireBug FireFox internet tarayıcısının bir eklentisidir. Bunu bilmeyen kalmamıştır diye düşünüyorum. En azın bilmeyen web kod yazarı kalmamıştır. Okumaya devam edin »
