http://www.bildirgec.org/ tr-tr 40 bildirgec.org - etiketler: css viewer pinkfloyd <p>Günümüzde CSS kullanmayan site sayısı gittikçe azalırken buna ters orantılı olarak gelişen CSS araçlarının sayısı da gün geçtikçe artıyor. Her yeni bir araç, CSS geliştiricilerinin projeler üzerinde harcadıkları zamanı azaltmaya ve daha verimli kodlama yapmalarını hedefliyor.</p> <p>İşte tam da bu noktada <a href="http://www.backtoessentials.com/css/the-ultimate-list-of-online-css-tools/">Back to Essentials</a> web sitesi, İnternet üzerindeki CSS araçlarına yönelik bir liste hazırlamış. Ben de ilgilenen bildirgec okurları için bu yazıyı yayımlama gereği hissettim. Umarım işinize yarar.</p> <p><strong>Yazıtipleri</strong></p> <p><strong><a href="http://www.typetester.org/">Typetester</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-01.jpg' alt="\"\"" border="0"><br></div> <p>Ekranda farklı yazıtiplerini karşılaştırabilmenize yarayan bir uygulama.</p> <p><strong><a href="http://riddle.pl/emcalc/">Em Calculator</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-02.jpg' alt="\"\"" border="0"><br></div> <p>Em Calculator, küçük bir JavaScript aracı olup genişletilebilir ve erişilebilir CSS tasarımları oluşturmanıza yardımcı oluyor. Pixel değerindeki verileri bağıl em birimlerine dönüştürüyor.</p> <p><!-- buradan kes --></p> <p><strong><a href="http://csstypeset.com/">CSS Type Set</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-03.jpg' alt="\"\"" border="0"><br></div> <p>CSS Type Set sayesinde tasarımcılar ve geliştiriciler, sitelerinde kullanacakları metin bloklarının çeşitli CSS değerleri kullanıldığında nasıl görüneceğini eş zamanlı olarak görüp en doğru tercihi yapmalarına yardımcı oluyor.</p> <p><strong><a href="http://www.fonttester.com/">Font Tester</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-04.jpg' alt="\"\"" border="0"><br></div> <p>Font Tester bir diğer ücretsiz çevrimiçi yazıtipi karşılaştırma aracı. Çeşitli CSS yazıtipi stilleri atanmış farklı yazıtiplerini yan yana karşılaştırmanıza olanak sağlıyor.</p> <p><strong><a href="http://pxtoem.com/">PXtoEM Conversion</strong></a></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-05.jpg' alt="\"\"" border="0"><br></div> <p>Pixel değerlerini EM'e dönüştürebileceğiniz bir diğer kullanışlı araç. BODY etiketine atadığınız yazıtipi boyutunu pixel olarak girin ve site size farklı em değerlerini içeren tabloyu versin. Gerçekten kullanışlı.</p> <p><strong><a href="http://csstxt.com/">CSSTXT</a></strong></p> <p>Metinlerinize stil atayabileceğiniz bir başka uygulama.</p> <p><strong>CSS Anahat Oluşturucuları</strong></p> <p><strong><a href="http://developer.yahoo.com/yui/grids/builder/">YUI - CSS Grid Builder</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-06.jpg' alt="\"\"" border="0"><br></div> <p>CSS Izgara Oluşturucusunun basit web tabanlı arayüzü sayesinde YUI'nin CSS dosyalarına bağlı dilediğiniz sayıda anahattı kolayca oluşturabilirsiniz.</p> <p><strong><a href="http://builder.yaml.de/">YAML Builder</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-07.jpg' alt="\"\"" border="0"><br></div> <p>YAML tabanlı CSS anahatları oluşturabileceğiniz bir görsel anahat oluşturucusu.</p> <p><strong><a href="http://istylr.com/">iStylr</a></strong></p> <p>Çevrimiçi CSS Şablon Oluşturucusu.</p> <p><strong><a href="http://grid.mindplay.dk/">Grid Designer</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-08.jpg' alt="\"\"" border="0"><br></div> <p>Izgaralar ve Tipografiler oluşturabileceğiniz bir araç.</p> <p><strong><a href="http://csscreator.com/tools/layout">CSS Oluşturucusu</a></strong></p> <p>Bu oluşturucusu sayesinde esnek ya da sabi genişliğe sahip yüzen sütunlu anahatlar oluşturabilirsiniz. Site 3 adede kadar sütun, başlık ve altlık içeren anahatları destekliyor. Değerler pixel, em ya da yüzde olarak girilebilir.</p> <p><strong><a href="http://drawter.com/">Drawable Markup Language</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-09.jpg' alt="\"\"" border="0"><br></div> <p>Web sitenizin kodunu neredeyse çizebilmenize olanak sağlayan bir uygulama.</p> <p><strong><a href="http://cssmate.com/csseditor.htm">CSSMate</a></strong></p> <p>İnteraktif çevrimiçi CSS düzenleyicisi CSSMate sayesinde CSS stilleri oluşturabilirsiniz.</p> <p><strong><a href="http://www.qrone.org/cssdesigner.html">QrONE CSS Designer</a></strong></p> <p>CSS Stil düzenleyicisi.</p> <p><strong><a href="http://lab.xms.pl/css-generator/">CSS Frame Generator</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-10.jpg' alt="\"\"" border="0"><br></div> <p>XHTML altyapınız üzerinde CSS çerçeveleri oluşturabileceğiniz basit bir araç.</p> <p><strong><a href="http://lab.xms.pl/markup-generator/">XHTML/CSS Markup Generator</a></strong></p> <p>XHTML/CSS kodlama hızınızı ilerletmeye yardımcı olacak bir uygulama.</p> <p><strong><a href="http://skycsstool.sourceforge.net/">Sky CSS Tool</a></strong></p> <p>Sky CSS neredeyse hiç kod yazmadan CSS sınıfları oluşturabilmenizi sağlıyor.</p> <p><strong><a href="http://csscreator.com/version1/index.php">CSS Creator - CSS Generator</a></strong></p> <p>CSS Creator, web sayfanız için bir stil seçebilmenizi sağlıyor.</p> <p><strong><a href="http://www.gwhite.us/downloads/css_grid_calc.html">CSS Grid Calculator</a></strong></p> <p>CSS Izgara Hesaplayıcısı'nı kullanarak sayfa anahattınızı çabucak görselleştirebilir ve çeşitli yollar kullanarak ızgaralar çizebilirsiniz.</p> <p><strong><a href="http://www.ahfb2000.com/cssgenerator.php">CSS Generator</a></strong></p> <p>Bu araç basit bir stil şablonu oluşturabilmenizi sağlıyor.</p> <p><strong><a href="http://www.pagecolumn.com/">Dynamic 3 Column Layout Generator</a></strong></p> <p>3 sütunlu anahatlar oluşturabilmenizi sağlayacak kullanışlı bir araç.</p> <p><strong><a href="http://www.constructyourcss.com/">Construct Your CSS</a></strong></p> <p>WYSIWYG anahat düzenleyicisi. Semantic ve tablo kullanmadan.</p> <p><strong><a href="http://kematzy.com/blueprint-generator/">Blueprint Grid CSS Generator</a></strong></p> <p>Bu araç, Blueprint'in grid.css, compressed.css ve grid.png dosyalarının özelleştirilebilir sürümlerini oluşturabilmenizi sağlıyor.</p> <p><strong>CSS Çatıları</strong></p> <p><strong><a href="http://www.blueprintcss.org/">Blueprint</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-11.jpg' alt="\"\"" border="0"><br></div> <p>Blueprint bir CSS çatısı olup CSS geliştirirken harcadığınız zamanı azaltmayı hedefliyor.</p> <p><strong><a href="http://www.yaml.de/en/home.html">Yet Another Multicolumn Layout</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-12.jpg' alt="\"\"" border="0"><br></div> <p>Yet Another Multicolumn Layout (YAML), bir diğer (X)HTML / CSS çatısı olup modern ve özelleştirilebilir yüzen anahatlar oluşturabilmenizi sağlıyor. Yapısı, programlamasında son derece değişken ve son kullanıcılar için tümüyle erişilebilir.</p> <p><strong><a href="http://code.google.com/p/hartija/">Hartija - CSS Print Framework</a></strong></p> <p>Web yazdırması için kullanılabilecek evrensel CSS çatısı.</p> <p><strong><a href="http://elements.projectdesigns.org/index.html">Elements</a></strong></p> <p>Tasarımcıların daha hızlı CSS yazabilmeleri ve daha verimli olabilmeleri için geliştirilmiş.</p> <p><strong><a href="http://960.gs/">960 Grid System</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-13.jpg' alt="\"\"" border="0"><br></div> <p>960 Izgara Sistemi web geliştirmesi sırasında harcayacağınız zamanı, 960 pixellik genişliğe dayalı sık kullanılan ölçüler kullanarak kısaltmayı hedefliyor.</p> <p><strong><a href="http://code.google.com/p/logicss/">Logic CSS Framework</a></strong></p> <p>Logic CSS çatısı bir dizi CSS dosyası ve PHP aracından oluşmuş, web standartları ile uyumlu xHTML anahatları oluştururken geçirdiğiniz zamanı kısaltmayı hedefleyen bir uygulama.</p> <p><strong><a href="http://code.google.com/p/sencss/">SenCSs</a></strong></p> <p>SenCSs sayesinde anahat dışındaki her şey için standart CSS dosyasını kullanabilirsiniz.</p> <p><strong><a href="http://devkick.com/lab/tripoli/">Tripoli</a></strong></p> <p>Tripoli, HTML işleme için geliştirilmiş bir CSS standardıdır. Tarayıcı standartlarını sıfırlayıp yeniden inşa ederek, web projeleriniz için çapraz tarayıcı uyumlu bir temel üzerinde web projelerinizi inşa edebilmenizi sağlar.</p> <p><strong><a href="http://bluetrip.org/">BlueTrip CSS Çatısı</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-14.jpg' alt="\"\"" border="0"><br></div> <p>BlueTrip web sitesi inşa edebilmek için bir dizi stil ve yöntem sunarak, işin zaman harcatan kısmını geçip projenize odaklanabilmenizi sağlıyor.</p> <p><strong><a href="http://developer.yahoo.com/yui/grids/">Grids CSS</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-15.jpg' alt="\"\"" border="0"><br></div> <p>Yahoo! tarafından geliştirilen ve dört ön tanımlı sayfa genişliği, altı ön tanımlı şablon ve dört sütuna kadar alt-bölümleri içeren anahatları geliştirebilmenize olanak sağlayan bir CSS çatısı. Oldukça kapsamlı ve genişletilebilir.</p> <p><strong>Biçimleyiciler, İyileştiriciler ve Sıkıştırıcılar</strong></p> <p><strong><a href="http://www.codebeautifier.com/">Code Beautifier</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-16.jpg' alt="\"\"" border="0"><br></div> <p>Çevrimiçi CSS biçimleyicisi ve düzenleyicisi.</p> <p><strong><a href="http://www.cleancss.com/">Clean CSS</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-17.jpg' alt="\"\"" border="0"><br></div> <p>CSS'nizi farklı sıkıştırma ayarları kullanarak optimize edebilmenizi ve biçimlendirebilmenizi sağlıyor. Bu araç sayesinde okunması daha kolay CSS kodlarına ulaşabilirsiniz.</p> <p><strong><a href="http://isnoop.net/tools/css.php">CSS SuperScrub</a></strong></p> <p>Bu araç CSS'nin karmaşıklığını gereksiz içeriği silerek, önemsiz kodları kaldırarak ve geri kalan element isimlerini zeki bir şekilde gruplayarak azaltmayı hedefliyor.</p> <p><strong><a href="http://www.cssoptimiser.com/">Online CSS Optimizer</a></strong></p> <p>Çevrimiçi CSS İyileştiricisi sayesinde CSS dosyalarınızın dosya boyutunu azaltabilirsiniz.</p> <p><strong><a href="http://www.cssdrive.com/index.php/main/csscompressor/">CSS Drive Gallery - CSS Compressor</a></strong></p> <p>İhtiyacınıza göre değişen 3 farklı sıkıştırma ayarından birini seçerek CSS dosyalarınızı sıkıştırabilirsiniz.</p> <p><strong><a href="http://mabblog.com/cssoptimizer/compress.html">Online CSS Optimizer</a></strong></p> <p>Bir başka çevrimiçi CSS iyileştiricisi, CSS kodunuzun dosya boyutunu azaltmayı hedefliyor.</p> <p><strong><a href="http://iceyboard.no-ip.org/projects/css_compressor">Robson - CSS Sıkıştırıcısı</a></strong></p> <p>Bu CSS sıkıştırıcısı stil şablonlarına önemli değişiklikler uyguladığından ve henüz geliştirme aşamasında olduğundan, bazı CSS dosyalarında verimli çalışmayabilir.</p> <p><strong><a href="http://flumpcakes.co.uk/css/optimiser/">FlumpCakes - Çevrimiçi CSS İyileştiricisi</a></strong></p> <p>Bu araca yükleyeceğiniz CSS dosyası işleniyor ve gereksiz tüm kodlar kaldırılarak daha temiz bir koda ulaşmanız sağlanıyor.</p> <p><strong><a href="http://www.lonniebest.com/FormatCSS/">Format CSS Online</a></strong></p> <p>CSS'nizi otomatik olarak biçimlendirerek onu daha kolay okunur ve düzenlenebilir hale getirin.</p> <p><strong><a href="http://www.prettyprinter.de/">PrettyPrinter</a></strong></p> <p>Çevrimiçi kod güzelleştiricisi.</p> <p><strong><a href="http://tools.arantius.com/tabifier">Tabifier</a></strong></p> <p>Tabifier sayesinde bilgisayar kodunuzu daha okunaklı hale getirebilirsiniz.</p> <p><strong>Doğrulama</strong></p> <p><strong><a href="http://jigsaw.w3.org/css-validator/">W3C CSS Doğrulama Servisi</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-18.jpg' alt="\"\"" border="0"><br></div> <p>W3C CSS Doğrulama Servisi, web tasarımcılarının ve web geliştiricilerinin CSS dosyalarını kontrol edebilmelerini sağlıyor.</p> <p><strong><a href="http://juicystudio.com/services/csstest.php">CSS Analyser</a></strong></p> <p>Bu servis CSS dosyalarınızın doğruluğunu W3C'nin doğrulama servisi üzerinden kontrol edip, bunun yanısıra kontrast testi ve boyut testi gibi bazı farklı testleri de uyguluyor.</p> <p><strong><a href="http://services.immike.net/css-checker/">CSS Redundancy Checker</a></strong></p> <p>HTML dosyalarınızda kullanılmayan CSS seçicilerini bulmak için kullanabileceğiniz bir araç.</p> <p><strong>CSS Formları</strong></p> <p><strong><a href="http://www.jotform.com/">JotForm</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-19.jpg' alt="\"\"" border="0"><br></div> <p>İlk WYSIWYG Form Oluşturucusu. Tarayıcınızı kullanarak web formları oluşturun ve yayımlayın.</p> <p><strong><a href="http://wufoo.com/">Wufoo</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-20.jpg' alt="\"\"" border="0"><br></div> <p>Wufoo, web üzerinden bilgi toplamanızı kolaylaştırıyor.</p> <p><strong><a href="http://formsmarts.com/">FormSmarts</a></strong></p> <p>FormSmarts üzerinden formlar oluşturup onları yayımlayarak ziyaretçilerinizden çeşitli alanlarda bilgi toplayabilirsiniz.</p> <p><strong><a href="http://www.formassembly.com/">FormAssembly</a></strong></p> <p>Web Formları Oluşturun ve sorularan verilen yanıtları toplayın.</p> <p><strong>Navigasyon</strong></p> <p><strong><a href="http://www.cssmenubuilder.com/home">CSS Menu Builder</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/59-21.jpg' alt="\"\"" border="0"><br></div> <p>Web standartları ile uyumlu XHTML / CSS menüleri oluşturun.</p> <p><strong><a href="http://www.cssmenumaker.com/index.php">CSS Menu Generator</a></strong></p> <p>CSS Menü Oluşturucusu sayesinde ortalama bir web yöneticisi, çapraz tarayıcı uyumlu web site menüleri oluşturabilir.</p> <p><strong><a href="http://tabcreatr.com/">TabCreatr</a></strong></p> <p>Ücretsiz CSS Menü Oluşturucusu.</p> <p><strong>CSS Sıfırlama</strong></p> <p><strong><a href="http://meyerweb.com/eric/tools/css/reset/">Reset CSS</a></strong></p> <p>Sıfırlama stil şablonlarının hedefi, farklı tarayıcılar arasındaki tutarsızlıkları gidermektir. Bunlar arasında öntanımlı satır yükseklikleri, marjlar ve başlıkların yazıtipi boyutları gibi elementler yer alır.</p> <p><strong><a href="http://developer.yahoo.com/yui/reset/">Yahoo! UI Kütüphanesi: Reset CSS</a></strong></p> <p>Yahoo!'nun sunduğu bu CSS sıfırlaması da farklı HTML elementleri arasındaki tutarsız CSS stillerimini sıfırlayarak daha tutarlı web siteleri inşa edebilmenizi sağlıyor.</p> <p><strong><a href="http://www.crucialwebhost.com/blog/master-stylesheet-the-most-useful-css-technique/">Master Stylesheet: En Kullanışlı CSS Tekniği</a></strong></p> <p>Temel bir stil şablonu.</p> <p><strong>Boş CSS Anahatları</strong></p> <p><strong><a href="http://layouts.ironmyers.com/">168 Adet Izgara ve CSS Anahat Kolleksiyonu</a></strong></p> <p>Bu CSS anahatları tüm A sınıfı tarayıcılar için desteği içeriyor. Bunun anlamı tüm bu örneklerin Internet Explorer 6, Internet Explorer 7, Firefox, Opera, Safari ve diğerlerinde aynı şekilde görünecek olması.</p> <p><strong><a href="http://www.code-sucks.com/css%20layouts/faux-css-layouts/">42 Adet Sahte Sütunlu CSS Anahatları</a></strong></p> <p><strong><a href="http://www.code-sucks.com/css%20layouts/fixed-width-css-layouts/">53 Adet Sabit Genişlikli CSS Anahatları</a></strong></p> <p><strong><a href="http://layout.constantology.com/">___layouts</a></strong></p> <p>___layouts dosyası dilerseniz tam yakınlaştırma desteğine sahip ya da sabit genişliğe sahip beş adet ön tanımlı şablonu içeriyor.</p> <p><strong><a href="http://www.strictlycss.com/articles/article/40/the-only-css-layout-you-need">The Only CSS Layout You Need</a></strong></p> <p>Tamamı aynı HTML dosyasını kullanarak oluşturulmuş 10 farklı anahattı ve örnek sayfalarını içeren bir anahat.</p> <p><strong><a href="http://www.thenoodleincident.com/tutorials/box_lesson/boxes.html">Little Boxes</a></strong></p> <p>Tarayıcı bazlı CSS sorunları için hileler.</p> <p><strong>Diğer Araçlar</strong></p> <p><strong><a href="http://psd2cssonline.com/">PSD 2 CSS Online</a></strong></p> <p>Saniyeler içerisinde Photoshop tasarımlarınızdan dinamik web sayfaları oluşturun.</p> <p><strong><a href="http://www.conditional-css.com/">Conditional CSS</a></strong></p> <p>Bu araç sayesinde belirli tarayıcıları hedefleyen CSS kodları yazabilirsiniz.</p> <p><strong><a href="http://iterationprojects.com/evolve/">CSS Evolve</a></strong></p> <p>Bu araç sayesinde bir web sitesinin rengi, şeması, yazıtipleri, sınırları gibi elementleri üzerinde oynayabilirsiniz.</p> <p><strong><a href="http://www.csstextwrap.com/">CSS Text Wrapper</a></strong></p> <p>CSS Text Wrapper sayesinde bir HTML metnininin düz köşeleri olmayan bir görseli sarmalamasını sağlayabilirsiniz.</p> <p><strong><a href="http://www.theboxoffice.be/">The Box Office</a></strong></p> <p>Yukarıdaki araçla aşağı yukarı aynı işlemi yapan bir başka uygulama.</p> <p><i>Eğer sizin de bu listede yer almayan ancak faydalı olduğunu düşündüğünüz bir CSS aracı varsa yorumlarınızda belirtmeyi ihmal etmeyin</i>.</p> <ul> <li><strong>Kaynak</strong>: <a href="http://www.backtoessentials.com/css/the-ultimate-list-of-online-css-tools/">Back to Essentials</a></li> </ul> <p><strong>CSS İle İlgili Yazdığım Diğer Yazılar</strong></p> <ul> <li><a href="http://www.bildirgec.org/yazi/onlarsiz-yapamayacaginiz-20-tipografi-uygulamasi">Onlarsız Yapamayacağınız 20 Tipografi Uygulaması</a></li> <li><a href="http://www.bildirgec.org/yazi/ucretsiz-ve-yuksek-kaliteli-100">Ücretsiz ve Yüksek Kaliteli 100 XHTML/CSS Şablonu</a></li> <li><a href="http://www.bildirgec.org/yazi/capraz-tarayici-uyumlulugu-icin-altin">Çapraz Tarayıcı Uyumluluğu İçin Altın Değerinde İpuçları</a></li> <li><a href="http://www.bildirgec.org/yazi/960-css-catisina-yakindan-bakis">960.gs CSS Çatısına Yakından Bakış</a></li> <li><a href="http://www.bildirgec.org/yazi/css-de-uzman-olmanizi-saglayacak">CSS'de Uzman Olmanızı Sağlayacak 20 CSS Dersi</a></li> <li><a href="http://www.bildirgec.org/yazi/web-tasarimcilari-icin-12-arac">Web Tasarımcıları İçin 12 Araç ve Site</a></li> <li><a href="http://www.bildirgec.org/yazi/woork-ten-ucretsiz-el-kitabi">Woork'ten Ücretsiz El Kitabı</a></li> <li><a href="http://www.bildirgec.org/yazi/daha-hizli-sablon-olusturabilmek-icin">Daha Hızlı Şablon Oluşturabilmek İçin Kullanılabilecek 8 CSS Çatısı</a></li> <li><a href="http://www.bildirgec.org/yazi/ogrenilmesi-gereken-15-css-hilesi">Öğrenilmesi Gereken 15 CSS Hilesi</a></li> <li><a href="http://www.bildirgec.org/yazi/web-tasarimcilari-icin-kullanisli-12">Web Tasarımcıları İçin Kullanışlı 12 CSS Framework'ü, Şablonu ve Kod Sitesi</a></li> <li><a href="http://www.bildirgec.org/yazi/web-tasarimcilari-icin-web-uzerindeki">Web Tasarımcıları İçin Web Üzerindeki 6 Kullanışlı Araç</a></li> <li><a href="http://www.bildirgec.org/yazi/10-kullanisli-web-uygulamasi-arayuzu">10 Kullanışlı Web Uygulaması Arayüzü Tekniği</a></li> <li><a href="http://www.bildirgec.org/yazi/her-web-tasarimcisinin-ogrenmesi-gereken">Her Web Tasarımcısının Öğrenmesi Gereken 9 Önemli CSS Yeteneği</a></li> <li><a href="http://www.bildirgec.org/yazi/modern-css-de-altin-oran">Modern CSS'de Altın Oran</a></li> <li><a href="http://www.bildirgec.org/yazi/sadece-css-ile-olusturulmus-animasyonlu">Sadece CSS İle Oluşturulmuş Animasyonlu İlerleme Çubuğu</a></li> <li><a href="http://www.bildirgec.org/yazi/pixelleri-emlere-kolayca-donusturun">Pixelleri Emlere Kolayca Dönüştürün</a></li> <li><a href="http://www.bildirgec.org/yazi/web-tasariminda-altin-oran">Web Tasarımında Altın Oran</a></li> <li><a href="http://www.bildirgec.org/yazi/blueprint-css-framework-unu-kullanmak">Blueprint CSS Framework'ünü Kullanmak</a></li> <li><a href="http://www.bildirgec.org/yazi/sencss-layout-disindaki-hersey-icin">SenCSs: Layout Dışındaki Herşey İçin CSS Framework'ü</a></li> </ul> <p><strong><a href="http://www.bildirgec.org/rss/uye/pinkfloyd/yazi.xml">Yazılarımı RSS İstemcisi Üzerinden Takip Etmek İçin Buraya Tıklayın</a></strong></p><p><strong>ilgili yazılar</strong><ul><li><a href="http://www.bildirgec.org/yazi/web-tasarimcilari-icin-kullanisli-12">Web Tasarımcıları İçin Kullanışlı 12 CSS Framework'ü, Şablonu ve Kod Sitesi</a> (5)</li><li><a href="http://www.bildirgec.org/yazi/css-de-uzman-olmanizi-saglayacak">css'de uzman olmanızı sağlayacak 20 css dersi</a> (15)</li><li><a href="http://www.bildirgec.org/yazi/css-de-yardima-ihtiyaciniz-oldugunda">CSS'de Yardıma İhtiyacınız Olduğunda Kullanabileceğiniz 10 Kaynak</a> (7)</li><li><a href="http://www.bildirgec.org/yazi/her-web-tasarimcisinin-ogrenmesi-gereken">Her Web Tasarımcısının Öğrenmesi Gereken 9 Önemli CSS Yeteneği</a> (34)</li><li><a href="http://www.bildirgec.org/yazi/101-adet-css-kaynagi">101 Adet CSS Kaynağı</a> (10)</li></ul></p><p>Bu yazı <a href="http://www.bildirgec.org/uye/pinkfloyd">pinkfloyd</a> tarafından <a href=" http://www.bildirgec.org/yazi/cevrimici-css-araclari-listesi ">bildirgec.org</a> adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.</p><hr>Pilli Projeleri: <a href="http://pilli.com">Pilli.com: Kolektif Bağımsız İçerik</a> | <a href="http://sosyomat.com">Sosyomat.com: Arkadaşını Etiketle</a> | <a href="http://put.io">Put.io: Online Cloud Storage</a> Tue, 24 Feb 2009 19:38:00 GMT 79853@http://www.bildirgec.org/ http://www.bildirgec.org/yazi/cevrimici-css-araclari-listesi css css özellikleri css araçları css çevirici css replace css reset css based css tekniği css kaynakları css menu css tasarım css uygulama css menü css optimiser css optimizer css design css uygulamaları css dökümanları css edit css layouts css designs css referans css library css text css düzenleme css generator css kod css örnek css teknikleri css ile menü css viewer css oluştur css kodları css örnekleri css tema css temalar css yazı css kaynak css tasarımı css siteleri css siteler css menu builder css frameworks css hacks css hack css kodlar css frame AntiHumanIST <div class="imajorta"><img src='http://www.bildirgec.org/imaj/AntiHumanIST/28reflect-29ff-20eklentileri.png' alt="\"\"" border="0"><br></div><br><a href="http://www.bildirgec.org/ara/firefox%20eklenti">firefox'a eklenti</a> kurmak sanırım her web tasarımcının yaptığı birşey. özellikle kimi eklentiler hayat kurtarır nitelikte zaman kazandırıp işleri kolaylaştırıyor. benim gibi acemilerine bile kod sisteminin içinde kulaç atmayı öğreten eklentileri bir web tasarımcının kullanması gerekenler olarak <a href="http://help-developer.com/index.php/2008/06/08/10-top-firefox-addons-for-web-designers/">sıralamışlar</a>. <p><strong>Web Developer Toolbar</strong> | <a href="https://addons.mozilla.org/en-US/firefox/addon/60">detay</a><br><div class="imajorta"><img src='http://www.bildirgec.org/imaj/AntiHumanIST/webtoolbar.png' alt="\"\"" border="0"><br></div><br>çeşitli kısayollarda kaynak kodlara ulaşmanızı sağlayan küçük bir toolbar eklentisi</p> <p><strong>FireFTP</strong> | <a href="https://addons.mozilla.org/en-US/firefox/addon/684">detay</a><br><div class="imajorta"><img src='http://www.bildirgec.org/imaj/AntiHumanIST/fireftp.png' alt="\"\"" border="0"><br></div><br>internete dosyalarınızı yüklerken yeni bir program açmak yerine işleri basitçe halledebileceğiniz bir ftp eklentisi</p> <p><strong>Firebug</strong> | <a href="https://addons.mozilla.org/en-US/firefox/addon/1843">detay</a><br><div class="imajorta"><img src='http://www.bildirgec.org/imaj/AntiHumanIST/firebug.png' alt="\"\"" border="0"><br></div><br>işte firefoxun belki de en beğendiğim fantastik eklentisi. gerçek zamanlı düzenlemeler yapabileceğiniz, CSS, HTML ve JavaScript kodlarını incelemenize olanak tanıyan, hataları gözler önüne seren, kısaca sitenin röntgenini çeken süper ötesi bir eklenti.</p> <p><strong>Screengrab</strong> | <a href="https://addons.mozilla.org/en-US/firefox/addon/1146">detay</a><br><div class="imajorta"><img src='http://www.bildirgec.org/imaj/AntiHumanIST/screenshot1.png' alt="\"\"" border="0"><br></div><br>web sitelerinin tam ekran görüntüsünü almak bazen işkenceye dönüşebilir. işte bu eklentiyle bu işi en kolayından halledebiliyorsunuz.</p> <p><strong>CSS Viewer</strong> |<a href="https://addons.mozilla.org/en-US/firefox/addon/2104"> deta</a> <br><div class="imajorta"><img src='http://www.bildirgec.org/imaj/AntiHumanIST/cssviewer.png' alt="\"\"" border="0"><br></div><br>çok faydalı bir css görüntüleyici olan bu eklenti ile, css i öğrenmeniz kolaylaşabilir.</p> <p><strong>IE NetRenderer </strong>| <a href="https://addons.mozilla.org/en-US/firefox/addon/6455">detay</a><br><div class="imajorta"><img src='http://www.bildirgec.org/imaj/AntiHumanIST/netrenderer.png' alt="\"\"" border="0"><br></div><br>tasarımlarınızı firefox ta hazırlıyorsanız, browser uyumluluğunu göz ardı etmemek için IE 5.5, 6, 7 ve Beta 8 de sitenizin nasıl göründüğünü bu eklenti sayesinde kolayca görebilirsiniz.</p> <p><strong>Window Resizer</strong> | <a href="https://addons.mozilla.org/en-US/firefox/addon/1985">detay</a><br><div class="imajorta"><img src='http://www.bildirgec.org/imaj/AntiHumanIST/windowresizer.png' alt="\"\"" border="0"><br></div><br>web tasarımlarınızı yaptığınız çözünürlük dışında 640×480, 800×600, 1024×768, 1280×1024 ve 1600×1200 çözünürlükte de görmek isterseniz bu eklentiyi arıyorsunuz.</p> <p><strong>Dummy Ipsum</strong> | <a href="https://addons.mozilla.org/en-US/firefox/addon/2064">detay</a><br><div class="imajorta"><img src='http://www.bildirgec.org/imaj/AntiHumanIST/screenshot-2.png' alt="\"\"" border="0"><br></div><br>hazır templateler hazırlayan bir tasarımcı iseniz sizin için rastgele yazılar hazırlayan bir eklenti.</p> <p><strong>Font Finder</strong> | <a href="https://addons.mozilla.org/en-US/firefox/addon/4415">detay</a><br><div class="imajorta"><img src='http://www.bildirgec.org/imaj/AntiHumanIST/fontfinder.png' alt="\"\"" border="0"><br></div><br>bu da seçtiğiniz metinin bütün bilgilerini sizinle paylaşan güzel bir eklenti.</p> <p><strong>Offline Page Validator</strong> | <a href="https://addons.mozilla.org/en-US/firefox/addon/6006">detay</a><br><div class="imajorta"><img src='http://www.bildirgec.org/imaj/AntiHumanIST/screenshot-4.png' alt="\"\"" border="0"><br></div><br>sayfanızı tek tıkla W3C validator e gonderebileceğiniz sizi rahatlatan bir uygulama.</p> <p>yazının orjinali için şöyle <a href="http://help-developer.com/index.php/2008/06/08/10-top-firefox-addons-for-web-designers/">buyrun</a>.</p><p>Bu yazı <a href="http://www.bildirgec.org/uye/AntiHumanIST">AntiHumanIST</a> tarafından <a href=" http://www.bildirgec.org/yazi/web-tasarimcilar-icin-10-firefox ">bildirgec.org</a> adresli sitede yayımlanmak üzere yazılmıştır. Kaynak gösterilmeksizin kopyalanamaz.</p><hr>Pilli Projeleri: <a href="http://pilli.com">Pilli.com: Kolektif Bağımsız İçerik</a> | <a href="http://sosyomat.com">Sosyomat.com: Arkadaşını Etiketle</a> | <a href="http://put.io">Put.io: Online Cloud Storage</a> Wed, 02 Jul 2008 17:27:00 GMT 71529@http://www.bildirgec.org/ http://www.bildirgec.org/yazi/web-tasarimcilar-icin-10-firefox eklenti firefox uygulama addon firebug addons screengrab ie netrenderer web developer toolbar offline page validator font finder dummy ipsum window resizer css viewer