yazi-portre-poster-tasarimi

Photoshop ile Şık Yazı Portre Tasarımı

Geçtiğimiz günlerde Photoshop ile şık poster ve afiş tasarımları hazırlamıştık. Bugün onlara bir yenisini katacağız.

Birlikte Mario Puzo‘nun dünya klasiklerine armağanı olan Godfather için bir tasarım hazırlayacağız. Kitap karakterlerinden olan Vito Corleone‘den (Marlon Brando) bir alıntı ve portreden oluşacak bu tasarım hem şık hem de basit.
(daha&helliip;)

Devamını Oku


HTML5 ve CSS3 ile Resim Açıklamaları

css-html-hover

Bugün sizlerle HTML5 ile gelen figure ve figcaption tanımlarını CSS3‘ün animasyon öğeleriyle süsleyerek şık resim açıklamaları oluşturacağız. Bu işlemi daha önce, HTML5 öğeleri olmadan benzer yollarla “CSS ile SEO ve performans dostu harika resim açıklamaları” başlığı altında hazırlamıştık. Eski makalemizi güncellemektense bu süreçte gelişen teknolojinin nimetlerinden yararlanarak yenisini hazırlamaya karar verdik.

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku

CSS ile Yazı Arka Planı : text-fill-color

text-fill-colorCSS3 ile yelpazeye dahil olan text-fill-color ile alışılagelmiş color arasındaki farkları inceleyeceğimiz bir makaleyle devam ediyoruz.

Sol tarafta görmekte olduğunuz gibi bu teknik ile fotoğrafları rahatlıkla metin üzerine yerleştirebiliyoruz. Sadece fotoğrafları değil, gradient (renk geçişleri) de bu teknik ile kullanılabilmekte. (daha&helliip;)

Devamını Oku

CSS ile Text-Shadow’a Maske

Masked Text Shadow

Daha önce CSS3’ün gelişmiş text-shadow özelliği ile şık tasarımlar yaptık. Bu makalemde ise oluşturduğumuz çizgisel PNG dosyasını kullanarak gölgelerimizi nasıl maskeleyeceğimizi öğreneceğiz. Özellikle başlıklarınızın için kullanabileceğiniz bu gölgeleme tekniğini hazırlamak gayet basit.

Maske.png dosyasına buradan erişebilirsiniz.

Eğer hazırsanız derse başlayalım. (daha&helliip;)

Devamını Oku