Bugün, web tasarım ve geliştirmeyle ilgilenen arkadaşlarım için yararlı olacağını düşündüğüm Chrome eklentilerini listeledim.Bu eklentilerin bazılarını uzun zamandır kullanıyorum,bazılarını da yakın zaman önce tanıdım.
Google’un Chrome web tarayıcısını artık duymayan kalmamıştır.Internet Explorer’ın tahtını elinden alalı uzun yıllar oldu ve internet kullanıcılarının yüzde 50’den fazlası tarafından tercih edilmekte.Web ile uğraşan bir çok arkadaşımın ve meslektaşımın da hem hızlı oluşu,hem de web teknolojisinde sunulan yeni güncellemelere anında adapte olmasından dolayı en fazla tercih ettiği tarayıcı konumundadır.
Chrome’u diğer tarayıcılardan ayıran en büyük özelliklerinden yada avantajlarından biri de şüphesiz binlerce eklenti ve uygulama desteğidir.Chrome web mağazasında onbinlerce eklenti mevcut ve geliştirilmeye devam edilmekte.Bu eklentilerden bazıları da web tasarımcıları ve geliştiricileri için çok önemli yardımcı araç niteliğinde.Tabi ki bizim için sunulan eklentiler benim listem ile sınırlı değil.Ben sadece en fazla kullandığım,yararlandığım işlerimi kolaylaştıran eklentileri listeledim.Bunlar dışında kullandığım diğer eklentiler de mevcut ama o bu yazının konusu değil.Bir diğer yazımda onlardan da bahsedeceğim.Lafı da fazla uzatmadan sizleri listemle baş başa bırakıyorum.
1 – ColorZilla
ColorZilla, gezindiğiniz sayfalarda beğendiğiniz renkleri bulmanıza yardımcı olan harika bir Chrome eklentisidir.Bir web sitesinde hoşlandığınız rengin fare ile üstüne gelerek renk kodlarını HEX ve RGB değerlerin de öğrenebilirsiniz.Kolayca kopyalama yapabilir ve geçmiş seçimlerinize ulaşabilirsiniz.
Eklentinin kendi içerisinde bulunan renk paleti ile kolaylıkla renkler oluşturabilir,Bulunduğunuz sayfanın baskı olan bütün renklerini elde edebilirsiniz.Ayrıca eklentinin kendi sayfasında kolay gradient oluşturmak özellikte bulunmaktadır.Tamamen ücretsiz bir eklentidir.
Alternatif olarak Eye Dropper,ColorPick EyeDropper eklentileri bulunmakta.
2 – Gradient Inspector
Gradient Inspector, Chrome Geliştirici Konsolunda özel bir alan oluşturarak bir web sayfasındaki gradientli elementin gradient değerlerini öğrenmek için kullanabileceğiniz bir eklenti.
3 – What Font
WhatFont, eklentisi web sayfalarında kullanılan fontları öğrenmeye yarayan kullanışlı bir Chrome eklentisidir.Hangi fontla yazıldığını öğremek istediğiniz kelimenin üstüne fare ile geldiğiniz de kullanılan fontun ismini görebilirsiniz.Eğer kelimenin üzerine tıklarsanız kullanılan diğer fontları,yazının boyutunu(font-size), satır yüksekliğini(lin-height) ve HEX değerli rengini öğrenebilirsiniz.
Unutmadan eklenti imaj halinde yüklenmiş mesela logolarda doğru çalışmaz.Bunun yerine sitenin varsayılan olarak ayarladığı fontu gösterir.
4 – Corporate Ipsum
Corporate Ipsum, tasarımcıların tasarım taslaklarını oluştururken sıklıkla kullandığı lorem Ipsum(basmakalıp) cümleleri oluşturmaya yarayan harika bir eklenti.Corporate Ipsumu diğer basmakalıp cümle oluşturuculardan ayıran özellik anlamsız Lorem Ipsum kelimeleri yerine kendi içerisinde bulunan mantıklı cümlerler sunmasıdır.Eklenti 500 kelimeye kadar cümle oluşturmanıza olanak sağlıyor.
5 – 45 to 75
45to75, bir web sayfasında seçtiğiniz cümlenin kaç karaktere sahip olduğunu gösteren oldukça basit ve yararlı bir eklenti.Özellikle sınırlı cümle kuracağınız zaman -mesela geliştirdiğiniz web sitenin SEO uyumlu olması için başlığı maksimum 65, tanımı için maksimum 160 karakter olması gibi- kolayca hesaplama yapabilirsiniz.
6 – Page Ruler
Page Ruler, en sevdiğim Chrome eklentilerin biridir.Bir web sayfasında istediğiniz bir alanı işaretliyerek yüksekliğini ve genişliğini öğrenebilirsiniz.Bununla birlikte seçtiğiniz alanın,tarayıcı ekranına sağ-sol,yukarı ve aşağıdan uzaklığinı da görebilirsiniz.
Ayrıca Element Mode özelliğini aktif ederek fare ile üzerine geldiğiniz alanı eklentinin kendisi işaretliyerek hesaplar.
7 – Dimensions
Dimensions, bir web sayfasındaki elementler arasındaki mesafeyi ölçmeye yarayan oldukca işe yarayan güzel bir eklentidir.Kullanım da bir o kadar kolay.Eklentiye tıkladıktan sonra fare ile sayfa üzerinde gezinirseniz,eklenti sayfanın elementlerini kendi yakalıyor ve mesafelerini gösteriyor.
8 – Window Resizer
Window Resizer, son zamanlarda web tasarımda popüler olan responsive tasarım anlayışına yardımcı bir eklentidir.Geliştirdiğiniz web sayfasının belirli boyutlarda nasıl göründüğünü test etmek için, otomatik olarak tarayıcı ekranını küçültüp büyüten bir similasyon eklentisidir.Söz gelimi iPhone 6 da web sayfanızın nasıl göründüğünü test etmek için, eklenti de 640×960 boyutlarını seçerseniz tarayıcınız bu boyuta küçülecektir.
9 – Capture Page Screenshoot
Capture Page Screenshot, eklentisi bir web sayfasından ekran görüntüsü almak için kullanabileceğiniz en kullanışlı ve kolay Chrome eklentisidir.Eklenti ile seçtiğiniz özel bir alanı,bütün sayfayı yada ekranda gördüğünüz alan kadar yerin ekran görüntüsünü alabilirsiniz.
10 – LivePage
LivePage, HTML,CSS,Javascript değişikliklerini otomatik olarak algılayıp tarayıcıyı dinamik olarak yenileyen web geliştiricileri için yardımcı bir canlı değişiklik önizleme eklentisidir.
11 – Live CSS Editor
Live CSS Editor, herhangi bir websitesinde canlı olarak CSS ayarlarını değiştirmeye yarayan ve anında değişilikleri görmenizi sağlayan eglenceli bir Chrome eklentisi.Yaptığınız değişikleri, sayfayı yenileseniz dahi bellekte saklıyor.Bu eklenti ile kolayca CSS yeteneğinizi test edebilir ve geliştirebilirsiniz.Ayrıca kendi geliştirdiğiniz projenizde yapmak istediğiniz değişikleri ilk olarak bu eklenti ile deneyerek sonuçlarını rahatlıkla görebilirsiniz.
12 – Snappy Snippet
SnappySnippet, seçilen alanın HTML ve CSS kodlarını yakalayıp gösteren, olağanüstü harikan bir Chrome eklentisi.Bir web sayfasında beğendiğiniz bir alanın HTML ve CSS ile nasıl yapıldığını,nasıl kodlandığını kolayca öğrenebilirsiniz.Ayrıca tek bir buton yardımı ile bu kodları Codepen,jsfiddle,jsBin gibi online editörlere gönderebilirsiniz.
0 Yorumlar