title

CSS ile SEO ve performans dostu harika resim açıklamaları

Vatanay Özbeyli 3 Yorum CSS3, HTML5, SEO

Merhaba arkadaşlar. Bu makalemizde görsel açıdan olduğu gibi performans ve SEO açısından da inanılmaz başarılı olan bir resim efektini anlatacağız.

Okumakta olduğunuz makalenin türevleri olabilir, fakat tarafımızdan hazırlanan bu CSS kodu yerli ve yabancı kaynaklarda bulabileceğinizin en iyilerinden biri. Neden mi?

  1. Sadece tek division kullanıyor.
  2. Köprü bağlantılar a block veya onclick ile değil, klasik href türünde. Böylece ziyaretçinin browserinin java desteği kapalı olsa bile tam performans ile çalışmakta.
  3. Yukarıda dediğim gibi, kod satırlarının içersinde JS yok. Bu yüzden hızlı ve her kullanıcı tarafından görülebilir.
  4. CSS3 ‘ün yeni teknikleriyle süslü.
  5. Yazılar paragraf içinde, yani tam anlamıyla açıklama metinleri oldular. Böylece arama motorlarının botları görsel arandığında <p> içindeki geniş açıklama metnini yayınlar. Kısaca SEO dostu diyebiliriz.
  6. Yazılar seçilerek kopyalanamaz.

ÖRNEĞİ GÖRÜNTÜLE

(daha&helliip;)

Devamını Oku


the_post_thumbnail ile Öne Çıkarılmış Görselleri Çekelim

Vatanay Özbeyli 5 Yorum Eklentiler, Temalar, WordPress

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;)

Devamını Oku

CSS ve jQuery Yardımıyla Resimlere Caption

Vatanay Özbeyli Yorum yazın CSS3, jQuery, Tasarım Unsurları

Merhaba arkadaşlar. Bu yazımda CSS ve jQuery yardımıyla görsellerimiz için açıklama metinleri oluşturacağız. Bu işlemi yaparken jquery-1.8.3.min.js dosyasına ihtiyaç duyacağız.

Dosyayı buradan indirebilirsiniz veya direkt olarak aşağıda gösterdiğim gibi çağırabilirsiniz.

Bu işlem içerisinde JS kodları barındırsa da performans olarak problem yaratabilecek nitelikte değil. Yani hiç düşünmeden kullanabilirsiniz.

JavaScript‘in replace koduyla çalışmakta. Sayfa içerisindeki altyazı classına sahip tüm görsellerin title değerini örnekte gördüğünüz gibi göstermekte. (daha&helliip;)

Devamını Oku

Google Web Fonts ve Kullanımı

Egemen Özbeyli 3 Yorum CSS3

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;)

Devamını Oku