Bu sorunun cevabını bulmak o kadar da kolay değil aslında. Fireworks, bir taslak ya da wireframe aracı mı? Güçlü bir grafik tasarım editörü mü? Photoshop’a rakip mi? Yalnızca web tasarım için mi? Hepsi ya da hiçbiri mi? Bu yazıda bu sorulara cevap bulacaksınız.

Fireworks nedir?

Fireworks, 2006 yılında Macromedia tarafından geliştirilmeye başlanan ve sonrasında Adobe tarafından devralınan bir vektör grafik editörüdür. Üretiliş amacı, web, ekran ve çeşitli aygıtlar için etkileyici, iyi optimize edilmiş grafikler tasarlamaktır.

Neler yapılabilir?

Fireworks ile kolaylıkla vektör ve bitmap modlarında websiteleri, kullanıcı arayüzleri (UI) ve zengin web uygulamaları (RIA) tasarlanabilir. Aynı zamanda wireframe’ler çizebilir, interaktif prototipler üretebilirsiniz. Yaptığınız çalışmaları tıklanabilir PDF modunda export edebilirsiniz. Photoshop ve Illustrator’da da karşınıza çıkabilecek pek çok benzer araca Fireworks’de de rastlamanız mümkün.

Fireworks bir anda grafik tasarım projesinden, interaktif web prototipine de dönüşebilir. Bunu daha da açıklama gerekirse; Fireworks ile yaptığınız (single-page, multi-page) PNG tasarımı, çok basit bir şekilde HTML, CSS ve image formatlarında export ederek zamandan da kazanabilirsiniz. Çıktısını aldığınız markup üzerinde de istediğiniz kod editörleri ile (Coda, Dreamweaver gibi) istediğiniz gibi düzenleme yapabilirsiniz.

Export Özellikleri

Fireworks, JPG, GIF/GIF-animated, PNG8/24 ve 32, TIFF ve çeşitli diğer grafik formatlarında export seçeneklerine sahip. Bu kadar export seçeneğinin yanı sıra Photoshop’dan çok daha iyi bir sıkıştırma algoritmasına, sıkıştırma sistemine sahip. Sıkıştırma konusu hakkında detaylı ve teknik bilgiyi burada tekrar sunmak yerine sizleri sevgili dostum Atakan Uslu‘nun websitesinde konuk yazar olarak yazmış olduğum Fireworks vs. Photoshop (Performans) adlı yazısına yönlendirebilirim.

Aynı zamanda Fireworks, PNG dosyalarını Adobe AIR uygulaması şeklinde, ya da Flash Catalyst ve Flash Builder üzerinde geliştirilmesi yapılan FXG 2.0 şeklinde de export edebiliyoruz. (FXG 2.0, Illustrator ve Photoshop ile de oldukça verimli çalışıyor) Böylece Flash Builder’da da kullanabilmek için gönül rahatlığıyla buton, menü ve form öğeleri (skin components) oluşturabiliyoruz. (Eski ismiyle Adobe Flex Builder olarak bilinir.)

Format Desteği

Fireworks, Photoshop (.psd) ve Illustrator (.ai) dosyalarını sorunsuzca açabiliyor. Katmanlarda, efektlerde vs. size herhangi bir kayba uğratmıyor. Sorunsuzca açabildiği gibi bu dosyaları aynı şekilde Illustrator ve Photoshop’a da transfer etmenize olanak sağlıyor.

Esneklik

Fireworks’ün bir diğer artı yanı da esnek olması. Bu da Fireworks üzerine uzantılar geliştirilebiliyor demek oluyor. Buna örnek olarak TweetFire isimli küçük yazılım verilebilir. Bu yazılım sayesinde, o an Fireworks ile üzerinde çalıştığınız projeyi fazla uğraşmadan Twitter’da takipçilerinizle paylaşabilirsiniz

Son Sözler

“Fireworks mü? Photoshop mu?” gibi sorular sosyal platformlarda tartışılmaya devam ediyor. Siz hangisini, niçin tercih ediyorsunuz? Yorumlarınız ile yazıya katkıda bulunabilir, bu konuyu takipçilerimle tartışabilirsiniz.

W3C‘nin 2001 yılından beri listesinde yer alan bir teknoloji olsa da şu ana dek hakettiği değeri görememiş bir kavram SVG. Bunun sebeplerinden biri de Internet Explorer kullanıcılarının herhangi bir plugin olmadan bu nesneleri görüntüleyememesiydi.

SVG nedir?

Çizgiler, kutular, daireler, çokgenler, renkli yazılar, renk geçişleri ve dokular gibi vektörlerin tasvir edildiği XML tabanlı bir dosya formatıdır. Bitmap‘ler de gerekli olduğu zaman SVG içerisine yerleştirilebilir.

SVG’yi Kullanmak İçin Varolan Sebepler

SVG’nin web platformunda kullanılması için pek çok geçerli sebep vardır:

