Hamburger Menü Yerine
[ Okuma süresi tahmini 2 dakikadır ]
Mobil menü için kullanılan Hamburger Menü ve ikonu aslında eğlenceliydi. Hatta bu sitede Javascript Kullanmadan Sadece CSS ile Responsive Menü ile kullanmaktaydık. Ancak artık kullanmıyoruz.
Niye Hamburger Menü ikonu kullanmıyoruz artık?
- Görüldüğü gibi üst bölümde kullandığımız menü çok elementli değil.
- Daha az ve sade CSS kodlarıyla da menünün mümkün olabildiğini göstermek için.
- Deneysel CSS için, “Flex” kullanımı gibi.
- Hamburger menü ikonu problemleri olabiliyor. Örnek; Mobil menü ikonunu nereye koymalı
Konu ile ilgili olarak kısa ve öz Kenan Yusuf’un A couple of alternatives to the hamburger menu yazısını okuyabilirsiniz.
Hamburger Menü ve ikonu yerine kaydırmalı menü
Sitenin üst kısmında bulunan menü yine responsive ve sadece CSS ile yapıldı yine. Flex elementleri kullanıldı. Ve mobil, telefon ekranlarında en küçüldüğünde scroll (kaydırma) ile çalışıyor. Yani menü bölümünde ki elementleri sağa sola kaydırabiliyorsunuz.
Masa üstünde ekranı tarayıcıyı daraltınca güzel görünmüyor ancak mobil ekranlarda pek rahatsız edici değil.
Ayrıca sitenin header bölümünü yeniden düzenleyip daha iyi hale getirmeye çalıştık. Arama kısmı en üst bölümde yer alıyor artık ve tamamen responsive. Bunun için Mehmet Mert’in Flat Search Box kodlarını kullandım. Kendisine de teşekkür ederiz.
Yeni menüyü beğendiniz mi?