Web tasarımcılar için Linux

Linux’a geçen kullanıcıları neler bekliyor dedik ve Ev kullanıcıları ile Grafikerleri nelerin beklediğini göstermeye çalışmıştık. Bu yazımızda ise Web Tasarımcılar Linux’a geçince onları nelerin beklediğini yazmaya çalışacağız.

Öncelikle web tasarımcısı dediğimiz arkadaşı bir tanımlayalım. Elbette web tasarımcısı derken işin sadece görsel kısmı ile ilgilenmesinden bahsetmiyoruz. Daha genel olarak bir web sitesinin nasıl olacağını kafasında tasarlayıp gerek görsel gerek yazılımsal süreçleri götürebilecek kadar geniş bilgiye sahip bir web tasarımcısından söz ediyoruz. Bunu böyle ele alalım ki daha geniş bir web tasarımcısı topluluğuna hitap edebilelim.

Web tasarımcıların ihtiyaçları nelerdir?
1- Hazırlayacağı web sitesi için görseller oluşturabileceği ve fotoğrafları düzenleyebileceği araçlar.
2- Web sitesinin kodlama kısmını (html, php, jsp, css, sql vd.) yapabileceği kullanışlı editörler.
3- Hazırladığı dosyaları sunucuya taşımak için kullanacağı programlar.
4- Sitenin kullanılabilirliğini test edebileceği tarayıcılar ve iletişimi sağlamak için bir eposta programı.
5- Çalışmalarını yaparken kilitlenmeyen bir bilgisayar : )

1- Şablonların ve görsellerin oluşturulması
Web tasarım için olmazsa olmazlar tabiki de görsellerdir. Bir sitenin kodlaması ne kadar kötü de olsa kullanıcıya gözüken kısmının mutlaka iyi olması gerekir. Logo, banner, buton, arka plan, ürünler için fotoğraflar ve diğer görsel öğeler mutlaka estetik bir şekilde oluşturulmalıdır.
Bahsettiğimiz tüm görsel öğeleri Özgür yazılımlar aracılığı ile yapmanız mümkün. Daha önceden grafikerler için yazdığım yazı grafik ile ilgili bilgi içeriyorsada bu yazıda daha çok, web tasarımcılar için örnekler bulunacak.

gimp_web Yandaki resimde Gimp ile yapılmış bir web sitesi görüyoruz. Üzerine tıkladığınızda web sayfasında nasıl gözüktüğünü de görebilirsiniz.
Nasıl yapıldığı ile ilgili derse Gimptr adresinden ulaşabilirsiniz. Oldukça faydalı bir yazı olmuş.
Bu örnekte ise bir blog teması yapılmış. Blogunuz için kendi temanızı Gimp ile hazırlayabilirsiniz. Yandaki temanın nasıl yapıldığını merak ediyorsanız şu adrese bakabilirsiniz.

Ayrıca bunun gibi tema örnekleri için bu adres size yardımcı olabilir.
blog_tema

Şimdi sıra Web 2.0‘ın vazgeçilmezlerini; butonları ve etiketleri hazırlamaya geldi:

http://tr.sun.com/

buton_gimp

Bildirgec‘te Gimp ile Web 2.0 butonları nasıl yapabileceğimizi anlatan bir listeye rastladım burada 15 güzel kaynak var. Web 2.0 butonlara Gimp ile başlangıç ile güzel bir adım.

Ayrıca etiket ve arka plan yapımı için şu siteye yazı efektleri için ise bu sitelere 1 2 3 bakabilirsiniz.

Sloganı “watch, learn, do” olan Heathenx sitesi Gimp ve Inkscape ile ilgili müthiş videolu anlatımlar sunuyor. Buradaki anlatımlar gerçekten çok şey öğrenemenizi sağlayacak.

Tüm bu örneklerden sonra bu konuda yazılmış birkaç kitaptan bahsedeyim: İlki Profesyonel Web Tasarımcıları için Gimp kitabı şuradan kısmi içeriğine bakabilirsiniz. Ayrıca Amazonda da satılıyor Bunların yanı sıra bu konuda hazırlanmış ücretli bir ders CD’si de mevcut

İnkscape için ücretsiz bir kitabı da buradan okuyabilirsiniz.

Bu arada unutulmaması gereken bir konu da Flash animasyonlar. Maalesef Flash animasyonları yapabileceğiniz açık kaynak düzgün çalışan bir yazılım henüz mecut değil. Bunun çözümü de yok değil elbette. Adobe Flash CS3 programını wine ile Linux altında çalıştırabilirsiniz. Ancak şimdiden söylemeliyim ki tam verim alamayabilirsiniz.