• W3C Standartları: SVG, open standard olarak tabir edebileceğimiz, web geliştiricilerinin herhangi bir kısıtlamayla ya da lisans sorunuyla uğraşmaksızın kullanabileceği bir teknoloji.
• Ölçeklendirme: Pixel bozukluğu ya da detaylarda hiçbir kayba sebebiyet vermeden, sorunsuzca boyutlandırılabilir.
• Dosya Boyutları: JPG, PNG ya da GIF formatındakilerin aksine boyutları daha düşüktür. Logolar ve çeşitli tablolar için tercih edilebilir.
• SVG Araçları: Inkscape, OpenOffice.org Draw ve Microsoft Visio gibi programlarla XML formatında kodlar kolaylıkla oluşturulabilir.
• Server-Side Desteği: PHP, .NET, Python ve diğer diller/frameworkler üzerinde sorunsuzca görüntülenebilir.
• Client-Side Desteği: Sıradan bir internet kullanıcısının web tarayıcısında JavaScript desteği ile görüntülenebilir, çeşitli efektler ve animasyonlar ile özelleştirilebilir ve JavaScript event handler metodları uygulanabilir. (Click, mouseover vb.)
• Erişilebilirlik: SVG’ler erişilebilirdir. Yazılmış ve çizilmiş elementler çeşitli aygıtlar tarafından da parse edilebilir.
• Arama Motoru Optimizasyonu: Google, Yahoo, Bing ve diğer arama motorlarının taramakta zorlandığı resimleri (JPG, GIF, PNG vb.) SVG ile daha iyi bir şekilde sunabiliriz.

Bazı sebeplerden ötürü Canvas, SVG’nin yerini almış olsa da ve hiçbir plugine ihtiyaç duymaksızın Internet Explorer tarafından görüntülense de, static rendering’e izin vermiyor, resimler kod ile üretiliyor. Canvas ile çizilen elementler de DOM tarafından tanımlanamıyor.

Internet Explorer, 9. sürümüne kadar SVG desteği sunmayan ve SVG’nin genel anlamda yaygınlaşamamasının sebeplerinden biriydi. Microsoft, IE9 ile SVG desteğini vermeye başladığını duyurmuştu, ancak her işte olduğu gibi yüzüne gözüne bulaştırdığından emin olabilirsiniz.

Son birkaç yıldır web hosting alanında önemli gelişmeler yaşanıyor. CDN’ler bu gelişmelerden yalnızca bir tanesi. Websitenizi oluşturan objeleri tek bir sunucu üzerinden çağırmak yerine, farklı ve çapraz sunucular kullanarak yüklenme hızlarında önemli artışlar yakalayabiliyoruz…

Bir CDN üzerinde ne tür dosyalar barındırılabilir?

Genellikle CDN’ler üzerinde statik kaynaklar barındırılır. Bunlara örnek olarak: resimler, videolar, ses dosyaları, CSS dosyaları, JavaScript dosyaları verilebilir. Yaygın olarak kullanılan JavaScript kütüphanelerini, CSS reset dosyalarını, fontları ve bunun gibi pek çok veriyi genel ve özel CDN sistemleri üzerinde barındırabiliyoruz.

CDN Servisleri

Google, Microsoft ve Yahoo gibi ücretsiz CDN hizmeti sağlayan büyük web organizasyonları da mevcut. YouTube ve Vimeo da videolarımızı barındırabileceğimiz CDN servislerine örnek olarak verilebilir. Yine bunlara benzer olarak eğer web sayfamıza jQuery kütüphanesini entegre etmek istiyorsak aşağıdaki kodu kullanabiliyoruz. Böylece jQuery, Google’ın sunmuş olduğu CDN hizmeti aracılığıyla sayfamıza dahil oluyor.

1

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>

Ücretsiz hizmetler haricinde, daha kapsamlı ve özel hizmet almak isteyen kullanıcılar için özel ticari CDN’ler de var. Amazon S3, Microsoft Windows Azure ve MaxCDN websiteleri üzerinde belli ücretler karşılığında dosyalarımızı barındırmak için özel CDN hizmeti satın alabiliyorsunuz.

CDN Kullanmanın Avantajları

Peki CDN kullanmanın ne gibi avantajları vardır? Bizlere ne gibi bir yarar sağlar, şimdi de bunlara değinelim.

