HTML5 ve CSS3 teknolojilerinin gelişimi ile birlikte önceleri JavaScript desteği olmadan yanından bile geçemediğimiz tasarımları artık kolayca hazırlayabiliyoruz. Özellikle CSS3‘ün animatif tanımları, tasarımın web tarafında slider, galeri ve türevi görsel bazlı öğeleri popüler kılmakta.
Bu yazımızda sadece CSS3’ün animation özelliğiyle bir resim geçişi tasarımı hazırlyacağız.
(daha&helliip;)
CSS3 ile birlikte görsellere ekleyebileceğimiz interaktif efektlerin sayısı günden güne çoğalmakta. Bugün sizlerle birlikte üzerlerine gelindiğinde büyüyen arka plan yapılı tasarımlar oluşturacağız.
(daha&helliip;)
Merhaba arkadaşlar. Yayınladığımız slider konulu makalelere gösterdiğiniz alaka sebebiyle aynı konuyu tekrar işlemeye karar verdik. Bugün sizlere kolay kullanımı ve gelişmiş özellikleriyle Fotorama Slider‘ı tanıtacağız. Yapımcıların yorumu şöyle :
(daha&helliip;)“Basit, şaşırtıcı, jQuery ile hazırlanmış gülçlü bir resim galerisi.”
CSS3 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;)
Web sayfanıza renkli geçişlere sahip etkileyici bir menü hazırlamak ister misiniz? Hem de sadece CSS kullanarak… Aşağıdaki css menü örneğini test ederek başlayabilirsiniz.
(daha&helliip;)
the_post_thumbnail, WordPress konularımızda eklediğimiz öne çıkarılmış görselleri direkt olarak çekmemize yarayan bir fonksiyondur.
Özellikle tema yapımı ve düzenlenmesiyle ilgileniyorsanız özel listelemeler için bu etiketi kullanmanız kaçınılmaz.
Sizlere bu fonksiyonun array desteğinden bahsedeceğiz. Böylece paylaşacağımız değerleri kullanarak çektiğiniz görseli boyutlandırabilir, sağa-sola yaslayabilir, alt title değerini değiştirebilirsiniz. (daha&helliip;)
Günümüzde neredeyse çoğu grafik sitesi görselleri için büyüteç tekniğini kullanmakta. Hatta sık sık ziyaret ettiğimiz alışveriş siteleri bile ürünlerini daha iyi sunmak için bu tekniği kullanmakta.
Peki nasıl oluyorda imleci görsellerin üzerine getirince bir mercek içinden bakabiliyoruz? Bu makalemde bu soruyu birlikte cevap arayacağız.
Biraz CSS, biraz HTML ve biraz da jQuery… Hadi başlayalım!
(daha&helliip;)
Grunge tasarımın özündeki eskitme özelliğini önceki çalışmalarımızda bol bol kullandık.
Okumakta olduğunuz derste ise gölgeleri biraz abartıp küçük renk değişiklikleri yapacağız. Tasarımın çıkış noktası grunge değil fakat ortaya çıkan şey başka bir kategori altında listelenemez diye düşünüyorum.
Ben buradaki görsel üstünde çalışacağım. Üzerinde çalışmak için bir görsel seçtiyseniz derse başlayabiliriz. (daha&helliip;)
CSS ile görsellere verilen geçiş efektlerinden daha önce bahsetmiştik. Şimdi yavaş yavaş detaylandırıyoruz.
Bu makalede sadece bir adet teknikten bahsedeceğim. Bu tekniği iki ayrı görsel tipi üzerinde uygulayıp sonuçları sizinle paylaşacağım.
İlk olarak örneği görüntülemenizi öneririm.
(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;)
WordPress Kullanıcılarının En Sık Karşılaştığı Hatalar ve Çözümleri
Sitenize Kolayca Slider Ekleyin
Photoshop’u Türkçe Yapma, Türkçeleştirme
Kolayca fotoğraflarınızın kalitesini arttırın!
CSS Renk İsimleri
Kolay ve işlevsel slider : Fotorama!
CSS ile Mobil Menü
Photoshop ile Fotoğraflarınızı 3D Yapın
WordPress Kullanıcılarına .htaccess İpuçları