http://www.bildirgec.org/ tr-tr 40 bildirgec.org - Asmunikal - beğendikleri Asmunikal <p>internetteki birçok uygulamanın günlük hayatı referans alıp hazırlandığını sıksık görüyoruz.. bunlardan biride resimli <a href="/etiket/dergi">dergi</a>mizin üzerine gelip mause imleci ile resmin sağ alt kısmında sayfaları çevirmek..</p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pisho/bookr.PNG' alt="bookr" border="0"><br>bookr</div> <p>işte bu online hizmeti bizlere sunan <a href="http://www.pimpampum.net/bookr/index.php">pimpampum</a> sitesi ile güzel <a href="etiket/flash">flash dergi</a>ler hazırlayabilir ve sitelerimize entegre edebiliriz.. öncelikle şunu hatırlatmalıyımki uygulama <a href="http://www.bildirgec.org/etiket/flickr">flickr</a> ile eşgüdümlü çalışıyor.. yani siz sanal derginizi hazırlarken eklemeniz gereken resimleri sadece flickr'den seçebiliyorsunuz.. <a href="http://www.pimpampum.net/bookr/index.php">buradan</a> siteyi ziyaret edebilirsiniz.. <a href="http://www.pimpampum.net/bookr/archive.php">şurdan</a> da başkalarının yapmış olduğu çalışmaları inceleyebilirsiniz.</p> <p>ayrıca <a href="http://www.pimpampum.net/toys/">şu linkten</a> de ilgili sitenin yapmış olduğu diğer flicker çalışmalarınıda inceleyebilirsiniz..</p><p>Bu yazı <a href="http://www.bildirgec.org/uye/Asmunikal">Asmunikal</a> tarafından <a href=" http://www.bildirgec.org/yazi/flash-tabanli-cevrilen-dergi-hazirlayin ">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> Sun, 11 May 2008 10:43:00 GMT 198216@http://www.bildirgec.org/ http://www.bildirgec.org/yazi/flash-tabanli-cevrilen-dergi-hazirlayin Asmunikal <div class="imajsol"><img src='http://www.bildirgec.org/imaj/pinkfloyd/14-00.jpg' alt="\"\"" border="0"><br></div>"Eğer düzenli olarak web siteleri oluşturan ve geliştiren kişilerden biriyseniz, o zaman şablon (template) oluşturma, kullanışlı kodları arşivleme ve bunun gibi diğer şeyler hakkında düşünmeye başlamalısınız. Özellikle bu gibi şeyleri geliştirme işlemi süresini kısaltmak için yapmalısınız, bu sayede her yeni bir proje başlangıcında bu şablon üzerinde gerekli değişiklikleri yaparak aynı şeyleri tekrar tekrar yazmak zorunda kalmazsınız. Ancak bu tip kod parçacıklarını ya da başkaları tarafından hazırlanmış eserleri projenizde kullanmaya başlamadan önce mutlaka ama mutlaka indirdiğiniz ürünün lisans sözleşmelerini okuyun... Pek çok geliştirici ve tasarımcı, Internet üzerinden ücretsiz olarak dağıttıkları içeriği çoğunlukla bireysel kullanımlar için ücretsiz, kurumsal kullanımlar için ücretli olarak yayımlarlar. <p>Yazımın devamında kendimce en iyilerin en iyilerini derlediğim ve <strong>web tasarımcıları için gerçekten kullanışlı 12 css framework'ünü, şablonunu ve kod sitesini</strong> bulacaksınız.</p> <p><strong>1. <a href="http://csstidy.sourceforge.net/">CSSTidy</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/14-01.jpg' alt="\"\"" border="0"><br></div> <p>"CSSTidy açık kaynaklı bir CSS bölümleyicisi ve optimize edicisidir. Komut satırı üzerinden kontrol edilebilen ve Windows, Linux ve Mac için ayrı ayrı sürümleri bulunan bu uygulamanın ayrıca bir PHP betiği de bulunuyor. Gerek masaüstü yazılımı gerekse de PHP betiği aşağı yukarı aynı özelliklere sahip.<br><br>Pek çok diğer CSS bölümleyicisinin aksine herhangi bir kurallı ifadenin kullanılmamış olması, tam CSS2 desteği ve yüksek kararlılığı ile CSSTidy, benzerlerinden ayrılıyor."</p> <p>Bu bilgiyi kendi siteleri üzerinden çevirdim, zira her şeyi benim açıklayabileceğimden çok daha iyi özetlemiş.</p> <p>Bazı insanlar derhal şu soruyu sorabilirler: Neden CSS kodumu optimize etmeliyim? Sadece kodunuzun daha temiz olmasının yanısıra ilgili kodları yüklediğiniz sayfaların daha hızlı açılması gibi nedenler hem ziyaretçilerinizi hem de sizi memnun edeceğinden, kodunuzu optimize etmemeniz için herhangi bir sebep bulunmamaktadır.</p> <ul> <li><a href="http://csstidy.sourceforge.net/download.php">Masaüstü Yazılımı</a></li> <li><a href="http://floele.flyspray.org/csstidy//css_optimiser.php">Çevrimiçi Sürümü</a></li> </ul> <p><!-- buradan kes --></p> <p><strong>2. <a href="http://cleancss.com/">Clean CSS</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/14-02.jpg' alt="\"\"" border="0"><br></div> <p>Bu da CSS Tidy ile benzer işi yapmasına rağmen daha güzel görünüyor. Benim iyi tasarımlara olan ilgim ağır bastığı için ben bu aracı tercih ediyorum. Ancak seçim sizin! Kendi favorinizi seçin, ve dilerseniz nedenleri ile birlikte yorumlarınızı yazın.</p> <p><strong>3. <a href="http://www.blueprintcss.org/">BluePrint CSS</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/14-03-01.jpg' alt="\"\"" border="0"><br></div> <p>Daha önce BluePrint CSS Framework'ü hakkında yazdığım detaylı makaleyi eğer hala okumadıysanız hemen şimdi bir <a href="http://www.bildirgec.org/yazi/blueprint-css-framework-unu-kullanmak">göz atmanızı</a> şiddetle öneririm. BluePrint bir <strong>CSS Framework</strong>'ü olup CSS geliştirmek için harcadığınız zamanı kısaltmayı hedeflemektedir. BluePrint CSS Framework'ü, kullanımı kolay ızgara sistemi, işlevsel tipografisi ve hatta yazıcı çıktısı için ayrı bir stil şablonu ile projelerinizi üzerine inşa etmeniz için mükemmel bir temel sunar."</p> <p>Çok kullanışlı şablon dosyaları sayesinde aynı şeyi tekrar tekrar kodlamanın önüne geçerek, zamanınızı tasarıma ve projenizin işlevselliğine odaklamanız, BluePrint CSS Framework'ü sayesinde artık mümkün.</p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/14-03-02.jpg' alt="\"\"" border="0"><br></div> <p>Eğer siz de popülerliği gittikçe artan bu Framework hakkında ayrıntılı bilgi sahibi olmak ve nasıl kullanılacağını öğrenmek istiyorsanız, o zaman <a href="http://www.bildirgec.org/yazi/blueprint-css-framework-unu-kullanmak">BluePrint CSS Framework'ü Nasıl Kullanılır</a> başlıklı yazımı mutlaka okuyun.</p> <p><strong>4. <a href="http://www.code-sucks.com/">Code-Sucks</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/14-04-01.jpg' alt="\"\"" border="0"><br></div> <p>Pek çok farklı CSS anahattı (CSS layout), kod parçacıkları (CSS, JavaScript, PHP) ve web site şablonlarını (template) içeren bu site özellikle web geliştirme aşaması sırasında oldukça kullanışlı hale geliyor.</p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/14-04-02.jpg' alt="\"\"" border="0"><br></div> <p><strong>5. <a href="http://snipplr.com/">Snipplr</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/14-05.jpg' alt="\"\"" border="0"><br></div> <p>Snipplr özellikle pek çok kod parçacığını (JavaScript, HTML, PHP, CSS, Ruby) depolamak ve organize etmek için çok kullanışlı bir araç. Özellikle bu kod parçacıkları, sizin de tahmin edeceğiniz üzere web geliştirme aşaması sırasında oldukça kullanışlı hale geliyor. Ayrıca site üzerinden dilediğiniz kod parçacıklarını da paylaşmak mümkün olduğundan arkadaşlarınızla paylaşmak istediğiniz kod parçacıklarını site üzerinde depolayabiliyorsunuz. Sitenin "popüler kod parçacıkları" bölümü herkes tarafından en çok kullanılan kod parçacıklarını listeliyor. Gerçekten muhteşem. Son olarak eğer TextMate kullanıyorsanız bu kod parçacıklarının TextMate ile çalıştığını da hatırlatalım.</p> <p><strong>6. <a href="http://css.maxdesign.com.au/">MaxDesign</a></strong></p> <p>Bu siteyi belki de biliyorsunuzdur, sanırım bu siteden daha önce bahsetmiştim, ancak durum öyle olsa bile bu site tekrar tekrar bahsedilebilecek kadar güzel ve gerçekten kullanışlı bir site.</p> <p>Site üzerinde listamatic1 adı verilen ve tek bir listeyi farklı şekillerden nasıl stilleyebileceğinizi gösteren bir uygulamanın yanısıra içiçe geçmiş listelere yönelik stilleme örnekleri de listamatic2 adı altında toplanmış. Özellikle CSS tabanlı listeler, yaslanmış CSS elementleri ve CSS seçicilerini kullanmak isteyenler için birebir!</p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/14-06.jpg' alt="\"\"" border="0"><br></div> <p><strong>7. <a href="http://meyerweb.com/eric/tools/css/reset/">MeyerWeb CSS Reset</a></strong></p> <p>Eric Meyer'in CSS Sıfırlaması çok popüler. Tarayıcınızın öntanımlı stilleme elementlerini sıfırlamak ve ardından kendi elementlerinizi üzerine inşa etmek için birebir olan bu CSS sıfırlama tekniği gerçekten pek çok tarayıcı kaynaklı sorunu gidermenizi kolaylaştırıyor.</p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/14-07.jpg' alt="\"\"" border="0"><br></div> <p><strong>8. <a href="http://developer.yahoo.com/yui/examples/">YUI Library</a></strong></p> <p>"Her bir YUI kütüphane bileşeni, 300'ün üzerinde örneği de içeriyor ve siz bu sayede ilgili bileşenin projelerinize nasıl entegre edilebileceğini anlıyorsunuz. Bu örnekler YUI'yi öğrenebilmeniz için bir başlangıç noktası özelliğini taşıyor ve sunulan kod parçacıkları kendi programlamanızı üzerine inşa edebilmenizi kolaylaştırıyor. Dilerseniz çeşitli etkileşim öğelerinin web tarayıcısı üzerinden YUI aracılığı ile nasıl etkinleştirildiğini de örnek kodlara bakarak görebilirsiniz."</p> <p>Başlangıç aşamasında çok kullanışlı şablon dosyalarının yanısıra neredeyse her web tasarımcısını tatmin edecek güzel bir kolleksiyona da sahip olacaksınız.</p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/14-08.jpg' alt="\"\"" border="0"><br></div> <p><strong>9. <a href="http://960.gs/">960 Grid System</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/14-09.jpg' alt="\"\"" border="0"><br></div> <p>Bu ızgara sistemi gerçekten oldukça popüler hale geliyor. Geliştiricileri sık olarak kullanılan ölçülerden biri olan 960px genişliğinde web sayfaları hazırlayıp onu 12lik ve 16lık ızgaralar halinde bölümlendirerek içeriğinizi yerleştirebilmenizi sağlıyor. Tasarımcılar sitelerin harmonisini bozmamak ve kullanılırlığı arttırmak için ızgara sistemlerini kullanırlar. 960 Izgara Sistemi'ni indirdiğinizde bir dizi şablon ve taslağa da kavuşacaksınız. Bu örnekler özellikle doğru eller tarafından işlendiğinde harikalar yaratabiliyor.</p> <ul> <li><a href="http://960.gs/files/960_download.zip">İndir</a></li> <li><a href="http://www.1stwebdesigner.com/wp-content/uploads/2009/01/demo.html">Örnek</a></li> </ul> <p><strong>10. <a href="http://sencss.kilianvalkhof.com/">SenCSS - Sensible Standards CSS Framework</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/14-10.jpg' alt="\"\"" border="0"><br></div> <p>Bu framework, Eric Meyer'in sıfırlama sistemini kullanıyor, ancak bunun dışında temel stilleme, yeniden sıfırlamaya gerek bırakmayacak şekilde optimize edilmiş kod ve çok daha fazlasını sunuyor. Kendisini <a href="http://www.bildirgec.org/yazi/sencss-layout-disindaki-hersey-icin">layout dışındaki her şey için CSS framework'ü</a> olarak tanıtmış olan ve site anahatları standart dışı olduğu için ya da herhangi bir sebeple ızgara sistemlerini kullanmak istemeyenlerin isteklerine cevap verecek nitelikte.</p> <p><strong>11. <a href="http://www.spiffycorners.com/">Yuvarlatılmış CSS Köşeler</a></strong></p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/14-11.jpg' alt="\"\"" border="0"><br></div> <p>Eminim bugüne kadar yarısı bildirgec üzerinde olmak üzere pek çok platformda CSS ile nasıl yuvarlatılmış köşeler hazırlanabileceğine dair pek çok rehber okumuşsunuzdur. Bu çevrimiçi araç sayesinde yuvarlatılmış köşeleri kolayca oluşturabilecek ve ihtiyacınız olan kodu derhal alabileceksiniz.</p> <p><strong>12. <a href="http://www.contentwithstyle.co.uk/content/a-css-framework">Content With Style</a></strong></p> <p>Yeni web sitelerini kolayca geliştirip tasarımınız üzerine odaklanabileceğiniz güzel bir framework kolleksiyonu daha.</p> <div class="imajorta"><img src='http://www.bildirgec.org/imaj/pinkfloyd/14-12.jpg' alt="\"\"" border="0"><br></div> <p>Umarım bu siteleri hem yeteneklerinizi geliştirmek hem de projelerinizin geliştirme sürecini kısaltmak adına düzenli olarak kullanırsınız. Eminim yukarıdakilerin dışında daha pek çok site bulunuyor. Eğer sizin de tavsiye ettiğiniz siteler var ise, yorumlarınızla paylaşabilirsiniz.</p> <ul> <li><strong>Kaynak:</strong> <a href="http://www.1stwebdesigner.com/resources/12-really-handy-css-framework-template-and-snippet-sites-for-smart-web-designer/">1st Web Designer</a></li> </ul> <strong>CSS İle İlgili Daha Önce Yazdığım Yazılar</strong> <ul> <li><a href="http://www.bildirgec.org/yazi/web-tasariminda-bosluklari-verimli-olarak">web tasarımında boşlukları verimli olarak kullanmak</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 (Progress Bar)</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/jquery-siz-mootools-suz-basit">jQuery'siz, mootools'suz Basit Sekmeli İçerik Oluşturalım</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>Bu yazı <a href="http://www.bildirgec.org/uye/Asmunikal">Asmunikal</a> tarafından <a href=" http://www.bildirgec.org/yazi/web-tasarimcilari-icin-kullanisli-12 ">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> Fri, 23 Jan 2009 09:33:00 GMT 193310@http://www.bildirgec.org/ http://www.bildirgec.org/yazi/web-tasarimcilari-icin-kullanisli-12 Asmunikal <div class="imajorta"><img src='http://www.bildirgec.org/imaj/filezza/ultimate.png' alt="free css drop-down menu" border="0"><br>free css drop-down menu</div> <p>Tomas Bagdanavicius tarafından geliştirilmiş ve ücretsiz olarak sunulan, aralarında NVIDIA.com, Adobe.com, MTV.com sitelerinin <a href="http://www.bildirgec.org/etiket/men%C3%BC">menü</a> örneklerinin de yer aldığı, Aşağı Açılır (Drop-Down) <a href="http://tr.wikipedia.org/wiki/Stil_%C5%9Fablonlar%C4%B1">css</a> menüler, hız, kullanım ve düzenleme esneklikleri ile <a href="http://www.bildirgec.org/etiket/web-site">site</a> menüleriniz için güzel alternatifler olacaklar.</p> <p><a href="http://www.nvidia.com/">NVIDIA.com</a> sitesinin menü örneğini görmek için <a href="http://lwis.net/free-css-drop-down-menu/dropdown.nvidia.com.html">buraya tıkla</a>yabilirsiniz.<br><div class="imajorta"><img src='http://www.bildirgec.org/imaj/filezza/nvidia.png' alt="NVIDIA.com horizontal improved css drop-down menu " border="0"><br>NVIDIA.com horizontal improved css drop-down menu </div><br><!-- buradan kes --><br><a href="http://www.adobe.com/">Adobe.com</a> sitesinin menü örneğini görmek için <a href="http://lwis.net/free-css-drop-down-menu/dropdown.adobe.com.html">buraya tıkla</a>yabilirsiniz.<br><div class="imajorta"><img src='http://www.bildirgec.org/imaj/filezza/adobe.png' alt="Adobe.com horizontal improved css drop-down menu " border="0"><br>Adobe.com horizontal improved css drop-down menu </div></p> <p><a href="http://www.mtv.com/">MTV.com</a> sitesinin menü örneğini görmek için <a href="http://lwis.net/free-css-drop-down-menu/dropdown.mtv.com.html">buraya tıkla</a>yabilirsiniz.<br><div class="imajorta"><img src='http://www.bildirgec.org/imaj/filezza/mtv.png' alt="MTV.com horizontal css drop-down menu" border="0"><br>MTV.com horizontal css drop-down menu</div></p> <p>Şu an, 14 örnek ile gelen menü paketini indirmek ve daha fazla bilgi almak için <a href="http://lwis.net/free-css-drop-down-menu/">buraya tıkla</a>yabilirsiniz.</p> <p>(Not: Tamamen css ile geliştirilmiş, birçok tarayıcı ile sorunsuz çalışan menüler, <a href="http://www.microsoft.com/windows/ie/ie6/default.mspx">IE6</a> için <a href="http://tr.wikipedia.org/wiki/JavaScript">JavaScript</a> kütüphaneleri <a href="http://jquery.com/">Jquery</a> ve <a href="http://script.aculo.us/">Scriptaculous</a> ile desteklenmektedir.)</p><p>Bu yazı <a href="http://www.bildirgec.org/uye/Asmunikal">Asmunikal</a> tarafından <a href=" http://www.bildirgec.org/yazi/css-asagi-acilir-drop-down ">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, 26 Nov 2008 07:12:00 GMT 186550@http://www.bildirgec.org/ http://www.bildirgec.org/yazi/css-asagi-acilir-drop-down Asmunikal <p>animasyonlarda kullanabileceğimiz kategorilere ayrılmış <a href="http://www.findsounds.com/types.html">ses dosyaları</a></p><p>Bu yazı <a href="http://www.bildirgec.org/uye/Asmunikal">Asmunikal</a> tarafından <a href=" http://www.bildirgec.org/yazi/bir-suru-ses-dosyasi ">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> Sun, 26 Mar 2006 14:37:00 GMT 186549@http://www.bildirgec.org/ http://www.bildirgec.org/yazi/bir-suru-ses-dosyasi