• Farklı Domainler: Web tarayıcıları, bir websitesinin yüklenme aşamasında önbelleğe alınan dosya sayısına kısıtlama getirir. Bu yüzden anlık olarak 3 – 4 dosya işleme alınır. Farklı adreslerden çekilen dosyalar olduğu zaman kısıtlama işlemi ortadan kalkar ve websitesinin yüklenmesi daha da hızlı bir hale gelir. Örneğin bir websitesinden aynı anda 3-4 dosya indirmeye çalıştığımızda, diğer dosyaların indirilme işlemi tamamlanmadan, diğer dosyaların indirilmesi başlamamaktadır.
• Önbelleğe Alınan Dosyalar: jQuery gibi büyük yankı uyandıran bir JavaScript kütüphanesini kullanmak için Google CDN’deki dosyayı kullanmak çoğu zaman için daha avantajlıdır. Çünkü Google CDN üzerinden çalışan bir jQuery dosyasını bilgisayarında önbelleğe alan bir kullanıcı, aynı CDN üzerinden çalışan başka bir websitesine girdiğinde bu dosya zaten daha önceden önbelleğe alındığı için aynı dosyayı bir daha yüklemeye çalışmayacak, direkt olarak önbellekten okuyarak açılış hızında artış yakalayacaktır.
• Paylaşımlı Veri Merkezleri: Eğer web sunucunuz Amerika’da ise ve websitenizi ziyaret eden kullanıcılar Avrupa ve Asya’da yaşıyorlarsa, bu ziyaretçilerin veri erişim süreleri Amerika’da bulunan ziyaretçilere oranla daha uzun olabilir. CDN’lerin lokalize veri merkezleri sayesinde daha hızlı veri transferi sağlanabiliyor.
• Versiyon Kontrol Mekanizması: Çoğunlukla CSS ve JavaScript dosyalarının son stabil sürümleri request edilir, bu sayede daha temiz ve stabil çalışılmış olunur.
• Kullanım İstatistikleri – Raporlama: Pekçok ticari CDN, byte cinsinden kullanım raporları sunarak dosyalarınızın indirilme, kullanılma sayıları gibi verileri sizlere sunar. Bu sayede websitenizin ne kadar ziyaretçi aldığını, videoların izlenme sayısını vb. bilgileri görebilirsiniz.
• Performans: Sunucu yükü, aylık trafik ve hosting için ödediğiniz ücretlerde verim sağlayabilirsiniz.

Bundan birkaç ay önce “Paylaşımlar ne üzerine olmalı?” adlı bir anketi ziyaretçilere açmıştım. Uçuk rakamlarda WordPress Temaları şıkkı işaretlenince ziyaretçilerin de isteklerine ayak uydurayım düşüncesiyle bir WordPress teması yapmaya karar verdim.

İş yükümün ve temponun hafiflediği şu dönemlerde iyi bir fırsat yakaladım ve değerlendirmeye koyuldum. 2 gün süren çizim sürecinden ve 3 gün süren kodlama çalışmalarından sonra temayı kullanıma hazır hale getirmiş bulunmaktayım.

Özellikler

Tema, HTML5 ile kodlayıp paylaştığım 3. nesil WordPress teması oldu. Aynı zamanda CSS3′ün de çeşitli nimetlerinden faydalandım. 2 sütundan oluşuyor. Önceki temaların aksine, bu kez bileşen desteği kazandırdım. Stabil çalışması için birkaç eklenti gerekiyor. Bu eklentiler ve ayarları indireceğiniz dosya içerisinde bulunuyor. Kullanılan eklentileri de aklıma gelmişken listeleyeyim.

• Breadcrumb NavXT
• Recent Comments
• PageNavi
• PostViews

Twitter ve Sosyal Ağlar

Sağ sütunda bulunan Twitter ve Sosyal Ağlar adlı bölümleri kendinize göre değiştirebilmeniz için sidebar.php dosyasını düzenlemeniz gerekmektedir. Benim hazırladığım sidebarı kullanmak istemeyenler Görünüm – Bileşenler bölümünden kendi bileşenlerini kullanabilirler.

Önizleme

Son Sözler

Velhasıl-ı kelam 5 günün sonunda ekrana yansıyan bu oldu. Şimdilik bu kadar sanırım. Tema hakkında sormak istediğiniz, yardıma ihtiyaç duyduğunuz konuları, yazının hemen altında bulunan Yorumlar kısmında dile getirebilirsiniz. Elimden geldiği ve dilimin döndüğünce size yardımcı olmaya çalışırım.

İyi kullanımlar diliyorum. Umarım beğenmişsinizdir. Yeni temalar ve makalelerde görüşünceye dek hoşçakalın…

İndir

Note: There is a file embedded within this post, please visit this post to download the file. Note: There is a file embedded within this post, please visit this post to download the file.

Hepimiz erişilebilirlik (accessibility) öğesinin tasarımlarda önemli bir etken olduğunu biliyoruz, ama içimizden kaç kişi bu kurallara sadık kalarak arayüzleri tasarlıyor ya da geliştiriyor? Bu makalede herkesin işine yarayabilecek bazı erişilebilirlik ipuçlarına değinelim…

xHTML ve CSS Kodlarının Doğrulanması (Validation)

Ürettiğimiz kodu zaman zaman doğrulama testinden geçirmek, bazen bir anlık dalgınlığımıza gelerek yazdığımız hatalı kodun farkedilmesinde önemlidir. Açık unutulan elemanlar ya da kapatma etiketi konulmayan elemanlar web tarayıcıları tarafından tolere edilerek size düzgün görünmesine rağmen, hiç umulmadık bir noktadan patlak vererek tadınızı kaçırabilir. Validation aşamasında ihtiyacımız olan 2 araç: xHTML Validator ve CSS Validator

Resimler için “alt” Etiketinin Eklenmesi

Özellikle de engelli insanları düşünürsek, bu insanlar text-to-speech programları yardımıyla bu tür objeleri algılayabiliyorlar. Websitemizde yer alan imajlar için resmi betimleyecek bir tanım girmek bu sorunun üstesinden gelecektir. Aynı zamanda da arama motoru optimizasyonuna (SEO) katkıda bulunan maddelerden biri tamamlanacaktır.

