CSS ile Yumuşak Geçişli Arka Planlar

CSS3’ün gradient özelliği ile dikkat çekici arka planlar hazırlamak mümkün.
CSS Awesome Gradient
Renk geçişleri için genelde büyük boyutlarda JPG ve PNG dosyaları kullanılır. Bu da web sayfanızın aşırı yavaşlamasına sebep olabilir. CSS Gradient sayesinde oluşturacağımız renk geçişleri performans açısından görsel dosya formatlarından fazlasıyla önde.

Şimdi ilk bu yeni özelliği tanıyalım, sonra ise birkaç kaliteli örnek üzerinde çalışalım. (daha&helliip;)

Devamını Oku

CSS Gradient Arkaplan ve Performans

CSS in background kod satırı içerisinde desteklenen onlarca arka plan türü var. Bu yazımda ise gradient (renk geçişlerini) türünü konuşacağız.

Görsel sıkıştırma üzerine konuştuğumuzda renk geçişleri içeren bir objenin dosya boyutunun yüksek olduğundan bahsetmiştik. Hele ki bu görsel zıt tonlamalar arasında geziyorsa onu yayınlamak hem sunucunuzu hem de ziyaretçinizi fazlasıyla rahatsız eder.

CSS ise bunu farklı bir yolla yapıyor. Rengin atanması ve gradient olarak arka plana yerleşmesi kişinin siteyi ziyaret ettiği bilgisayarda işlenmekte ve bant genişliğini rahatsız etmemekte. (daha&helliip;)

Devamını Oku

CSS ile Yazılara Gradient Efekti

Bu dersimizde ilk olarak Nick La’nın web sayfasında gördüğüm CSS Text Gradient tekniğini öğreneceğiz.

Bu teknik minik bir hile üzerine kurulu. Web sayfanızın arka plan rengiyle uyumlu gradient dosyaları hazırlayıp onları span halinde yazıların üstüne ekliyoruz.

Nasıl mı? Beyaz bir arka plan, üzerinde siyah bir başlığın olduğu sayfanız var diyelim. Beyazdan 0% opacity e doğru giden bir gradient çizip .PNG uzantısı ile kayıt ediyorum ve yazının üzerine gelecek şekilde yerleştiriyorum. Böylece gayet kullanışlı bir yazı efekti elde ediyorum.

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku

Photoshop ile Denize Yansıyan Işık Efekti

Geçtiğimiz hafta güzel bir okyanus fotoğrafı gördüm. Fotoğrafa biraz yaklaştığımda beyaza yakın tonlarda birkaç pikselin seçilebilir olduğunu gördüm. Kısa bir süre araştırdıktan sonra görselin Photoshop ile hazırlandığını, görünen ışığın ve ışık kaynağının sonradan eklendiğini anladım. Fakat ilk bakışta yeterince gerçekçi gözüküyordu.

Bu makalem ise o ışık efekti üzerine çalışırken kendiliğinden oluştu.

(daha&helliip;)

Devamını Oku