Daha İyi Bir Sayfa Web Siteleri Oluşturmak İçin 6 İpucu
Tek sayfalık web siteleri sıcak ve popüler - bu konuda şüphesiz. Ama herkes ya da her iş için değiller. Birini bulmak çok kolay çünkü popülerler; ve eğer doğru bir şekilde yapılırsa, seninki bir vuruş olabilir. Ancak, ilk önce projenizin uygun olduğundan emin olun.
Tek sayfalık bir web sitesi için iyi bir aday içerikte aşırı ağır değildir. Noktanızın karşılığını almak için sadece bir sayfanız var, ve onlar bayatmadan önce atabileceğiniz çok fazla animasyon ve püf noktası var.
Ayrıca, çoğu tek sayfalık web sitesi düzeninde sıra dışıdır. Bir sayfaya dağınık görünmeden çok fazla içerik sığdırmaya çalışmak oldukça zor.
Potansiyel kullanımlar farklılık gösterir, ancak bir sayfalık web siteleri için en popüler adaylardan bazıları, yalnızca birkaç ürün veya hizmet satan işletmeler için kişisel portföyler ve web siteleridir.
Hak kazanırsanız, web sitenizin işarete ulaştığından emin olun. Herhangi bir web sitesi hazırlarken mutlaka takip etmeniz gereken bazı şeyler vardır, ancak aşağıdaki noktalar tek sayfalık web siteleri için özellikle önemlidir.
1. Odaklanın
Her şeyi izleyicilere mümkün olduğunca basit hale getirin. Tek sayfalık bir web sitesi düşünüyorsanız, muhtemelen bir ton içeriğiniz yoktur. Bu iyi. Web sitelerimize çok fazla tüy atmak için cazip geliyoruz. Tek sayfalık web siteleri herhangi bir kabartı gerektirmez çünkü tek amacı noktaya ulaşmaktır. Bir portföyü bir araya getiren bir tasarımcıysanız, en iyi çalışmanızı sunun; vasat projeler veya yan t-shirt işi tarafından rahatsız edilmez.
Web sitenizi herhangi bir tüylerden sıyırın ve önemli olan şeylere inin. Bu, herhangi bir web sitesi için iyi bir strateji olsa da, çok sayfalı web sitelerinin çoğu bir miktar kabartı ile uzaklaşabilir, çünkü kullanıcılar genellikle istedikleri bilgiyi nerede bulabileceklerini bilirler. Bir çağrı cihazı ile, tek bir atış alırsınız ve birisinin aradığı bilgi orada değilse, onları kaybedersiniz.
Bu e-ticaret sitesinin sattığı hakkında bir soru yok.
Bu portföy noktaya doğru geliyor. Oldukça harika bir minimalist tasarım.
2. Düzeni bir hiyerarşi ver
Ziyaretçinin odağını korumakla birlikte, tek sayfalık bir web sitesinin ürün veya hizmetinizi sergilemesi gerekiyor. Karşılaştığınız bir sayfalık web sitelerini düşünürseniz, bir ajansın tasarım çalışmalarını sergilemek veya yaklaşan bir etkinliğe ilgi göstermek için tek bir amaca sahip olabilirler.
Harika bir tasarım ve odaklanmış düzen, web sitenizin amacını tanımlamanıza yardımcı olabilir. Siz tasarımcı olarak, ziyaretçilerin gözlerini istedikleri yere yönlendirme gücüne sahipsiniz. İnsanlar doğal olarak büyük şeyleri fark eder ve küçük şeyler son bulur, bu yüzden bunu kendi yararınıza kullanın. Önemli şeyler sayfada en küçük veya son şey olmamalıdır.
Bu büyük yazı tipi giriş paragrafları tasarımcı portföyleri üzerinde çok popüler hale geldi, çünkü bir tasarımcı arıyorlardı. Muhtemelen görmek isteyeceğiniz son şey, hangi okuldan mezun olduklarıdır. Ama ne uzmanlaştıklarını ve ne tür bir iş yaptığını bilmek istersiniz.
Yine, mesajınızı iletmek için değerli birkaç fırsatınız var, bu yüzden doğru yapın. Bunu yapabilmek için çok fazla içeriğinizin olduğunu fark ederseniz, çok sayfalı bir web sitesiyle devam etmeyi düşünün.
Bu web sitesi birkaç farklı noktaya getirse de, bu ekran görüntüsünde bile, neyin en önemli olduğunu hemen hemen söyleyebiliriz.
Bu şirketin ne yaptığını söyleyebiliriz, ancak görsel hiyerarşi daha iyi olabilirdi.
3. Gezinmeyi temizle
Bazı tek sayfalık web siteleri, gezgini ziyaretçiyi harici web sitelerine götüren statik sayfalardır. Örneğin, bir müzisyenin kendi web sitesinde sizi YouTube hesabına götüren "Videolar" etiketli bir gezinme seçeneği olabilir. Bu konuda kesinlikle hiçbir şey yanlış değildir ve hatta işleri kolaylaştırır (özellikle kodlayıcı olmayanlar için). Tek şey, ziyaretçilerin harici bir sayfaya yönlendirildiklerinde bilmeleri gerektiğidir.
Tek sayfalık web siteniz bir ürünü sergilemekse ve satın alma bağlantınız müşterilerinize bunları söylemeden harici bir ödeme platformuna gönderirse, bazı satışları kaybedebilirsiniz.
Amacınız her şeyi basit tutmaktır. Kullanıcıları uyarı vermeden harici web sitelerine yönlendirmek kafa karıştırıcı olabilir. Bağlantının bozuk veya hatalı olduğunu varsayabilirler. Ziyaretçilere nereye yöneldiğini bildirmek için simgeleri (bol miktarda ücretsiz olanlar) veya başlıkları kullanmayı düşünün.
Yapmaman gereken şey burada. En üstteki bağlantılar sizi hiçbir uyarı olmadan sitenin dışına götürür. Bu beni gerçekten attı.
Bu web sitesinin tasarımı ve kodlaması çok sıra dışı. Bununla birlikte, dış sayfalara olan bağlantılar yeşil daireler tarafından ayırt edilir ve bu şekilde etiketlenir.
4. Çılgın tasarım yap
Şimdi eğlenceli kısma geçiyoruz: göstermek için tek sayfalık bir web sitesi kullanıyoruz. Web sitesinin sıkıcı veya tekrarlayıcı olmasını istemiyorsunuz, bu yüzden delirmeye devam edin. Tasarımı bir sonraki seviyeye taşıyın ve kutunun dışında düşünün. Bir alışılmadık tasarım, ürününüze dikkat çekmek ve unutulmaz kılmak için iyidir.
Tek çağrı cihazları büyük tasarımla eşanlamlı hale geliyor çünkü daha büyük tuvallerle daha fazlasını yapabilirsiniz. Her yerde aynı arka planı kullanmaya mecbur değilsiniz; bölümler arasında değiştirirsiniz. Tek sayfalık web sitelerinde gezinmek, genellikle bir dergi veya iyi hazırlanmış bir slayt sunumu oluşturmak gibidir. Olasılıkları sömürün.
Tam tarayıcı penceresine yayılan veya harika bir resimli arka plan oluşturan büyük resimler kullanarak tasarımı mükemmelleştirin. Bonus puanları alacaksınız ve Web tasarım vitrinlerinde yer almaya başlayabilirsiniz.
Bu tasarım nefes kesici, poster gibi bir şey. Ve web sitesinin geri kalanı hayal kırıklığına uğratmaz.
Bu tasarımın temizliği (ve kodu) şaşırtıcı. Bu seni durduracak ve bakacak.
5. kodlama çılgın
Tasarımda olduğu gibi, kodlama becerilerinizi de göstermek istersiniz. Tek sayfalık web sitelerinin etkileşime girmesi gerekiyor. Kullanıcı deneyimi kritik, bu yüzden ayrıntılara dikkat edin. Kod web sitenizi bir sonraki seviyeye taşıyabilir.
Dikkat edilmesi gereken bazı noktalar, bağlantıların renkleri ve davranışlarıdır (özellikle vurgulu seçici); formların görünümü ve davranışları (örneğin, formun tasarıma uymasını sağlamak ve AJAX ve JavaScript doğrulayıcılarını kullanmak); gönderme ve hata mesajları (formlar ve bazı AJAX ile birlikte kullanılır); ve içeriğin ızgarası ve yerleşimi (içeriğin tarayıcı penceresindeki davranışının yanı sıra). Bunların hepsi tasarımla uyumlu olmalı.
Tek sayfalık bir web sitesinde çalışmak için kod koymak için basit ve basit bir yol.
Önyargılı olabilirim çünkü içeriğin kaydırmada yüklendiği hileyi beğenirim, ancak burada koddaki ayrıntılara dikkat her yerde inanılmazdır.
6. Hareket ettirin
Kodlama ayrıntılarına dikkat etmenin yanı sıra, sayfada biraz hareket ve heyecan yaratmak için kod kullanabilirsiniz. Yine sıkıcı olmaktan kaçının. Sayfanıza hayat ve hareket duygusu verin; Ziyaretçilerle birlikte hareket ediyor gibi görünmesini sağlayın. Sayfanın öne çıkmasını sağlamak için eğlenceli animasyonlar veya geçişler ekleyin.
JQuery ve AJAX gibi diller, bir web sitesinde hareket oluşturma standardı haline gelmiştir. İçeriğin farklı taraflardan görünmesini sağlayın veya arka planı bir slayt gösterisi haline getirin, kitleyi meşgul edin.
Bu arka plan bir animasyon. Web sitesinin neyle ilgili olduğu hakkında hiçbir fikrim yok, ama düzgün görünüyor.
Bu web sitesindeki geçişler mükemmel. Bunu sevdim!
Tek sayfalık bir web sitesini özel yapmak için başka ne gerekiyor?