buton | bildirgec.org

Facebook'un buram buram sosyalleşme kokan Like Devrimi + + + ile kullanıcılarına sunduğu Sosyal Eklentiler sayesinde yüzlerce web sitesi kendisini Facebook'a entegre etmiş durumda.Bu entegrasyon sayesinde bu günlerde sayısının 500 milyonu geçtiğini öğrendiğimiz Facebook kullancıları, web deneyimlerini anında Facebook'taki arkadaşları ile paylaşabilmekteler. Yüzlerce web sitesi bu eklentileri kullansa da, bazı web siteleri henüz bu saadet zincirine entegre olmuş durumda değil.Facebook'un Like devrimini bu zincir dışındaki web sitelerinde de yaşamaya devam etmek istiyorsanız, Facebook Like Greasemonkey Scripti tam size göre bir eklenti/araç.

Facebook mühendislerinden Matt Kelly tarafından hazırlanmış, Facebook'un resmi bir ürünü görünümünde olan bu scripti, Greasemonkey'i destekleyen Firefox, Google Chrome ve Safari (GreaseKit) tarayıcılarından birine eklediğinizde, facebook.com haricindeki web sitelerini ziyaret ettiniz zaman bir araç çubuğu olarak size eşlik etmekte ve beğendiğiniz içerikleri Like'lamanızı (beğenme) sağlamakta.

Realistic Hover Effect With jQuery | Demo

Bu uygulama ile web sitenizdeki butonları hareketli hale getirebilirsiniz. Reflection ve Shadow şeklinde 2 farklı demosu bulunmakta.

Create an Animated Call to Action Button | Demo

Artık sing up butonları faklı olacak. Bu jQuery uygulaması ile butonları kararıp sönen veya farklı renklere şeffaf geçiş yapabilen bir özellik kazandıramanız mümkün.

Jquery Animated Buttons using CSS | Demo

Bu uygulama ile web sitenizde bulunan butonları hareketli hale getirebilirsiniz.

İnternette istemediğimiz kadar photoshop dersi var ama o kadar dağınık ki hangi ders hangi sitede bulması ve takip etmesi oldukça zor. Bu noktada işimize çok yarayacak bir derleme ile karşılaşınca burada paylaşmak istedim.

manipülasyondan illüstrasyona, yazı efektlerinden fırça kullanımına, web site tasarımından menü tasarımına kadar tam 760 photoshop dersinin bir araya toplandığı, her web&grafik tasarımcısının kesinlikle elinin altında olması gereken bir kaynak.

30 Retro tarzında photoshop dersi
Oldschool ve Retro tarzında tasarım yapmak isteyenler için 30 photoshop dersi.

Hayal gücünüzün ötesinde 50 fantastik manipülasyon dersi
Specky Boy Design Magazine'den hayal gücünün sınırlarını zorlayan 50 adet fantastik foto manipülasyon dersi

Web siteleriniz için 18 Header tasarımı dersi
Web sitelerinize profesyonel görünüm kazandırmak için işinize yarayacak 18 header tasarımı.

Photoshop, web tasarımı yaparken büyük kolaylıklar sağlıyor. Navigasyon, menü ve buton tasarımı için çok kaliteli derslere aşağıdan ulaşabileceksiniz.

Navigasyon bir site için çok önemlidir. Özellikle sitedeki bölümler arası geçişi sağladığından sık kullanılmaktadır ve görsel olarak iyi olması gerekmektedir.

Şimdi Parlak, temiz, şık, düzgün ya da 3d navigasyon tasarlamayı öğrenmeye başlayalım.

1.Content Box With Orange Banner Heading (Turuncu banner başlığı ile içerik kutusu)

Bu derste içerik kutusu benzeri benzeri menü tasarlamayı öğrenebileceksiniz.

2. Vista Styled Button Photoshop Tutorial (vista tarzı buton photoshop dersi)

Çoklu layer stili, araçları ve teknikleri kullanarak vista tarzı buton tasarlamayı öğrenin.

Tasarımcılara yardımcı olacak bir sürü çevrimiçi üreteç bulunuyor. Örneğin favicon, arkaplan, buton, kimlik kartı en popüler üreteçler arasında yer almaktadır.

Aşağıda Css Grid şablonları oluşturabileceğiniz sitelere ulaşabilirsiniz.

1 - Grid Layout Generator by Pagecolumn

2 - Grid Generator by DesignByGrid

Web tasarımcıları için internette çok güzel ve faydalı araçlar bulunuyor. Arşivinize alabileceğiniz birbirinden güzel siteler aşağıda yer almaktadır.

1. HTML Entity Character Lookup

Yazmış olduğunuz harf ve karakterlerin html karşılığını bulabiliyorsunuz.

2. Blueprint CSS framework

Çıktı alabilmeniz için proje üzerinde tablolarını kullanarak sağlam bir temel sağlar.

İyi tasarlanmış butonlar sitenin genel görünümü için büyük fark yaratabilir.

Bu yazıda şekil, boyut, stil ve renk bakımından ilham kaynağı olabilecek butonlara ulaşabilirsiniz.

1 - GoodBarry

2 - Your Web Job

3 - Aviary

Geliştiriciler ve tasarımcılar gün geçtikçe modern tasarımlarında daha çok JavaScript kullanır oldular. Bazen JavaScript kullanımı kullanıcının işini zorlaştırıp tasarımın sadeliğini alırken kimi zaman da kullanıcı deneyimine çok önemli katkıları olur. Burada önemli olan a) doğru miktarda JavaScript kullanmak ve b) doğru JavaScript tekniklerini kullanmaktır. Bugüne kadar pek çok javascript tekniğini sizlerle paylaştım. Bu makale ile listeye bir yenisini ve kendimce en verimlisini eklemeyi planlıyorum.

Web'in JavaScript'e hızlı geçişi sağolsun JavaScript kütüphaneleri tasarımcıların ve geliştiricilerin işlerini kolaylaştırmak için çığ gibi büyümeye devam ediyorlar. Geliştiricilerin kullandığı JavaScript kütüphaneleri arasında jQuery, Prototype, Scriptaculous, mooTools, Dojo en çok kullanılan kütüphaneler olarak gösterilebilir. Bu çatıları kullanan komünite üyelerinin oluşturduğu sayısız eklentiler de JavaScript kütüphanelerine dahil edilebilmektedir.

Ancak bazen bazı özel ihtiyaçlara yönelik olarak geliştirilmiş JavaScript çözümlerine ihtiyacımız olabilir. İki bölüm halinde yayımlayacağım bu yazımda web sitelerini çok daha ilginç ve çekici kılan 75 gerçekten kullanışlı JavaScript Tekniğinden bahsetmek istiyorum.

Web'de Heceleme
Bu proje (X)HTML sayfaları için otomatik hecelemeye yönelik çalışan çözümleri bir araya getirmeyi hedefliyor. Hem farklı insan ve betik dilleri için, hem de sunucu ve istemci taraflı platformlar için. Hyphenator.js adı verilen bir JavaScript çözümü de mevcut. Hyphenator.js, HTML belgelerinin sunucu taraflı hecelemesini, bazı ortak heceleme kuralları ve Franklin M. Liang'ın LaTex ve OpenOffice'te de sıkça kullanılan heceleme algoritmasını tüm tarayıcılara getiriyor.