Izgaradan Kurtulmak: Alternatif Yerleşim Stratejileri ve İpuçları
Her proje için aynı eski ızgara tabanlı düzenleri kullanarak web siteleri oluşturmaktan yoruldunuz mu? Normdan kurtulmak ve biraz daha organik bir şey denemek için kaşınıyor musunuz?
Bugün, alternatif düzen yöntemleri hakkında neler öğrenebileceğimizi ve bunların nasıl başarılı bir şekilde uygulanabileceğini görmek için bunu yapan birkaç siteye bakacağız.
Envato Elements'i keşfedin
Izgara Düzenleri
Izgara tabanlı düzen, modern web tasarımının temel taşıdır. Temiz, minimalist tasarımların nihai ideal (80'lerin ve 90'ların dağınık tasarım stillerine doğrudan tepki) olarak tutulduğu bir zamanda, “iyi tasarım” ın tanımı şüphesiz basit ve sağlam hizalamalardan bahsedecektir.
Sonuçta bu iyi bir şey. Grid tabanlı mizanpajlar eşsiz yapı, denge ve organizasyon sağlar. Tasarıma öngörülebilir bir ritim ve aşinalık duygusu getiriyor ve içeriğin kendi isteğiyle öne çıkmasına izin veriyorlar.
Izgara düzenleri inanılmaz derecede kullanıcı dostudur. Bir sayfayı soldan sağa, yukarıdan aşağıya doğru içgüdüsel olarak okuyoruz ve ızgaralar bu eğilime meydan okumak yerine pekiştirme eğilimindedir. Izgara tabanlı bir tasarımla içerik, tam olarak izleyicinin olmasını beklediği yerdedir, olağanüstü bir çaba gerektirmez.
Izgara tabanlı tasarımlara adanmış, yukarıda gösterilen gibi tüm tasarım galerilerine sahibiz. Minimum çabayla hızlı ızgara düzenleri elde etmemize yardımcı olmak için sayısız CSS çerçevesi ve Photoshop şablonu vardır. Tasarım bir dinse, ızgaralar gerçeği atfettiğimiz kutsal yazıdır.
Bu geniş kapsamlı metaforla daha da ileri gidersek, bugünün konusu “küfür” den başka bir şey değildir. En azından kısmen daha organik düzenler ve grafikler lehine ızgarayı terk ederek düzenlerimize nasıl biraz daha çeşitlilik getirebileceğimizi keşfedelim. Aslında bilgiyi yapılandırmanın birden fazla yolu olduğu ortaya çıkıyor, sadece tasarım tanrılarına söylemeyin.
Doğrudan Dikkat Çekmenin Başka Yollarını Bulun
Alternatif bir düzen için ilk örneğimiz, bir dijital tasarım ajansı olan Are Are Empire'dan geliyor. İşte web sitelerinin ana sayfasının ekran görüntüsü.
Gördüğünüz gibi, kesinlikle tipik web sayfası düzeninizi temsil etmez. Burada dikkat edilmesi gereken birkaç nokta var. İlk olarak, sayfadaki birincil nesneler dairelerdir. Herhangi bir normal, ızgara tabanlı web sitesi genellikle öncelikle dikdörtgen nesnelerden oluşur. Izgaralar dikdörtgenlerden oluşur, böylece dört kenarı ve en azından minimum sert köşeleri olan nesneler oldukça iyi çalışır.
Buna karşılık, karşılaşacağınız organik yerleşimlerin neredeyse tamamı daireleri yoğun olarak kullanmaktadır. Çevreler daha organik hissediyor ve bu düzen stiline daha iyi uyuyor gibi görünüyor. Ayrıca, isyancı tasarımcılara normdan sapmak için başka bir yol sunuyorlar.
Nesnelerin şekillerinden daha da önemlisi, bağlantı şekilleri. Bir kez daha, ızgara düzenleri çok doğal bir şekilde okunabilir, ancak organik düzenler, neye bakacağını araştırmak için gözü karıştırabilir.
İlkel bir yol oluşturarak, buradaki tasarımcı takip etmeniz için net bir bilgi akışı yarattı. Bu sayfaya baktığınızda, neredeyse gözlerinizle takip etmekten başka bir şey yapamazsınız; kullanıcı deneyimini kontrol etmek için basit ve son derece etkili bir numara.
Daha Az Nesne
Yol yardımcı olur, ancak tam bir gereklilik değildir. Bu özellikle mizanpajda birkaç nesne olduğunda doğrudur. Örneğin, benzer bir düzen kullanan Michael Wong'un aşağıdaki sayfasına göz atın.
Wong'un sitesi, bu tür düzenler için başka bir popüler teknik kullanıyor: fare kontrollü animasyon. Farenizi ekranda hareket ettirdikçe, mizanpajdaki nesneler 3B arayüzü simüle eden bir paralaks efektinde hareket eder.
Yapı Hala Mevcut
Izgara tabanlı düzenlerden uzaklaşırken hatırlamanız gereken çok önemli bir şey, yapıyı tamamen terk etmek zorunda kalmamanızdır. Aşağıdaki Melonfree düzeninin gösterdiği gibi, tasarımınız hala oldukça mantıklı olabilir.
Burada, basit bir ızgara lehine yuvarlak simetrinin yoğun kullanımını buluyoruz. Tasarım oldukça çekici ve dengeli. Bir daire içinde okumak kesinlikle dünyadaki en kolay şey değildir, ancak sonuç ferahlatıcı olarak farklıdır.
Odak noktaları
Alternatif bir mizanpajla çalışırken, daima odak noktaları oluşturduğunuz konumun farkında olun. Yukarıdaki düzen kasıtlı olarak, şirketin adını temsil eden büyük bir kavun grafiği bulacağınız merkeze doğru ağır bir çekişe sahiptir.
Düzenlerinizde, belirli odak noktaları oluşturmak için nesnelerin boyutunu, rengini ve yerleşimini kullanın ve oluşturmaya çalıştığınız görsel yolla (yukarıdan) ne kadar iyi çalıştıklarını analiz edin.
Bir Sahne Oluşturun
Çok farklı ama yine de oldukça popüler bir alternatif düzen yöntemi, siteniz için arayüz görevi gören bir sahne oluşturmaktır. Genellikle tek bir şey bulamayacağınız kötü, Flash tabanlı fast-food tipi bir sitenin yönünde ilerlediği için buna karşı oldukça uyarıyorum.
Bununla birlikte, bu yöntem bazı çekici, iyi tasarlanmış sitelere de yol açabilir ve yol açabilir. Aşağıdaki iCodeLabs sitesini düşünün, gezilebilecek gerçekten harika bir resimli sahne kullanıyor, tahmin ettiniz, fareyi hareket ettirdiniz.
Buradaki önemli özelliklerden biri, iCode sitesinin keşif sahnesini sitenin isteğe bağlı bir eğlence öğesi olarak ayırmasıdır. Birincil gezinme, sayfanın alt kısmında daha tanıdık bir çubuk arabirimidir. Burada bağlantılar için av yok!
Izgaralar: Gizli Ama Nadiren Gitti
Izgara tabanlı mizanpajlardan vazgeçme hakkındaki tüm bu tartışmanın en büyük sırrı, belirli bir web tasarımından nadiren tamamen yok olmalarıdır. Aslında, yukarıda gösterilen siteleri ziyaret ederseniz, sayfaların çoğunda hala genel bir ızgara yapısı olduğunu görebilirsiniz. Daha büyük yapı içindeki alanlarda alternatif yerleşim yöntemleri mevcuttur.
Buradaki ders, benzersiz görünen ve hissedilen bir şey elde etmek için net, basit ve mantıklı düzenlerin güvenliğini tamamen terk etmek zorunda kalmamanız ve çoğu zaman istemediğinizdir.
Eğik Izgaralar
Izgara tabanlı düzeninizi gizlemenin akıllıca bir yolu, dikey ve / veya yatay çizgiler yerine çapraz çizgileri güçlü bir şekilde kullanmaktır. Normal ızgaralarda kullanılan aynı kurallar uygulanabilir, sonuç sadece daha keskin görünür.
Gördüğünüz gibi, Estilo DLT organik bir yerleşim görünümündedir, ancak gerçekte bazı çok sıkı yerleşim ilkelerine uygundur.
Sonuç
Normdan kopmak oldukça ferahlatıcı bir deney olabilir. Farklı düşünmenize ve tasarımı daha önce hiç görmediğiniz şekilde görmenize yardımcı olur. Alternatif düzen fikirlerini keşfetmek, bu arenada ayaklarınızı ıslatmanın en iyi yoludur. Doğru yönlendirmeye başlamak için yukarıdaki örnekleri ve bilgileri kullanın.
Izgara düzenlerinin genellikle kırıldığını ancak nadiren tamamen terk edildiğini ve bir ızgara kullanmasanız bile, düzeniniz için hala çok mantıklı bir yapı olabileceğini unutmayın. Karşılaştığınız geleneksel olmayan düzenlerin bağlantısını içeren bir yorum bırakın. Ayrıca, ızgaralar için bir yapışkan olup olmadığınızı veya mizanpajlarınızla kutunun dışına çıkmaya eğilimli olup olmadığınızı bize bildirin.