2- Web sitesinin kodlama kısmının hazırlanması
İşin kodlama kısmına geçtiğimiz zaman kullanacağımız birçok editör mevcut. Hepsinin de birbirinden farklı özellikleri var, burada önemli olan kendinize ve ihtiyaçlarınıza en uygun olanı seçebilmek. Bunları şöyle bir sayacak olursak; Bluefish, Kompozer, Quanta, Javacıların iyi bildiği Netbeans ve Tüm yazılımcıların başının tacı Eclipse Bunların dışında da açık kaynak editörler mevcut. Ancak bu yazıda sadece bu editörlerden bahsedeceğim.

bluefish_logo Bluefish, deneyimli web tasarımcıları ve yazılımcılar için hazırlanmış bir editördür. Bir çok programlama ve işaretleme diline destek verir; ancak birincil hedefi etkileşimli ve dinamik web sitesi tasarımıdır. Özelliklerine şu sayfadan bakabilirsiniz.
kompozer_logo Kompozer ise web tasarımına yeni başlayan web tasarımcılar için daha uygun bir editör. KompoZer aşırı derecede kolay kullanımlı olması için tasarlanmıştır, teknik olmayan bilgisayar kullanıcılarının HTML veya web kodlaması bilmeden çekici professiyonel görünümlü web siteler tasarlayabilmesi tasarlanmıştır. Tümleşik CSS editörü sayesinde yaptığınız değişiklikleri anında görebilirsiniz. Mozilla vakfının da desteklediği bu editörün özelliklerine ise şu sayfadan bakabilirsiniz. MS FrontPage tadında bir program. Ayrıca Kompozer ile ilgili güzel bir makaleye de Enixma’nın şu sayısında yer verilmiş.
nb-logo-frontpage2 Netbeans benim favori geliştirme ortamım. Hala tamamını öğrendiğimi söyleyemem. İhtiyaçlar doğdukça yeni şeyler keşfediyorum, bu da benim hoşuma gidiyor. Netbeans aslında SUN Microsystems firmasının Java kodlama yapmak için geliştirdiği bir IDE(Geliştirme ortamı). Ancak zaman içerisinde öyle geliştiki sadece Java değil birçok dile (Java, Ruby, C, Groovy ve PHP) destek verir hale geldi. Ben PHP kodlama yaparken artık Netbeans IDE kullanıyorum. Bir programcı için gerçekten çok güzel araçlara sahip. Örneğin include edilen fonksiyon dosyalarındaki fonksiyon adlarını otomatik gösteriyor. Yazdığınız fonksiyonlara açıklama koyduysanız fonksiyonu nerede çağırırsanız çağırın bu açıklamalar bir baloncukla gösteriliyor. Fonksiyona gönderilecek olan parametre tipleri ve geri döndürülen parametre tipi bu baloncuk içinde gösteriliyor. Başka bir özelliği de bir değişkenin adını değiştirmek istediğinizde “replace all” yapmanız gerekmiyor sadece birini değiştirdiğiniz anda hepsi değişebiliyor. Bunlar ilk anda aklıma gelenler. Mesela hiç PHP kodları adım adım çalıştırdınız mı sanki bir C ya da Java kodu gibi. Bunu Firefox’un bir eklentisi (Netbeans Firefox Extension) sayesinde yapabiliyorsunuz. Ayrıca localdeki veritabanınıza doğrudan Netbeans ile bağlanıp üzerinde işlem yapabiliyorsunuz. Ayrıca PhpMyadmin’e bile gerek bırakmıyor. Tümleşik CVS ve SVN desteği, Ön izlemeli CSS editörü, XML ve JSON gibi işaretleme dillerinde dosya hazırlarken sağladığı kolaylıklar ve ciddi bir döküman (Uygulamalı eğitim videoları da) arşivi bu geliştirme ortamını (IDE) tercih etmemi sağlıyor.
eclipse_logo Eclipse bir yazılım geliştirme platformu ve neredeyse desteklemediği bir dil yok. İlginç olan ise Eclipse projelerinde en popüler ikinci proje PDT (PHP Development Tool) olması. Bu proje IBM ve ZEND (PHP dilini geliştiren firma ) tarafından 2006 yılında başlatıldı. Zend framework de dahil olmak üzere birçok framework ile kolayca çalışmanıza imkan sağlıyor. Ceviz.net’te de Eclipse PHP ile ilgili küçük bir makele mevcut. Eclipse gerçekten bir umman. İsterseniz hemen öğrenci programına katılıp bu ummana dalabilirsiniz.

3- Hazırladığı dosyaları sunucuya taşımak için kullanacağı programlar
Kendi bilgisayarımızda web sitemiz için hazırladığımız dosyaları oluşturduk. Şimdi sıra bunları kolay bir şekilde server tarafına taşımaya geldi. Bunun için benim tercihim Firefox’a bir eklenti indirerek ayrıca bir program kurmadan bu ihtiyacımı karşılamak oluyor. Böylece sadece Firefox ekranını kullanarak hem upload yapıyorum bir yandan da yüklediğim dosyaların nasıl çalıştığını tarayıcıdan hemen görme fırsatım oluyor. Bunun için kullandığım FTP eklentisi ise FireFTP. Klasör senkronizasyon özelliğini de beğeniyorum. Tek seferde tüm dosyaları senkronize edebiliyor.
Bir ftp programı kurmak isteyenler yine Mozilla’nın desteklediği Filezilla programını da indirebilirler. Daha önceden kullandığım gFTP programı da bir ftp programından beklenen tüm ihtiyaçları karşılayabiliyor.

