Bootstrap‘in mobil destekli menü sistemi Navbar varsayılan haliyle (3.0 versiyonu itibariyle) sadece tek bir alt menüyü desteklemekte. Bir dizinden fazla dallanan bir menünüz varsa Bootstrap’in Navbar yapısı sizin ihtiyacınızı karşılamayacaktır.
Bugün sizlere Bootstrap’in Navbar menü yapısına çoklu alt menü desteğinin nasıl ekleneceğini anlatacağız.
(daha&helliip;)
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;)
Özellikle haber sitelerinin vazgeçilmez öğesi olan akan anons pencereleri sizlere hem dinamik hem de kullanşlı bir sunum imkanı sağlıyor. Bu yapıları sizler de web sitenize kolayca eklemeniz için Adobewordpress ailesi olarak awNotices’i hazırladık.
(daha&helliip;)
Bootstrap üzerine konuşmaya devam ediyoruz. Bugün Bootstrap Slider‘ı (bilinen adıyla Carousel) Ambilight tasarımıyla özgün ve şık hale getireceğiz. Oluşturacağımız yenilikçi tasarım, Bootstrap varolan işlevsel sliderını bir adım daha öteye taşıyacak.
(daha&helliip;)
Google‘ın Android Lollipop ile hayatımıza giren tasarım trendi üzerine konuşmaya devam ediyoruz. Bugün Material Design animasyon örneklerinden birkaç tanesine göz atacağız. Daha önce de “Instagram, Material Design ile Tasarlansaydı?” konusunda benzer bir animasyon izlemiştik.
İşte karşınızda birbirinden etkileyici Material Design örnekleri… (daha&helliip;)
HTML5‘in getirdiği kolaylıkları konuşmaya devam ediyoruz. Bugünün konusu da Push Notification diye tanımlanan, tarayıcı merkezli bildirimler olacak.
Popüler web görüntüleyicilerin de desteğini yavaş yavaş almaya başlayan HTML5 bildirimleri artık bizim de gündemimizde.
(daha&helliip;)
Google‘ın tasarım devrimi üzerine konuşmaya devam ediyoruz. Material Design’ın günden güne web tarafına uyarlanan örnekleri bizim makalelerimizde de yerini buluyor. Daha önce buradaki makalemizde şık bir Material Design menü örneği hazırlamıştık.
Şimdi de ekranın büyük bir kısmını kaplayan, daha büyük yapıdaki bir başka menü tasarımı konu edeceğiz. HTML5, CSS3 ve jQuery desteğiyle hazırlayacağımız bu tasarım soğuk renklerden oluşuyor.
Bu makalemizde üzerine tıklandığında büyük ölçülerde açılan ve içeriği aksi yöne ittiren şık bir menü tasarımı hazırlayacağız. İkinci Material Design menü örneğiyle sizlerleyiz!
(daha&helliip;)
Bildiğiniz gibi web sitelerinde farenin sağ tuşuna bastığımızda contextmenu denilen bir menü açılıyor. jQuery ile de bu menüyü kapatıp yerine başka bir tanımlama yapabiliyoruz. CSS3 desteğiyle hazırlayacağımız modern bir tasarımı bu menüye giydirebiliriz.
Örneği görüntüleyerek başlayabilirsiniz.
Bu makalemizde şık bir menü tasarımı hazırlayıp, yapıyı sağ tuş ile tetiklenebilir hale getireceğiz.
(daha&helliip;)
Google’ın yeni nesil kullanıcı dostu tasarım prensipleri ile Twitter’ın CSS kütüphanesini bir arada kullanmaya ne dersiniz?
Material Design‘ı mobil ortamda yeni yeni görmeye başlamışken web tarafında işler daha hızlı ilerliyor. Web geliştiricileri günden güne yeni Material Design elemanları paylaşırken şimdi de Bootstrap tarafında hareketlenmeler yaşanmaya başladı. FezVrasta, GitHub sayfasında paylaştığı bu web önyüzüyle son günlerde fazlasıyla popüler. (daha&helliip;)
Google‘ın ses getiren tasarım trendi Material Design üzerine konuşmaya devam ediyoruz. Bugün Bennett Feely tarafından CSS ile hazırlanan menü örneğini sizlerle paylaşacağız.
Bennett’in örneği Material Design’ın estetik ve animatif tarafını başarılı bir şekilde yansıtmakta.
Web öğelerinin sadece spesifik kısımlarını CSS ile göstermemizi sağlayan clip-path tanımı da bu tasarımda faydalı bir şekilde kullanılmakta.
Eğer hazırsanız başlayalım.
(daha&helliip;)
CSS ile Mobil Menü
Photoshop ile Gün Doğumu
Fake Hayalet Fotoğrafları Nasıl Hazırlanıyor?
Photoshop ile Instagram Early Bird Filtresi