İçeriği ve Biçimlendirmeyi Ayırmak İçin CSS Kullanmak

CSS kullanarak, markup içerisinde gereksiz kodlar kullanmadan daha temiz kodlar üretmek hem erişilebilirlik açısından hem de yazdığımız kodun okunabilirliği açısından önemli bir unsur. Örneğin; markup içerisindeki bir metni kalınlaştırmak istiyorsak, strong etiketini kullanmadan, bunu CSS’de font-weight özelliği ile yapabiliriz.

Daha Açıklayıcı Linkler

“Buraya tıklayınız” veya “Devamını Oku…” gibi açıklayıcı linkler kullanarak içeriği daha anlaşılabilir ve erişilebilir bir hale getirebiliriz.

“İçeriğe Git” Linkleri

İnsanları her sayfada scroll ettirmek yerine, uygun bir yere “İçeriğe Git” linkleri yerleştirmek ve içeriğe kolayca erişebilmelerini sağlamak hem zaman kazandırdığı gibi erişilebilirliği arttıran diğer unsurlardan biri.

Label Kullanımı

Form içerisindeki input elementlerine daha kolayca erişebilmek için label etiketlerini kullanmak, kullanılabilirliği ve erişilebilirliği arttırmaktadır.

Linkleri Yeni Pencerede Açtırmamak

Kendi websitemiz dışındaki diğer websitelere link verirken, bu linkleri yeni bir pencerede açtırmak her zaman avantajlı olmayabilir. Herkes, bir web tarayıcısı üzerindeki “Geri” butonunu kullanmayı bildiğine göre, eğer bir sayfa yeni pencerde açılmışsa, burada “Geri” butonunu kullanamamız erişilebilirliği olumsuz anlamda etkilemektedir. Ancak harici (external) sayfaları yeni pencerelerde açtırmak yerine göre SEO açısından avantajlı da olabilir.

Tek başına çalışmak fiziki ve ruhsal açıdan yorucu olabilir. Zamanınızı yalnız harcamak bir yana, haftalarca hiçbir sosyal aktiviteye katılmadan yaşamaya başladığınızı hissedebilirsiniz. Bu yazıda sizlere kaçınılması gereken bazı davranışları anlatacağım. Kendiniz ve çalıştığınız müşterilere olan tavrınız açısından faydalı olabilir.

Müşteri Takibi

Size bir proje teklifiyle gelen insanlarla anlaşma yapmadan önce (sözleşme imzalamak vb.) bu kişiler hakkında araştırma yapmanız sizin için kesinlikle faydalı olacaktır. İnterneti kullanarak bu kişiler hakkında genel bir araştırma yapabilir, çevrenize, arkadaşlarınıza danışabilirsiniz.

Piyasa Düzeyi – Ucuz İşçilik

Nakit sıkıntısı çekmediğiniz müddetçe düşük meblağlara iş yapmayın. Türkiye’de popüler webmaster forumlarında hergün örneklerini görebiliyoruz. Değerinizi iyi biçin. Ama müşteriyi korkutup, kaçırmamak adına da makul davranın. Kendi değerinizi düşürdüğünüz gibi, piyasayı da etkilemiş olabilirsiniz. Yaptığınız ve yapacağınız işi en iyi şekilde, layıkıyla yapmaya bakın.

İşe değer biçme konusunda kararsız kalıyorsanız, piyasa düzeyini araştırmakta büyük fayda var. Bu konuda da yakınlarınıza ve çevrenize danışabilirsiniz.

Deadline – Teslim Tarihi

Müşteriye söz verdiğiniz teslim tarihini geçirmek ve işin uzamasına sebep olmak diğer hatalardan biridir. Eğer bunu bir alışkanlık haline getirmişseniz, kendi itibarınızı zedelemekle kalmayacak, aynı zamanda potansiyel müşterilerinizi de kaybetmekle yüzyüze geleceksiniz. Bu yüzden, kapasitenizi iyi bilip, yetişmesi gereken tarihi iyi ayarlamak ve müşteriyle bu doğrultuda anlaşmak gerekiyor.

Müşteri Seçimi

Komşunuza veya çok yakın bir arkadaşınıza iş yapmak da, alacağınız ücret açısından felaketle sonuçlanabilir. Bu yüzden müşteri seçiminin önemi burada büyük rol oynuyor. Yine Türkiye’de bunların örneklerini sıkça gördüm ve yaşadım diyebilirim. Yalnızca bu iş için işleyen bazı pazar alanları var. UzmanKirala.com, bu tür pazar alanları için bildiğim en iyi örnek. UzmanKirala.com hakkında daha geniş bilgi almak için Webrazzi üzerindeki şu yazıyı okuyabilirsiniz.

Agresif Tavır

Hepimiz insanız. Her anımız eğlenceli geçmiyor ve geçmek zorunda değil. Sinirli olduğunuz zamanlarda müşterinizle iletişim kurarken bu tavrınızı karşınızdaki kişiye yansıtmanız, müşteriyi tedirgin edecek ve itibarınızın zedelenmesine yol açacaktır. Bu yüzden sorunları çözerken sakin olmak, hem müşteriniz, hem de sizin için oldukça önemli.