4- Sitenin kullanılabilirliğini test edebileceği tarayıcılar ve iletişimi sağlamak için bir eposta programı
Site kullanılabilirliğini test etmek profesyonel siteler için çok önemli. Bir web sitesinin her tarayıcıda farklı şekilde görülmesi bence tam bir acemilik. Bu durum kodlarınızın standartlara uymadığını gösteriyor. W3C standartlarına uygun kod yazmak her web tasarımcısının üstünde durması gereken bir konu. Sitenizin bu standartlara uyumlu olup olmadığını şu adresten kontrol edebilirsiniz. Ama yine de sitenizin tüm tarayıcılarda nasıl göründüğünü mutlaka test etmeniz gerekir. Favori tarayıcım olan Firefox zaten birçok Linux dağıtımında (Ubuntu, Pardus, vd.) standart olarak geliyor. Bunun dışında Opera, Safari, Chrome gibi tarayıcıları hemen kurup onlarda da sitenizin nasıl gözüktüğüne bakabilirsiniz. Internet Explorer için ise sisteminize wine programını kurduktan sonra Internet Explorer kurup denemelerinizi başarılı bir şekilde yapabilirsiniz.
Bir web tasarımcısı olarak Firefox kullanmıyorsanız inanın çok şeyler (En başta zaman) kaybediyorsunuz demektir. Firebug eklentisine değinmeden geçemeyeceğim. Firebug yaptığınız sayfalardaki hataları bulup düzeltmenize bunları hemen görebilmenize, beğendiğiniz bir sitedeki css bilgisini görüp hatta üzerinde değişiklik yapıp anında görmenize bu site böyle daha güzel olurmuş demenize sebep olacak bir eklenti. Aslında tam anlatılmaz yaşanır tadında birşey.
Bir başka eklenti de benim pek kullanma fırsatımın olmadığı Greasemonkey eklentisi onun için de şurada methiyeler var ilgilenenlere…
Başarılı bir proje için iletişim şart. E-posta iletişimi için kullandığım program Mozilla’nın geliştirdiği Thunderbird. MSN yazışmaları için Ubuntu ile standart olarak gelen Pidgin. ve sesli görüşme için Skype ile konuşmaya başlayabilirsiniz. Ajandanızı tutmak içinse ayrı bir programa gerek yok Thunderbird‘e şu eklentiyi kurarak hem eposta için hem de ajanda için kullanabilirsiniz.

5- Çalışmalarını yaparken kilitlenmeyen bir bilgisayar : )
Yukarıda yazılan işlerin hepsini kilitlenmeden, hata vermeden ve bilgi kaybetmeden yapmak, zaten çok zamanı olmayan ve tüm bu işlerle uğraşmak zorunda olan, web tasarımcısı için çok önemlidir. Bunu sağlamının yolu Ubuntu, Pardus gibi bir Linux dağıtımını bilgisayarımıza kurup kendimizi ve bilgisayarımızı ödüllendirmekten geçer. : )

Kaynaklar
http://www.gimp.org/tutorials/Simple_Animations/
http://www.gimp.org/tutorials/Advanced_Animations/
http://www.gokhanakin.com/yazi-tasarimci-nasil-olunur-1320.html
http://www.osnews.com/story/9658
http://www.wpdfd.com/software/
http://www.debian.org.tr/KompoZer

“Web tasarımcılar için Linux” için 7 yorum

  1. Yazınız için teşekkürler. Bir çok insan kullandığı yazılımlardan vazgeçmemek adına Linux’a bulaşmıyor. Benzerlerini görmek dileğiyle.

  2. Dikkatiniz için teşekkür ederim. Düzelttim.

    gilan: “kitlenmek” değil “kilitlenmek”

  3. yol gösterici güzel bir yazı olmuş. Umarım bir dizi şeklinde devamı gelir. Ayrıca GimpTR olarak yaptığımız çalışmalara değer verildiğini görmek bizleri fazlasıyla mutlu ediyor. Teşekkürler…

  4. yazınız için teşekkürler yenilerini bekliyoruz. sordugum bi çok insan windows’dan vazgeçmem diyo yanlış bi düşünce linux’u onlara anlatmaya çalışıyorum ama faydası olmuyor galiba……

  5. Faydası oluyor ama onlar belki geç farkedecekler. Sadece sabır ve emek.

    fatma: yazınız için teşekkürler yenilerini bekliyoruz. sordugum bi çok insan windows’dan vazgeçmem diyo yanlış bi düşünce linux’u onlara anlatmaya çalışıyorum ama faydası olmuyor galiba……

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir