Adobewordpress gururla sunar : “iPhone Mesajlar Ekranı”

iphone-mesajlar-css-html
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ı

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku

CSSGram ile Resimlerinize Instagram Filtresi Ekleyin

CSS‘in filtrelerine üzerine bolca konuştuk. Popüler tarayıcıların neredeyse tamamının da destek vermesinden sonra CSS Filter yapısı kullanılarak yepyeni kütüphaneler oluşturuldu. Bugün size bu filtre kütüphanelerinden biri olan CSSGram’ı tanıtacağız. İsminden de anlaşılacağı gibi bu kütüphane resimlerinize Instagram filtresi eklemenizi sağlıyor. Hem de sadece CSS ile!

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku

10 Ücretsiz Material Design HTML Template

google-material-design2014 yılında duyurulan Material Design‘ın günden güne genişleyen kullanım kitlesi ile popülerliği günden güne daha da büyüyor. Android telefonlarımızdan gezdiğimiz web sitelerine kadar her yerde karşımıza çıkan bu tasarım trendini siz de web sitenizde kullanmak ister misiniz?

Merak etmeyin bu iş artık eskisi kadar zor değil. Aşina olduğumuz onlarca web tasarım kütüphanesi artık Material Design skinleriyle birlikte geliyor.

Sizler için en iyi ve ücretsiz 10 Material Design kütüphanesini seçtik.
(daha&helliip;)

Devamını Oku

Photoshop’a Alternatif 10 Resim Editörü

Geçtiğimiz aylarda birçok ünlü tasarımcı sosyal ağlarında Adobe lisanslarını iptal ettiğini duyurmuştu. Bunun temel sebebi programların hantallaşması ve lisans bedellerinin çok yüksek olmasıydı. Bu tip durumlarda akıllara ilk olarak “Photoshop’un bir alternatifi var mı?” sorusu geliyor.

Bugün sizlere Photoshop‘a alternatif olabilecek 10 resim düzenleme programını tanıtacağız. (daha&helliip;)

Devamını Oku

AdSense’in Yeni Reklam Birimi : Eşleştirilen İçerik (Matched Content)

adsense logoBirçok web sayfasında gördüğümüz ve artık aşina olduğumuz ‘ilgili içerik’ alanlarına artık Google AdSense de el attı.

Eşleştirilen İçerik (Matched Content), görüntülemekte olduğunuz web sayfasının içeriğine benzer içerikleri konu alan siteleri liste halinde gösteren bir reklam tipi olarak özetlenebilir. Böylece site-içi trafiği, yani reklam gösterim sayısını, dolayısıyla da reklam gelirlerini arttıracağı iddia ediliyor.

Tabii bu yeni özellik ile akıllara 2 soru geliyor.

  1. Eşleştirilen İçerik özelliği para kazandırıyor mu?
  2. Eşleştirilen İçerik özelliğinin gerçekten fayda sağlıyor mu?

(daha&helliip;)

Devamını Oku

Ders 3 : Bootstrap İkon Kullanımı

Bootstrap konulu makalelerimiz tasarımın önemli unsurlarından olan ikonlar ile devam ediyor.

Glyphicons (Halflings), ücretli bir ikon servisi. 260’ın üzerindeki vektör görseli font formatında bize sunan bu yapı Bootstrap ile ücretsiz olarak kullanılabiliyor.

Bugün sizlerle bu ikon setini nasıl ve nerelerde kullanabileceğimizi konuşacağız. (daha&helliip;)

Devamını Oku

Preloader.js ile Sayfalarınıza ‘Yükleniyor’ Barı

css-spinnerAdobewordpress gururla sunar : Preloader.js

Birçok takipçimizin YouTube’da kullanılan yükleniyor barının nasıl yapıldığını sorması üzerine sizlere özel bir plugin geliştirme gereği duyduk. Preloader ismini verdiğimiz bu jQuery eklentisi sayfanızın yüklenmesini hesaplayıp bu süre dahilinde dolan bir bar ve dönen bir spinner oluşturuyor.

Ayrıca isteğe bağlı olarak kırmızı, mavi, yeşil ve sarı gibi ana renklere bürünmekle kalmıyor, tercih edilirse yüklenme sırasında sitenizin üstünü siyah ve beyaz renkteki perdesiyle de örtüyor.

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku