bildirgec.org

Google Chrome’un popularitesi günden güne artıyor ancak yine de firefox’u geçmeyi başaramadı. Birçok web tasarımcısı ve geliştiricisi, onlara sunduğu ve ihtiyaçlarına anında cevap veren eklentileri sebebiyle firefox’u tercih ediyor. Fakat bu aralar google chrome da bu ihtiyaca cevap vermeye başladı çünkü Chrome’un eklenti desteği web tasarımcılar ve geliştiriciler için daha kullanılabilir hale geldi. Bu yazıda web tasarımcılar ve geliştiriciler için yararlı en iyi 10 chrome eklentisine değineceğiz.
1. MeasureIt!

Bu aracı kullanarak bir sayfadaki herhangi bir nesnenin yükseklik ve genişliğini bir cetvel yardımıyla elde edebilirsiniz.
2. Firebug Lite

Bu eklenti web geliştiricilerin herhangi bir sayfanın css, html ve java kodlarını düzenleyip işlemesine imkân tanıyor.

Her profesyonelde olduğu gibi, internet tasarımcılarının kullandıkları aletler de yaptıkları işlerin kalitesini belirler. Dışarıda internet tasarımı üzerine kullanabileceğiniz oldukça çok sayıda uygulama mevcut. Ancak bazıları var ki, kalabalığın arasından sıyrılıp öne çıkıyor. Bu yazıda en iyi olarak belirtilenler, popüler olarak en çok kullanılan araçlar oluyor.

SixRevisions sitesinde yapılan bir oylama sonucu göre işte sonuçlar.

5. Fireworks

Adobe tarafından geliştirilmiş ve piyasaya sürülmüş olan Fireworks, hem windows hem de Mac üzerinde çalışabilen bir vektör grafik editörüdür. Photoshop’tan farklı olmak üzere, sadece web tasarımcıları için geliştirilmiştir. Site yayılım tasarımına kadar birçok araç Fireworks ile beraber gelmektedir.

Hızlı tasarım yapılmasını sağlayan, tasarımın bir resim halinden HTML/CSS haline dönüştürmede kullanılan dilimleme özelliği ve site denemesi olarak, bütün site tasarımını üzerine tıklanabilen etkileşimli pdf haline dönüştürebilmesi en önde gelen özellikleri arasında sayılabilir. En iyileme araçlarını da unutmamak gerekir.

Tasarımcılar ve web geliştiricilerinin (webmaster) büyük çoğunluğu firefox kullanıyor. Bunun nedeni çoğunlukla eklenti desteği. Eklentiler sayesinde tarayıcının performans ve kapatisesi sonuna kadar kullanılabiliyor. Bu sayede web geliştiricileri zamandan kazanıyor ve işlerini daha kolay yapıyor. Aşağıda firefox ile birlikte kullanılarak webmasterlerin işini büyük ölçüde kolaylaştıracak 22 eklentiye yer verilmiştir.

Web Developer Toolbar

Web Developer Toolbar

Geliştiriciler için basit ve kullanışlı bir araç çubuğu.

Firebug

Firebug

Web sayfasının CSS, HTML ve JavaScript kodlarındaki hataları bulabilir ve onarabilirsiniz.

Page Speed

Page Speed

Açık kaynaklı bir eklenti. Sayfa hızının performansını değerlendirebilir ve nasıl iyileştirebileceği konusunda tavsiye alabilirsiniz.

FirePHP

FirePHP

FireBug konsoluna mesaj göndermeye yarar. Firebug yüklenmiş ve “net” paneli aktif olmalıdır. Bir adette PHP kütüphanesi yüklemelisiniz.

YSlow

YSlow

Firebug

Firebug daima web geliştiricileri arasında en yoğun kullanılan en popüler araçlardan birisi olmuştur. Firefox‘u muhteşem yapan eklentilerden birisi bence. Bu yazıda firebug kullanmanız için sizi ikna edebilecek 10 konudan bahsedeceğim.

Sebep 1: Konsol

Firebug – Konsol

firebug’ı açınca ilk farkedeceğiniz şey (ister sağ alttaki simgeye tıklayarak açın, ister ctrl+f12 kısayolunu kullanın) karşınıza çıkacak olan konsol paneli olacaktır. Firefox’un hata konsolu ile çok benzeştiğini düşünseniz de, ortak özellikleri şunlar:
– Hata, uyarı, ikaz görüntüleme
– Javascript kodu çalıştırabilme
Ancak firefugkonsolu eşsiz kılan ek özellikler şunlar:
– Javascript, CSS, XML, xmlhttprequest (ajax) ve firefox’un kendi iç hatalarını görüntüleyebilir.
– mevcut sayfa üzerinde javascript kodu çalıştırabilir.
Örnek bir sayfa üzerinde incelemek gerekirse.

sebep 2: HTML

Firebug – Html

Firebug’un panelleri arasında belki de en çok zaman geçireceğiniz panel html paneli.
– 1. Ögeyi incele olarak çevirebileceğimiz bu düğme, hem hangi ögeyi incelediğinizi kısaca size gösterirken, hem de istediğiniz tag’i seçme konusunda inanılmaz bir kolaylık sağlıyor.
– 2. Burada seçili olan tag’in hiyerarşik yapısını görebilir ve üzerinde değiştirmekten silmeye kadar her türlü işlemi yapabilirsiniz.

Bu makalede en popüler web tasarım araçlarına ulaşabilirsiniz.

5 – Fireworks

fireworks

Adobe Fireworks, mac ve windows işletim sistemlerinde kullanılabilen ücretli bir grafik editörüdür.

özel araçları sayesinde HTML/CSS için kolaylık sağlamasıdır. Bir web sitesi yapabilmek için bütün imkanları sağlamaktadır.

Bir web tasarımcısı olarak size yardımcı olabilecek pek çok açık kaynaklı yazılım bulunmaktadır. açık kaynaklı projeler sırf ücretsiz oldukları için mükemmel olmakla kalmaz, ayrıca onlara katkıda bulunan azimli geliştiriciler de ilgili yazılımları mükemmel kılarlar. Günümüzün zor ekonomik koşullarında harcamalarınızı mümkün olduğu kadar kısabilmek her zaman kullanışlıdır ve bu sebeple açık kaynaklı alternatifler de her zaman göz atılmaya değerdir.

Bu yazıda web tasarımcıları için 30 adet son derece kullanışlı uygulamayı bulacaksınız. Listede kaynak kodu düzenleyicilerinden WYSIWYG düzenleyicilerine, grafik tasarım yazılımlarından görev yönetim yazılımlarına kadar pek çok faydalı yazılımı bulacaksınız.

Kaynak Kodu ve WYSIWYG Düzenleyicileri

1. KompoZer

KompoZer

KompoZer tam özellikli bir web yayımlama uygulaması olup bütünleşik FTP istemcisi, sekmeli kullanıcı tasarımı ve tüm önemli işletim sistemleri için destek barındırmaktadır.

2. Bluefish Editor

Bluefish

Bluefish Editor, web tasarımcıları ve programcıları için geliştirilen hafif ve hızlı bir düzenleyicidir. Uygulamanın HTML belgeleri için sunduğu sihirbazlar, mükemmel proje yönetim özellikleri ve kaynak kodlarını yenileri ile değiştirmek için güçlü ara ve değiştir seçeneği gerçekten kullanışlı.

Her ne kadar belden aşağı vurmak gibi gelse de bazen projeler içerisinde firefox eklentisi olan firefug ‘un sitemin tüm kirli çamaşırlarını sermesi hoşumuza gitmez, bazı sayfalarda firebug ‘u kullanıcıda pasif hale getirmek gerekebilir…

Belki sizinde işinize yarar.

if (! (‘console’ in window) || !(‘firebug’ in console)) {
var names = [‘log’, ‘debug’, ‘info’, ‘warn’, ‘error’, ‘assert’, ‘dir’, ‘dirxml’, ‘group’, ‘groupEnd’, ‘time’, ‘timeEnd’, ‘count’, ‘trace’, ‘profile’, ‘profileEnd’];
window.console = {};
for (var i = 0; i < names.length; ++i) window.console[names[i]] = function() {};
}

Firecookie

Firecookie
Firebug için bir eklenti. Bu eklenti ile tarayıcınızda Firebug ile düzenlediğiniz veya incelediğiniz sitelerin çerezlerini yönetebilir (silebilir, değiştirebilir) veya yeni bir çerez ekleyebilirsiniz.
Firecookie’yi buradanyükleyebilirsiniz (Önceden Firebug yüklü olmalıdır, yüklü değilse Firebug’u da buradanyükleyin.).
Kurulum(lar) bittikten sonra Firebug ikonuna tıklayın, Cookies başlıklı bir sekmenin geldiğini farkedeceksiniz.

Cookies sekmesine tıklayın

İşte çerezler karşımızda çerezi yönetmek için çerezin üzerine sağ tıklamanız yeterli.

Firecookie

firefox’a eklenti 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 sıralamışlar.

Web Developer Toolbar | detay

çeşitli kısayollarda kaynak kodlara ulaşmanızı sağlayan küçük bir toolbar eklentisi

wordpress tema açısından her ne kadar zengin olsa da site yapımcılarına, blogculara belirli bir ücret karşılığında tema satan birçok site de mevcut.

şurada firefox‘un firebug eklentisi ile bir wordpress temasının nasıl kolayca ele geçirilebileceği (kaynakta çalınacağı denilmiş, ancak gayemiz o değil, olmamalı) anlatılmış. elbette konunun bu haliyle etik bir yanı yok fakat yazıda da değinildiği üzere XHTML, CSS bilgisini geliştirmek isteyenler çeşitli denemeler yapabilir. zaten bu konuda ilerleme kaydetmek isteyenlerin kopya bir tasarım kullanmalarını beklemek yersiz olur.