Web tasarımı yada Web Programcılığı ile uğraşıyorsanız, grafik ve kodlama için bir kaç program bilgisayarınızda yüklüdür. Web tasarımına yeni başlayanlar ve hali hazırda program kullananlar için 2017 yılının bu ilk ayında en çok kullanılan web tasarım programlarını ile ilgili bir liste hazırlamak istedim. En çok kullanılan web tasarım programları ile birlikte adı pek duyulmamış web tasarım programlarını da listeye yazacağım. Listeye eklemeyi unuttuğum web tasarım programları olursa da yorum olarak listeye eklerseniz sevinirim.
Benim web tasarımı için kullandığım araç listesi şu şekilde başlıyor.
1. Brackets
Ücretsiz
Tahmin edebiliyorum. DW dururken 1. sırada brackets mı olur diyorsunuzdur. Eğer bir web programcısı iseniz <html> yazmanın sorun olmadığını, aksine kod ekranının programcı için daha güçlü hareket imkanı sunduğunu bilirsiniz. Bu yüzden brackets ilk sırada. Lafı uzatmadan brackets faylarından bahsedelim.
Modern, hızlı çalışan, güçlü bir editör. Kod yazmanın keyfini çıkarabileceğiniz otomatik kapatma, kod kopyalama gibi güçlü özellikleri ile birlikte zengin eklenti kütüphanesine de sahip. Gerçek zamanlı görüntüleme özelliğinin de olduğunu belirtmek isterim.
(Küçük bir de not olarak da en iyi web tasarım programı olmasa da en rahat olanı bence brackets 🙂 )
Web tasarım programı indirme adresi :http://brackets.io/
2.Adobe Dreamweaver
Ücretli
Dreamweaver gibi güçlü bir editorü ikinci sıraya koyduğum için üzgünüm. 2002 yılından beri hayatımda olan güçlü tasarım programlarından biri. Dreamweaver MX ile ilk tasarımlarımı yapmaya başlamıştım.
Dreamweaver web tasarım programları denilince ilk akla gelen programdır. Bu özelliğini almasının sebebi, uzun yıllar alternatifinin olmaması ve tasarımı göründüğü gibi elde etme (WYSIWYG ) konusunda iyi oldudur. Bu yüzden sektörde halen en çok kullanılan web tasarım programı içinde başı çekmektedir. Dreamwever ile ASP, ASP.NET, PHP, JavaScript, CSS, SCSS vb. bir çok türde kod yazmak mümkün.
Bunların yanı sıra görsel editör ile sürükle bırak konusunda da gelişmiş özellikler sunmaktadır(şimdilik CC 2017 sürümünde file panelinden sürüklemeye izin vermese de). Mobil tasarımlar için gelişmiş bootstrap desteği ve jquery eklentileri ile tam uyumlu çalışması gibi özellikleri de gelişmiş özellikler arasında yer almaktadır. Dreamwever mx versiyonundan beri kullanmayı sevdiğim ftp aracı da büyük kolaylıklar sunmaktadır.
Web tasarım programı indirme adresi : http://www.adobe.com/tr/products/dreamweaver.html
3.Adobe Fireworks
Ücretli
Web tasarımcılar için en iyi grafik programlarından birisi olduğu aşikardır. Web tasarımcıları için paint ile resim yapar gibi basit araçlar sunmaktadır. En iyi özellikleri, öğrenmesi kolay ve CS6 sürümü ile bazı vektörel nesnelerin CSS kodlarını otomatik olarak çıkarması. Bir kaç eklenti ile birlikte SVG formatında kaydetme imkanı da sunmaktadır. Fakat üzücü olan durum CS6 sürümünden sonra güncel bir sürüm çıkmadı. Hatta Adobe fireworks CS6 programına da destek vermeyi bıraktı. Fireworks programının kod kısmının geliştirilmesi zor olduğu için web tasarımlarını Fireworks kullanmak yerine daha üst programlar olan Photoshop ve Illisturator kullanmayı da önermeyi unutmamışlar.
Web tasarım programı indirme adresi : http://www.adobe.com/tr/products/fireworks.html
4.Adobe Illusturator
Ücretli
Grafikerler için geliştirlimiş, afiş, logo, kartvizit gibi basılı yayın nesneleri oluşturmak için kullanılan bir program olduğu düşünülür. Aslında Fireworks programının geliştirilmesi durdurulduktan sonra web tasarımcıları için eklenen araçları ile tam bir web grafik programı da olduğu söylenebilir. Web sayfaları için taslak tasarımalar, vectörel grafikler, logolar ve semboller oluşturup yine web için geliştirilmiş araçları ile hızlı bir şekilde web sayfasında kullanmak mümkündür.
Web tasarım programı indirme adresi : http://www.adobe.com/tr/products/illustrator.html
5.Adobe Photoshop
Ücretli
Daha çok fotoğrafçıların tercih ettiği tasarım programı olmasına rağmen web tasarımcılarının da sık kullandığı programlar arasındadır. Web sayfası yapmak tasarımı hayal etmekten başlar sonuçta. Illusturator kadar vektörel esnekliğe sahip olmamasına rağmen fotoğraflar üzerindeki hakimiyeti web tasarımcılarını PS ve AI yi bir arada kullanmaya zorlamaktadır.
Web tasarım programı indirme adresi : http://www.adobe.com/tr/products/photoshop.html
6. NotPad++
Ücretsiz
Windows’taki notpad programının gelişmişi olarak oluşturulan açık kaynak, kod editörüdür. Notpad++ ile bir çok dilde kod yazma imkanı ve Türkçe dili dahil olmak üzere bir çok dil arayüzü vardır. En güzel özelliklerinden birkaçı portable olması ve fireFTP ile anlık olarak sunucudaki dosya üzerinde çalışma imkanı sunmasıdır. Web tasarımcıların yanı sıra bir çok programcı tarafında da kullanılmaktadır.
Web tasarım programı indirme adresi : https://notepad-plus-plus.org/
7.Visual Studio
Ücretli
Visual Studio ile masaüstü uygulamalar geliştirilmenin yanı sıra web sayfaları da yapmak mümkündür. Eğer Asp.Net bir web sayfa oluşturuyorsanız kesinlikle yüklemeniz gereken programlardan biri de Visual Studio programıdır. Dreamweaver gibi görsel olarak sayfa tasarlama, gelişmiş component seçeneği, akıllı kod tamamlama özelliği ve gelişmiş NuGet paket yönetim sistemi ile JavaScript eklentilerini kolay dahil etme imkanı.
Web tasarım programı indirme adresi : https://www.visualstudio.com/
8.Sublime Text
Ücretli
Bir çok programlama dili için metinsel arayüz ile kod yazma imkanı veren lisanslı bir programdır. Çok fazla kullanma fırsatım olmadı ama web tasarım için geliştirilmiş özellikleri de mevcut. Örneğin ünlem(!) yazıp enter tuşuna basında HTML5 kodlarını yazması, img yazınca hazır img etiketi oluşturması vs. Visual Studio gibi tanımlanan fonksiyonun kaynağına gitme gibi özellikleri ile de dikkat çekmektedir.
Web tasarım programı indirme adresi : https://www.sublimetext.com/
9.Visual Studio Code
Ücretsiz
Brackets ile yarışması için oluşturulmuş gibi görünen, açık kaynaklı Microsoft tarafından geliştirilen ücretsiz( ilginç ama gerçek) kod editör.
Masaüstü sistemler için geliştirilmiş olan, açık kaynak kodlu, hafif ve hızlı javscript, php,ptyhon, c, c#, typescript ve benzeri diller için geliştirilmiş kod editörüdür. Brackets programında olduğu gibi geniş eklenti kütüphanesine sahip olduğunu belirteyim.
Web tasarım programı indirme adresi : https://code.visualstudio.com/
10.Adobe Animate / Adobe Flash Professional
Ücretli
Günümüzde flash uygulamalar web sitelerinde artık kullanılmamasına rağmen Adobe Animate ile hem swf hem de HTML5 formatlarında animasyonlar oluşturmak mümkün. HTML5 ve JavaScript ile etkileşimli animasyonlar oluşturmak için kullanabileceğiniz güçlü bir editör.
Web tasarım programı indirme adresi : http://www.adobe.com/tr/products/animate.html
11.Google Web Designer
Ücretsiz
Profesyonel HTML5 uygulamalar geliştirmek için hazırlanmış ücretsiz bir programdır. Hiç kod yazmadan etkileşimli HTML5 animasyonlar oluşturabilirsiniz.
Web tasarım programı indirme adresi : https://www.google.com/webdesigner/
12. InkScape
Ücretsiz
Windows, Linux ve Mac bilgisayarlar üzerinde vektörel grafikler oluşturmak için kullanabileceğiniz ücretsiz grafik tasarım programıdır. InkScape ile ilk çalışmaya başlayanlar için arayüzü biraz karışık gelmesine rağmen, youtube kanalları üzerinde oldukça fazla eğitim ve örnek ile öğrenmesi son derece kolay olan bir programdır.
Web tasarım programı indirme adresi : https://inkscape.org/en/
13. Macaw
Görsel düzenleyici ile bootstrap grid düzeninde esnek tasarımlar hazırlayıp HTML5 formatında kod üretebileceğiniz hazır bir tasarım aracıdır. Çok gelişmiş bir araç olmamasına rağmen ücretsiz olması test etmek için kullanabileceğiniz programlar arasında olabilir.
Web tasarım programı indirme adresi : http://macaw.co/
14. WireFrame CC
Ücretsiz taslak görünümler oluşturabileceğiniz güzel bir web aracı. Müşteri taleplerini hızlı bir şekilde oluşturup url adresi ile paylaşabiliyorsunuz.
Web tasarım programı indirme adresi : https://wireframe.cc
15. WireFrameSketcher
Yine ücretsiz wireframe dosyalar oluşturmak için kullanabileceğiniz ücretsiz ve bilgisayara kurulabilen bir uygulama.
Web tasarım programı indirme adresi : http://wireframesketcher.com/