Unutmayın, her sorunun mutlaka bir çözümü vardır.

Cufón, web-safe olmayan fontların web sayfalarında kullanılabilmesi için üretilen, herhangi server-side bir dile ihtiyaç duyulmadan kullanılabilecek tekniklerden biri. İnanılmaz basit ve kullanışlı olması, Cufón’u diğer tekniklerden bir adım öne çıkartıyor. Internet Explorer için Vector Mark-up Language‘ı, diğerleri için de HTML5‘in Canvas özelliğini kullanarak fontları render ediyor.

Cufón’u web sitemizde kullanabilmek için, kendi anasayfasında bir font dönüştürme aracı bulunuyor. Bu araç, yüklediğiniz fontu SVG, yani JavaScript ile oluşturulmuş vektörel bir formata dönüştürüyor. Bu sayede kolayca HTML sayfalarımızda kullanabiliyoruz. Nettuts+ yazarlarından Jeffrey Way‘in Cufón rehberinde web sayfamızda nasıl kullanabileceğimize dair bir eğitseli bulunuyor. Yazının sonundaki Kaynaklar adlı bölümde bazı bağlantılar paylaştım. Buradan çok daha detaylı bilgi alabilirsiniz.

Çok az sayıda dezavantajı olsa da web geliştiricileri arasında en çok tercih edilen tekniklerin başında geliyor. Internet Explorer 6 dahil tüm tarayıcılarda çalışıyor. CSS ile direkt olarak stil verilebiliyor. Hız yönünden, sIFR tekniğinden daha hızlı. Aşağıda Cufón’un bazı avantaj ve dezavantajlarını listeledim. Listeye, yorumlarınız ile katkıda bulunabilirsiniz.

Avantajları:

• Web tarayıcıları sorunsuzca çalıştırıyor.
• sIFR tekniğinden 100 kat daha pratik.
• FLIR gibi hiçbir sunucu taraflı (server-side) bir dil ile uğraşmıyorsunuz.
• Belirli karakter setleri (ABC, 123, vs.) seçmenize olanak sağlıyor.
• CSS ile istenilen şekle, boyuta getirilebiliyor. (Renk, boyut, gölgelendirme vs.)
• 2 dakika içerisinde hazır hale getirilebiliyor.
• Yüklediğiniz fontu yalnızca kendi alan adınız üzerinde çalıştırabiliyorsunuz.

Dezavantajları:

• Üretilen yazı seçilebilir değil. (En önemli yanlarından biri)
• Performans açısından başlıklar haricinde fazla kullanmak sayfamızın ağırlaşmasına neden olabiliyor.
• JavaScript tabanlı. Web tarayıcıları ayarlarından bu seçenek pasifleştirilirse Cufón çalışmıyor.
• Bazı ekstra eklemeler gerektiriyor. (text-decoration, hover vs.)

Cufón, GitHub repolarında geliştirilmeye ve açık kaynak olarak sunulmaya devam ediyor.

İster büyük bir ajansta, ister küçük, isterseniz freelancer olarak çalışıyor olun, müşterilerinizin istekleri doğrultusunda hareket ederken, işlerinizi ve projeniz için yaptığınız planları organize etmeniz, yapılacak olan işleri derli toplu tutmanız gerekir.

Bu yazıda sizlere faydasını görebileceğiz ücretli/ücretsiz, 10 proje yönetim/takip uygulaması tanıtacağım. Bu uygulamaların çoğunun birbirine benzer özellikleri olsa da, aslında herbiri farklı eşsiz işler yapıyor. Bunlardan bazıları web tabanlı ve aylık ücretleri olan, bazıları da açık kaynak ve ücretsiz uygulamalar…

Basecamp

İlk olarak Basecamp ile başlayalım. Basecamp, tüm bu uygulamalar arasında en popüler olanı. Yürüttüğünüz proje içerisinde çalışan diğer takım üyeleri ile Basecamp üzerinden kolayca iletişim kurabilir, e-posta kullanmaktan daha fazla verim alabilirsiniz. Özellikleri arasında, dosya paylaşımı, yapılacaklar listesi, bir işin yapılmasından sorumlu kişiler, proje şablonları ve dahası mevcut…

Basecamp için ücretlendirme sistemi, oluşturmak istediğiniz proje sayısına ve depolama alanında tutulan verinin boyutuna göre şekilleniyor. Basic Plan olarak adlandırılan paket aylık 24$‘dan başlıyor. Bu paket ile 5 GB‘lık depolama alanı üzerinden 15 proje açabilirsiniz. Aynı zamanda ücretsiz ve kotalı bir paket tarifesi de mevcut.

activeCollab

activeCollab, web sunucunuza ya da yerel ağınıza kurabileceğiniz bir proje takip aracı. Sınırsız kullanıcı, proje ve depolama alanı kullanmanıza olanak sağlıyor. Aynı zamanda proje planlama, iş takibi ve iletişim gibi önemli unsurların da kolaylaşmasını sağlıyor. activeCollab ile zamandan kazanmanız için ihtiyacınız olan herşey düşünülmüş. Proje şablonları oluşturmak, işlerin başlangıcını ve bitmesi gereken deadline sürelerini organize edebilir, kolayca yeni görev ekleyebilir ve çeşitli birçok iş yapabilirsiniz.

