Uzun makaleleri okunulabilir kılan kullanılan yazı tipleridir.
Arial, Verdana, Tahoma veya Helvetica gibi klasikler dışında güzel yazı tipleri bulmak artık çok zor değil. Google, Web Fonts üzerinden binlerce kaliteli yazı tipini ücretsiz olarak sunmakta. Yelpaze bu kadar genişken yeniliğe ne dersiniz?
Bu makalemizde sizlere Google Web Fonts‘un en çok kullanılan 25 yazı tipini sunacağız. Ayrıca hepsi Türkçe karakter destekli! (daha&helliip;)
Bu paylaşımımda sizlere Google‘ın webmasterlar için büyük kolaylık sağlayan hizmetlerinden birini anlatmak istiyorum , Hizmetin adı GoogleWebFonts
Web tasarımıyla uğraşan arkadaşlar için çok faydalı olucağını düşündüğüm bu kaynak neye benziyor diye sorarsanız, size Cufon ve sIFR uygulamalarını örnek gösterebilirim.Bildiğimiz gibi artık websitelerinin konu başlıkları çok güzel şekillerde bizlere sunuluyor.Örnek
Cufon
sIFR
Gördüğünüz gibi bildiğimiz font gibi durmuyor.Cufon ve sIFR’ın özelliği jquery özelliklerini kullanarak konu başlıklarımızı bizlere img şeklinde göstermesi.Bundan dolayıda kaliteli bir görüntüyle karşılaşıyoruz.Bundan önce bende bazı projelerimde Cufon kullanmıştım fakat GoogleWebFonts’u kullandıktan sonra .js dosyaları ve bir sürü ayarla uğraşmadan siteme ekleyeceğim bir satır kod ile başlıklarımı ziyaretçilere daha güzel şekilde sunabileceğimi farkettim. (daha&helliip;)
Google‘ın tasarım devrimi üzerine konuşmaya devam ediyoruz. Material Design’ın günden güne web tarafına uyarlanan örnekleri bizim makalelerimizde de yerini buluyor. Daha önce buradaki makalemizde şık bir Material Design menü örneği hazırlamıştık.
Şimdi de ekranın büyük bir kısmını kaplayan, daha büyük yapıdaki bir başka menü tasarımı konu edeceğiz. HTML5, CSS3 ve jQuery desteğiyle hazırlayacağımız bu tasarım soğuk renklerden oluşuyor.
Bu makalemizde üzerine tıklandığında büyük ölçülerde açılan ve içeriği aksi yöne ittiren şık bir menü tasarımı hazırlayacağız. İkinci Material Design menü örneğiyle sizlerleyiz!
(daha&helliip;)
Google‘ın ses getiren tasarım trendi Material Design üzerine konuşmaya devam ediyoruz. Bugün Bennett Feely tarafından CSS ile hazırlanan menü örneğini sizlerle paylaşacağız.
Bennett’in örneği Material Design’ın estetik ve animatif tarafını başarılı bir şekilde yansıtmakta.
Web öğelerinin sadece spesifik kısımlarını CSS ile göstermemizi sağlayan clip-path tanımı da bu tasarımda faydalı bir şekilde kullanılmakta.
Eğer hazırsanız başlayalım.
(daha&helliip;)
Eğlenceli bir makale ile yine sizlerleyiz. Bugün sizlerle deftere çizeceğimiz bir eskize hayat vereceğiz. Böylece web tasarımının en derinlerine dokunmuş olacağız. Biraz uzun soluklu olsa da gayet eğlenceli. Yukarıdaki gibi deftere karaladığımız tasarımları ilk Photoshop‘a, daha sonra da HTML ve CSS‘e dökeceğiz. Tabii bu işlemleri yaparken bütün bu teknolojilerin en son versiyonlarını ve en güncel tanımlarını kullanacağız. Herşey hazır olduğunda aşağıdakine benzer bir sonuç elde edeceğiz.
Başlamaden önce malzemelerimizi hatırlayalım :
Bu makalemizde sadece CSS ile gazete yapısına benzer, bol kolonlu bir web tasarımı hazırlayacağız.
(daha&helliip;)
Üniversite hayatımın son yılında yazmaya başladığım “The Differences Between Web 1.0 and Web 2.0” konulu tezim hiç yönelmediğim, web tasarımının sosyal yönünü bana öğretti.
WWW içinde fazlasıyla yer etmiş onlarca akademisyenin çalışmalarını okumak üniversite eğitimi hayatımdaki tek verimli dönem olmuştu.
Bu makale dizesinde web geliştiricilerinin bilmesi gereken bazı ipuçlarından bahsedeceğiz. Web teknolojilerini verimli kullanarak sayfalarımızı geliştireceğiz bir yandan da SEO dostu tasarımı konuşacağız.
Okumakta olduğunuz makale sizlerle etkileşim içinde gelişecektir. Önemli bir bilgi bankası olana kadar genişlemeye devam edecektir. (daha&helliip;)
Günümüz web tasarımı trendlerinden biri de Türkçe karşılığıyla hayalet butonlar.
Literatüre göre ghost button, web sayfalarının birincil aksiyonuna kullanıcıları taşımakla ilişkilendirilmiş. Ayrıca çizgisel ve şık bir tasarıma sahip bu butonlar sitenizin cazibesini arttırmanıza yardımcı olacaktır.
Bu dersimizde sizlerle birlikte CSS kullanarak iki adet ghost button tasarımı oluşturacağız.
Bugün sizlerle birlikte görsel ve metinlerinizi bir arada şık bir şekilde sergilemenizi sağlayacak haber kutucukları tasarlayacağız. Mobil cihaz desteği de bulunan bu tasarım Material Design ruhunu da taşımaktadır.
(daha&helliip;)
Bugün sizlerle birlikte çok şık ve eğlenceli bir mesaj panosu tasarımı yapacağız.
iPhone‘un şık ve kullanışlı mesajlaşma ekranı hem sadeliği hem de kolay kullanılabilir olması sebebiyle izini sürebileceğimiz başarılı tasarımlardan birisi. Peki bu yapıyı web ortamına nasıl aktaracağız? HTML5 ve CSS3‘ün güçlendirilmiş yeni teknikleri ve jQuery‘nin fonksiyonelitesiyle bu iş sandığınız kadar zor olmayabilir.
Adobewordpress gururla sunar : Karşınızda responsive yapıdaki iPhone mesajlar ekranı tasarımı
Photoshop ile “This is it” Film Afişi Hazırlama
iPhone’da “Mesajlara Girilmiyor” hatası nasıl çözülür?
Ücretsiz WordPress Haber Temaları
CSS ile Yapışkan ‘Goo’ Öğeler