Web sitenizin başlığı ziyaretçi üzerinde hemen etki yapar bu nedenle özenle hazırlanması gerekir.
Bu yazıda 5 farklı türde etkili başlık örneklerine ulaşabileceksiniz.
Büyük Başlık
Büyük başlıklar çok güzel görünüyor ancak kullanmak riskli olabilir.
1 – Lewro’s Blog
2 – Chris Hortsch
Bu yazıda web tasarımındaki başlıkların (site başlıkları ve içerik başlıkları) verimliliğini arttırmak için uygulanabilecek bazı kolay ve hızlı tekniklerden bahsedeceğim. Verimli başlıklar kullanıcılar ile daha hızlı iletişim kurdukları gibi onların fazla düşünmesine gerek kalmadan sitenizin içeriği hakkında bilgi sahibi olmalarını sağlar. Bu kurallar uygulamanız gereken kuralların tamamını içermemesine rağmen tasarım aşamasında göz önünde bulundurmanız gerektiren kurallardır.
1. Başlıklarınızın İçerikten Gözle Görülür Bir Biçimde Ayrı Olmasına Özen Gösterin
Başlıklarınız içeriğinizden farklı ve ayrı bir şekilde görünmelidir. Tıpkı site içi bağlantılarınızın rengini değiştirip altını çizili görüntülediğiniz gibi, başlıklarınızın görünümü de sitenin geri kalanına kıyasla daha özgün olmalıdır. Renkler, yazıtipi boyutu ve farklı yazıtipleri kullanarak başlıklarınıza kontrast uygulayın. Altı çizili elementlerin bağlantılarla sınırlı kalması sitenin genel uyumluluğu açısından önemli olduğunu unutmayın.
2. Daha Sıcak Renkler Kullanın
Sıcak renkler, soğuk renklere oranla daha dikkat çekicidirler. Sıcak renkler aktiftir, dikkat çekerler ve sayfanın geri kalanından daha ön planda görünürler. Soğuk renkler ise sayfayla bütünleşir. Mümkün olduğu kadar sıcak renkler kullanarak okurlarınızın dikkatini daha çabuk çekereken onları içeriğin kendisine odaklanmalarına yardımcı olmaya çalışın.
blonuzda en alta indiğinizde içinizi karartan birşeyler oldu mu? hemen yukarı mı çıkmak istediniz? “Header Nedir” yazımızda üzerinde durduğumuz sayfa başlığı imajlarından biraz aşağılara inelim ve tasarımcıların bloglarının diplerine gömdükleri sanatsal çalışmalara bir göz atalım. her ne kadar çok önemsenmese ve dikkat edilmese de gerçekten tasarımı bir kalıba oturtmak için uygulanan pek narin hoş footerlar bunlar;
Bir web sitesini açtığımızda ilk dikkatimizi çeken elemanlardan biri, header tabir ettiğimiz, site başlığıdır herhalde. Vandelay Design 30 yaratıcı site başlığını derlemiş. İşte bir kaç örnek:
birçok site tasarımının sadece headerve footertasarımları ile dikkat çekici kılındıkları aşikar bir durum. footer tasarımları sayfanın en altında kaldığı için pek ilgi çekmezken headerlar ise girişte gözümüzü alan ilk görsel cümbüştür. bugün bu işi özel olarak yapan kaynak sitelere dahi ulaşmak mümkün olmakta. hatta tasarımda söz sahibi sitelerden smashmagazinin yılın 2.ayında düzenlediği header tasarım yarışmasından da bu ilgiyi görmek mümkün.
bedava header grafiği sunan listesine ulaşmak için sizleri selcukhoca’nın kaynak bildirisine ve şuradakiadrese yönlendiriyorum. bu adresleri bir tasarımcı olarak ilmal etmenizi istemediğimi belirtip sizleri herbiri birer esin kaynağı olabilecek header tasarımlarımlarıyla başbaşa bırakıyorum.
*son örnekte kendi header imajımı ekliyor ve sizden gelecek örnekleri bekliyorum.
HTML4’ün yavaş yavaş beklentilere cevap verememesiyle birlikte yeni arayışlara giren tasarımcılar div ayraçlarını CSS ile verimli şekilde kullanmaya başlamışlardı. Ne kadar iyi kodlamalar yapılsa da HTML4’ün artık yetmediği ortaydı.
HTML5 ise dilde yalınlık ilkesini amaç edinen yeni özellikleri ile kullanıcıların işini kolaylaştıracak. Daha az kodla sitelerimize aynı görünümleri verebileceğiz. Alistapart kaynağında okuduğum html5 içeriğinde bu yalınlaşma gayet iyi açıklanmış.
1.
Blogger’da sayfa her yüklendiğinde farklı bir header fotoğrafı gösterilmesini istiyorum. Nasıl yapabilirim?
2.
Bildirgeç’te de şu anda gördüğünüz gibi, sayfanın en üst kısmında başka bir blogumda yayınlanan yazının başlığının görünmesini istiyorum. Nasıl yapabilirim?
text2png ile sitenizde bulunan yazıları otomatik olarak png formatında resimlere dönüştürebilirsiniz.
Kullanılışı
bölümündeki kodları header dosyamıza ekliyoruz.
Belirtilen bir klasör içindeki resimleri sıralı ya da rastgele slayt olarak gösteren hoş ve basit bir flash. Bir joomla modülü olan ja header üzerinde düzenleme yapılarak hazırlandı. Detaylar: demo, download, dökümanlar
open web graphics tasarımcılara çeşitli konularda kaynak sunan bir site. ikon, arka plan, banner kategorilerindeki içeriğe kullanıcılar da katkıda bulunabiliyor. hanüz dar bir arşive sahip olsa da ileride gelişmesi muhtemel.