Küçük işletmeler için yıllık 249$ ve ilk yıl için ücretsiz olmak üzere 99$‘lık bir yardım ve destek ücreti bulunmakta. Bunlara ek olarak eğer test edip nasıl bir sistem olduğunu incelemek isterseniz 30 günlük deneme sürümü de mevcut.

Mavenlink

Mavenlink, daha çok web tasarımcılarını ve web tasarım firmalarını hedef alan bir proje takip sistemi. İletişim ve işbirliği için bilindik tüm standart özellikleri size sunuyor. Aynı zamanda freelance tasarımcılar ve küçük çaplı tasarım ajansları için de ekstra özellikler var. Mavenlink ile kolayca iş sözleşmelerinizi ve müşterileriniz ile olan ödeme konularını yönetebilirsiniz.

Expert Plan olarak adlandırılmış paket aylık 39$‘dan başlıyor ve sınırsız proje oluşturma, projeniz için çalışacak sınırsız sayıda üye oluşturabilme gibi özellikleri bulunmakta. Aynı zamanda 30 günlük, sınırlı özellikleri olan deneme sürümü de mevcut.

Subernova

Subernova, zamanı değerlendirebilmek, faturalarınızı ve sözleşmelerinizi organize edebilmek, proje üzerinde çalışan kişiler ile kolayca iletişim kurabileceğiniz, işlerinizi rayında yürütebilmeniz ve daha fazlası için ihtiyacınız olan şeyleri size sunan bir proje yönetim uygulaması.

Aylık 14.99$ ya da yıllık 149.99$ şeklinde satın alabileceğiniz bir uygulama. 30 günlük deneme sürümü de mevcut aynı zamanda.

ProjectPier

ProjectPier, ücretsiz, açık kaynak ve PHP tabanlı bir proje yönetim uygulaması. Eğer her ay diğer ücretli sistemlere para vermek istemiyorsanız, ProjectPier bu açıdan sizin için iyi bir seçenek olabilir. ProjectPier ile bir proje yönetim uygulaması için ihtiyacınız olan pek çok şey düşünülmüş. Bunların arasında iş takibi, görevler, dosya paylaşımı, gizlilik kontrolü ve daha pek çok özellik bulunmakta.

Smartsheet

Smartsheet, online proje yönetimi, görev yönetimi ve diğer çeşit işler için uygun, binlerce şirket tarafından kullanılan bir proje yönetim uygulaması. Dosyalarınızı kolay ve güvenli bir şekilde paylaşabilir, eklenti olarak dosyalar yükleyebilir, raporlar üretebilir ve proje üzerinde çalışan diğer üyeler ile çeşitli konularda tartışmalar yapabilirsiniz.

Basic Plan, aylık 15.95$‘dan başlıyor ve diğer gelişmiş paketleri de mevcut. Aynı zamanda 30 günlük deneme sürümü de var.

Collabtive

Collabtive, proje yönetimi için düşünülmüş cloud tabanlı, projelerinizi ve işlerinizi yönetmenize imkan sağlayan, zaman takibi ve raporlama gibi özellikler de sunan ücretsiz bir uygulama. Collabtive, küçük, orta ölçekli ve freelancerlar için uygun görünüyor.

Projecturf

Projecturf, projelerinizi yönetmenize yardımcı olan bir uygulama. Görevler oluşturma, dosya paylaşma ve insanlarla işbirliğine varmak için, zamandan ve bütçeden tasarruf etmek için düşünülmüş pek çok şey var.

En küçük paket 1 proje üretebilmekten oluşuyor ve aylık 9.99$. Sınırsız sayıda kullanıcı oluşturabilir, 2GB’lık bir depolama alanından faydalabilirsiniz. 14 günlük deneme sürümü mevcut.

Wrike

Wrike, sınırsız sayıda proje üretebileceğiniz, iletişimi ve işbirliğini kolaylaştıran, dosya paylaşımı konusunda oldukça yetenekli bir proje yönetim uygulaması. Microsoft Outlook üzerinden bile kolayca görev oluşturabiliyorsunuz.

5 kullanıcı için aylık 49$ ödeyerek, sınırsız sayıda proje üretebilir ve 5 GB‘lık depolama alanına sahip olabilirsiniz. Ücretsiz deneme sürümü mevcut.

EasyProject.net

EasyProjects.net, sınırsız sayıda proje, proje şablonları, özel alanlar, portfolyo yönetimi, zaman yönetimi, fatura ve sözleşmeleri düzenleyebilmek ve dahasını size sunan bir proje yönetim uygulaması.

EasyProjects.net’in barındırma hizmeti sunan tarifesi 5 kullanıcı için aylık 75$‘dan ücretlendirilmiş. İsterseniz 648$ ödeyerek lisans alabiliyorsunuz. Böylece yazılımı kendi web sunucunuza da kurabiliyorsunuz.

Her ikisi de web geliştiricileri arasında oldukça popüler, ancak hangisi en iyisi? Sean Gaffney bu konuda küçük bir araştırma yaparak bizlere hangisinin daha üstün olduğunu göstermiş.

CSS ve JavaScript, birbirlerinden çok farklı 2 kavram. CSS, içeriğinizi stillendirebilmek için gerekli olan bir dil, ancak sınırlı. JavaScript ise bir web sayfasındaki tüm elemanlara müdahele edebileceğimiz ve onlara çeşitli atraksiyonlar katabileceğimiz bir dil.

CSS3 ile, geride bıraktığımız yıllara nazaran pek çok yeni ve etkileyici özellikler bizlere sunuldu. Bazı insanlar CSS’in websitelerini şekillendirebilmek için kullanılabilecek tek yol olduğunu düşünürler. Bu kişilerin bu düşüncelerinde yanıldıklarını söylemekle kalmayıp bir de üzerine CSS’in ve JavaScript’in avantajlarını ve dezavantajlarını bu yazıda sizlere açıklayacağım. O zaman vakit kaybetmeden başlayalım…

Kullanım Kolaylığı

JavaScript, henüz yazılım mantığı ve kültürü edinmemiş kişiler için başta öğrenmesi oldukça zor bir dil olabilir. Çeşitli kütüphaneler, frameworkler mantığını kavramak için yardımcı olabilir, ancak ileri düzey uygulamalar geliştirebilmek ve syntax teknikleri için JavaScript dilini oldukça iyi bilmek gerekiyor. CSS3′de ise bu durum JavaScript kadar karmaşık değil. CSS’in genel yapısına aşina olan bir kişi, ufak-tefek denemeler ile çeşitli animasyonlar ve transition efektlerini kolayca kavrayabilir. Şu an için:

KAZANAN: CSS3

Esneklik

CSS ile sınırlı alanlara müdahele edebilirken, JavaScript ile herhangi bir layout ile sınırlı kalmadan, tüm döküman yapısına müdahele edip (DOM), istediğimiz elementleri seçebiliyor ve işlem yapabiliyoruz. CSS3 ile bu esneklik imkanı artmış olsa da hiçbir zaman JavaScript kadar esnek olabileceğini düşünmüyorum.

KAZANAN: JavaScript

Destek

Çeşitli JavaScript kütüphaneleriyle (Bkz: jQuery, MooTools) artık tarihe karışmış olan ve desteğini vermediğimiz! eski dostumuz Internet Explorer 6 için bile düzgün görünümler elde edebiliyorken, CSS3′ün henüz modern tarayıcılarda bile tam olarak desteklenmiyor oluşu JavaScript’i yine bu aşamada bir adım öne çıkarıyor. Şu anda bilgisayarlarımızda kullanmakta olduğumuz Google Chrome ve Safari web tarayıcılarının JavaScript motoru olan WebKit, CSS3 animasyonlarında ve akıcılığında oldukça başarılı diyebilirim. Firefox‘un da 4. sürümünden itibaren transition ve animasyon konusunda iyi çalışmaya başladığını görebiliyoruz.

(Ağustos 2011) Türkiye için web tarayıcı kullanım raporu

Dipnot: Hazır Internet Explorer 6′dan konu açılmışken , Türkiye için Internet Explorer kullanımın %2‘lere düşmüş olması biz web geliştiricileri açısından moral verici bir gelişme ve günden güne bu sayıda azalma yaşanıyor. Dünyadaki web tarayıcılarının kullanım oranları hakkında aylık bilgi almak için şu sayfayı ziyaret edebilirsiniz.

KAZANAN: JavaScript

Performans

Web tarayıcı sektöründe yaşanan rekabet, kullanıcı odaklı olmaya ve daha az CPU harcamaya yönelik olduğundan bu çalışmalar JavaScript motorunun da hızlanmasını sağlıyor. WebKit’in SquirrelFish adını verdiği (Google Chrome’da V8 olarak geçer) JavaScript motoru var. Mozilla Firefox’taki JavaScript motorunun ismi de TraceMonkey. Internet Explorer 9 da Chakra adını verdiği yeni bir JavaScript motoruyla yayınlanmıştı. Günümüzdeki modern tarayıcılar arasındaki rekabet ile şu sonuca varabiliriz: JavaScript rocks!

CSS3′ün animasyon ve transition desteği oldukça yeni diyebilirim. Bu yüzden performans konusunda JavaScript’ten daha geride olması normal sayılır. Örneğin; CSS3 ile animasyon uyguladığımız bir elemanın, CPU üzerindeki yükü %40‘lara çıkabiliyorken, jQuery Circulate Plugin ile %18‘lerde seyrediyor bu rakam.

KAZANAN: JavaScript

Sonuç

Tüm bunlardan hareketle, JavaScript yine aynı JavaScript. CSS3 ise hala gelişiyor ve desteği arttırıyor. Yani tüm bu teknolojileri web sitelerimizde, projelerimizde kullanıyoruz ve kullanacağız. Ancak asıl önemli olan: “Müşterimizin ya da hitap ettiğimiz kitlenin ihtiyacını karşılayacak mı?” “Hitap ettiğimiz kitle modern tarayıcıları mı kullanıyor?” “Eklediğimiz özellikler kullanıcılar tarafından kullanılacak mı?” “Zeki Müren de bizi görecek mi? “… gibi sorular kafamızı kurcalamaya devam edecek.

