Etiket: css

Açılır Menü (Drop-down Menü) Nedir?

Açılır menü (Drop-down menü), internet sitelerinde üzerine gelindiğinde ya da mouse ile üzerine tıklandığında açılan menülerdir. Fazla sayıda sayfa ya da alt kategoriler var ise açılır menü ile internet sitesinde fazla yer kaplamadan sergilenmeleri sağlanmış olur. Açılır menü (Drop-down menü), sitenizi ziyaret eden kullanıcılara da büyük kolaylık sağlamaktadır. Açılır menüler sitelerde büyük boyutlu yer kaplamadıkları için daha düzenli ve basit bir yapı sunulmuş olur.

Açılır menüyü kullanmanın amaçlarından biri, bir kategorilerinin önemli bağlantılardan oluşan grubunu göstermektir. Kategorilere giren kullanıcılara yardımcı olmak adına, tüm bağlantıların organize bir şekilde olması, doğru başlıklar kullanılması önemlidir.

Açılır Menü’de Bir Ögeye Tıklanırsa Ne Olur?

Açılır menü’de herhangi bir öğeye tıklandığında, tıklanılan sayfaya yönlendirilirsiniz. Örneğin Erkek ana kategori olsun. Polo ve Tshirt de açılır menüler olsun. Bu oluşturulmuş olan menülerden birine tıklandığında o sayfa içeriğine ulaşırsınız. Ulaşacağınız sayfa bir satış sayfası da olabilir, içerik sayfası da olabilir.

Açılır menüler yatay olabileceği gibi dikey de olabilmektedir. Dikey açılan menülerde çok fazla alt menü eklemek görüntü olarak hoş durmayabilir. Bu durumlarda yatay açılan menüler tercih edilmelidir.

acilir-menu

Basit CSS Açılır (Dropdown) Menü Yapımı

İlk adım olarak;

  1. HTML dosyası oluşturulur.
  2. HTML menü kodu eklenir.
  3. CSS uygulanır ve açılır menü efekti oluşturulur. CSS ile stillendirmeler yapılır.Renkler ve boyutlar değiştirerek CSS kodlarında değişiklikler yapabilirsiniz.

 

Slider Nedir?

Slider, web sitelerine eklenen görsellerin çeşitli efektler ile geçiş yapmasıdır yani kayan resim anlamına gelmektedir. Web sitelerinde kayan resimler genellikle, kampanyaları, yeni gelen ürünü ya da reklamı ön plana çıkarmak için kullanılır. Kayan resimlerden herhangi birine tıklandığında o resim ile ilgili bölüme giriş yapılabilmektedir.

Web sitelerinde müşterilerin ilgilerini çekebilmek için dikkat çekici iyi tasarlanmış görseller kullanılmaktadır. Kayan görsel alanındaki görseller yapılarına göre otomatik olarak geçiş yapabileceği gibi kullanıcının da geçiş sağlayabileceği şekilde olabilmektedir. İnternet dünyasında milyonlarca tasarlanmış slider bulunmaktadır ancak en çok beğenilen kayan görsel tipleri genellikle en hızlı yüklenenler ve tasarım ile bütünleşenlerdir.

Kullanılan web sitelerinin resim için kısıtlı yerleri var ise bu görseller pratik bir uygulama olmaktadır. Örnek olarak Kobisi e-ticaret paketlerinde anasayfada görsel alanları bulunur ve öne çıkarmak istediğiniz görseli bu alanda kullanabilirsiniz. Müşterileriniz sitenizi ziyaret ettiğinde slider görselinize tıklayarak kolaylıkla ürün sayfasına ya da sizin istediğiniz herhangi bir sayfaya yönlenebilir.

slider

Slider Nasıl Yapılır?

Sliderın mobil uyumlu olması ön planda tutulmalıdır. Mobil sitenizde kayan resim olarak kullanılan görselin düzgün, işlevsel, göz yormayan ve kolay kullanımlı olması gerekir.

Kayan görsellerin yapısında genellikle HTML5, CSS, JS, jQuery ve PHP gibi yazılımlardan faydalanılır ancak bazı slider modelleri framework olarak yayınlanır. Bu framework kütüphaneleri indiren geliştiriciler kendilerine göre düzenleme yaparak yapılandırabilir. Sonucunda da istedikleri gibi bir kayan görsel ortaya çıkartabilirler.  Eğer CMS türlerinden biri kullanılmıyorsa, kayan resim oluşturmak için programlama dili bilinmelidir.