Web standartlarına uygun olarak hazırlanan kodun pek çok faydası vardır. Bunları bu yazıda sizler için açıklamaya çalıştım…

• Kod Verimliliği: Bundan kasıt çoğunlukla, yazılan kodların farklı projeler içerisinde tekrar tekrar kullanılabilecek şekilde hazırlanması. HTML dökümanımıza eklediğimiz CSS ve JavaScript dosyalarının satıriçi (inline) yazılmadan, harici (external) birer dosya halinde oluşturulması, yazılan kodun verimliliğini arttırdığı kadar, aynı proje üzerinde çalışan diğer insanlara da kolaylık sağlayacaktır.
• Bakım Kolaylığı: Bir üst maddede de sözü edildiği üzere, markup bir kez yazıldıktan sonra, bazen bir bakım işleminden geçmesi gerekebilir. Bu sebeple web sayfasına görünüm kazandırmak için kullandığımız CSS’i harici bir dosya halinde çalıştırarak, markup’ta bahsi geçen bölümlere erişim CSS’de daha kolay olacaktır.
• Erişilebilirlik: Erişilebilirlik, kiminin fazla önemsemediği, kiminin ise ana mottosu olan bir öğe. Web’deki önemli sorunlardan biri de ne yazık ki bu. Yeryüzündeki tüm insanları potansiyel birer engelli olarak kabul edersek, hazırlanan web sitelerinin de engelli vatandaşlar tarafından rahatça gezilebilir, okunabilir ve bilgi alınabilir olması gerekmekte. Bu yüzden de biz web geliştiricilerinin erişilebilirlik kurallarına uyarak markup’lar üretmesi oldukça önemli.
• Aygıt Uyumluluğu: Burada yalnızca üretilen markup’ın farklı tarayıcılarda ya da farklı işletim sistemlerinde aynı görüntüyü elde etmesi değil, günümüzde oldukça popüler hale gelen mobil aygıtlar tarafından da (Cep telefonları, PDA’lar, avuç-içi cihazlar vs…) düzgün bir görüntüyü elde etmemiz yine önemli bir unsur. Dünyadaki cep telefonu sayısının, evlerimizde, iş yerlerimizde kullandığımız bilgisayarlardan daha fazla olması bu maddenin önemini arttırıyor.
• Arama Motorları: Üretilen markup’ın arama motorları örümcekleri tarafından kolayca taranabilir olması ve semantik öğeler içermesi hem web standartlarına uyum aşamasında, hem de websitemizin arama motorlarında üst sıralara gelmesinde rol oynayan önemli faktörlerden biri.

Yukarıda sözü edilen maddelerin “Web standartlarına neden uymalıyız?” sorusuna birer cevap olmasına rağmen, pek çok sitenin bu maddelerin bir tanesine bile uymaması, bazı web geliştiricilerinin gündemi veya yenilikleri yakından takip etmemeleri sebebiyle hala standartlara uymayan milyonlarca web sitesinin var olduğu bir dünyada yaşıyoruz. Bu maddeleri uygulamayan bazı web geliştiricilerinin de kendine özgü ürettikleri bahaneleri var elbette. Kimi sonuç olarak aynı parayı aldığını ileri sürüyor, kiminin şirket politikaları sebebiyle, kimi de bunları öğrenip, uygulamasının zor olduğunu ve zaman aldığını ileri sürerek websitelerini güncellemiyorlar.

Üretilen Bahaneler

• Şirket Politikaları: Hiç şüphe yok ki devlet dairelerinin (okulların, hastanelerin vs.) web sitelerini incelediğimizde, hepsinin zaman aşımına uğradığına, objelerin birbirine girdiğine, linklerin çalışmadığına ve aranılan bilgiye ulaşılamadığına çoğu kez şahit olmuşuzdur. Bu ve benzeri pek çok kurumun, bu tür işlerle ilgilenen çalışanları olmadığı sürece bu websiteleriyle daha çok yüz yüze geleceğiz.
• “Öğrenmeye ihtiyacım yok ki?“: Bazı web geliştiricileri size şunları söyleyebilir: “Ben, bahsettiğin eski tekniklerle sitemi hazırlıyorum ve paramı alıyorum, ne diye yöntemimi değiştireyim?“. Can sıkıcı bir durum gibi görünmesine rağmen bu kişilere bunun faydalarını açıklamak hem size, hem de o kişiye çok şey katacaktır.
• “Öğrenmesi zor!“: Saçmalık! İnternet gibi uçsuz bucaksız bir platform sayesinde aranılan bilgiye saniyeler içerisinde ulaşılabilirken, böyle bir bahane üretmek yersiz. Yeni teknikler öğrenerek tecrübenizi arttırabilir ve sektörde kalifiye eleman haline gelebilirsiniz.

Bu makalede sizlere web standartlarına uymanın gerekliliklerini açıklamaya çalıştım. Buradaki maddelere sadık kalmak ve bu maddeleri uygulamak size kalmış. Sağlıcakla kalın!