Tek sayfalık web sitesi tasarımı modası nasıldı?

Tüm içeriklerini tek bir sayfaya koyan bir web sitesi akışı gördüm, ala bu site . Smashing Magazine'de gördüğüm bazı listelerdeki siteler bile bunu yapıyor (bunun gibi , çoğunluğu kullanan yüz site gibi görünen).

Bir programcı olarak, bu stil beni rahatsız ediyor (çoğunlukla teknik değil, bakım, SEO, yükleme süreleri, vb. Dahil olmak üzere), tasarımcılar?

İki ayrı eğilim söz konusudur.

Birincisi basit bir siteye sahip olma eğilimidir. Bir broşür sitesi ise, muhtemelen dört ayrı sayfaya ihtiyaç duymaz. Bir kaydırma sayfasının kullanımı, gezinmesi ve bakımı daha kolaydır. Birçok iPhone uygulama sitesi bu modeli kullanıyor. Birçok küçük işletme gibi. Bundan çok sayıda site yararlanabilir.

Diğer trend, Flash geliştiricileri nihayet HTML, jQuery ve AJAX'ı keşfediyor ve hala 'bir dosya = bir site' nin eski Flash modeli içinde düşünüyor. Bu, ilk trendden farklıdır, çünkü bu, bir sayfa veri / etkileşime sıkıştırılmış çok sayıda içeriğe sahip büyük bir sitedir. Belirttiğiniz gibi, bu yöntemin her türlü dezavantajı vardır, ancak doğru kodla aşılabilirler (URL'lerin değiştiğinden / yer işareti alındığından emin olun, Google içerikte gezinebilir, yükleme süreleri AJAX aracılığıyla yönetilir, vb.).

Bence tek sayfalık bir sitenin arkasındaki en iyi fikirlerden biri, bunun bir anlatım yönü daha var. Aklıma gelen en iyi örnek bu sayfayı Bir nişan / düğün davetiyesi sitesi:. Bu inanılmaz bir site ve birçok nedenden dolayı çalışıyor, biri her şeyin birlikte güzelce aktığı. Aynı etki bir dizi sayfaya yayılamaz.

Başlangıçta IE9'u göstermek için yapılan bu demo tamamen hikaye anlatımı ile ilgili . Neredeyse bir resimli kitap gibi, ama sayfaları çevirmek yerine kaydırma ile. Ve bu yüzden gerçekten kesintisiz ve havalı. Bir iş sitesi yapmak için gerçekten pratik değil, ancak tek sayfalık ortamın yararlı olmasının bir nedenini vurguluyor.

Ayrıca çok fazla içeriğe sahip olmayan daha küçük sayfalarla da çalışır . Evlendiğimde tüm bilgilerimizi tek sayfalık bir sitede tuttum çünkü sayfadan sayfaya gitmeyi garanti edecek yeterli içerik yoktu. Tek sayfalık bir site oluşturmak ve sürdürmek daha kolaydı ve yükleme süresi gerçekten endişe verici değildi.

İş söz konusu olduğunda, bunun daha zor bir dava olduğunu düşünüyorum. Unutulmaz bir örneğin, Google'ın Nexus telefonunu başlattığında olduğunu düşündüm - bunu tek sayfalık bir sitede yaptılar. Tabletlerini başlattıklarından ve Q'larını açıkladıkları için artık böyle değil, bu yüzden bağlantı kuramıyorum, ancak her şeyi tek bir yerde görmek gerçekten temizdi. Sen tıklama azaltmak ve oluşturmak daha sürükleyici bir deneyim .

Bence sadece kodlayan kaslarını esnetmek ya da bir trendden yararlanmak için bunu yapan birçok insan örneği göreceksiniz. Ancak bu tasarım dünyasında her zaman olur. Sitenizin amacını düşündüğünüzde masanın üzerinde tutun ve uygun olduğunda kullanın!

Kullandığınız aramak istiyorsanız o ki bu (sadece birinin Aklıma!), Bir tarafı da var Ctrl+ Fseferde bütün web sitesinde arama böylece tüm içerik tek bir sayfada ise (içeriği varsayarak aranabilir) .

Kısmen "Kullanıcıya daha fazla içerik sorma - sadece onlara ver" kavramından kaynaklandığını düşünüyorum. Google, Twitter vb.

Aza Raskin'in 2008'den "Beni tıklatmayın" konusundaki GoogleTech konuşmasını izlemeye değer .

Tüm konuşma çok ilginç, ama burada ilgili bit 29 dakikadan başlıyor. Burada Firefox'u hackledi, böylece tüm tarayıcı sekmelerinizi dikey olarak sürekli olarak kaydırılan tek bir sayfaya alabilirsiniz.

Bunun şimdi gördüğünüzün habercisi olup olmadığını merak ediyorum.

İki kelime: Kullanıcı Deneyimi.

Temel portföy siteleri, kullanıcının içeriği basit ve basitse, neler sunabileceğini görmek için birkaç sayfayı tıklamasını gerektirmemelidir.

Veya daha spesifik olarak, eylem çağrısının tekil olması. Sitenin amacı: "beni işe" olduğunda, site haritası gereksiz yere karmaşık olduğunda site verimsiz olabilir.

DÜZENLEME: aşağıdaki bazı örnekler ...

http://joelglovier.com/

http://pixelightcreative.com/

http://www.tinybigstudio.com/

http://www.charleselena.com.au/

http://joshhemsley.com/

http://www.digitallabs.tv/

SEO açısından, tek sayfalık web sitesi tasarımı bir heves.

Özellikle son derece rekabetçi bir iş geçmişinde çalışırken, muhtemelen SEO performansınızı bozacak bir şeydir. Grafik tasarımcıların bunu nadiren dikkate aldığını biliyorum ve diğer yandan müşterilerin SEO hakkında yeterli bilgiye sahip olmadıklarını, ancak herhangi bir SEO uzmanına sorarsanız, aynı şeyi söyleyeceklerini biliyorum.

Tavsiyem? SEO uzmanınızdan bir anahtar kelime araştırması yapmasını ve web sitenizin yapısının bir taslağını vermesini isteyin.

Arama Motoru Land hakkında daha fazla bilgi edinebilirsiniz, bu adamlar SEO'yu çok iyi biliyor;) https://searchengineland.com/single-page-websites-seo-182506

Her şeyi "ekranın üst kısmına" alma girişimi gibi görünüyor - ortalama kısa dikkat çekicisinin kaldığı değerli ve değerli alan. Çeşitli kullanılabilirlik çalışmaları bunu göstermiştir ki, insanlar "önemli" şeyleri oraya koymaya çalışırlar. Görünüşe göre bu tasarımcı "her şey bu kadar önemli" gibi hissettiriyor.

İnsanların bir web sitesini okumasını sağlamak için en son göz alıcı hileyi kullanan birinden başka bir şey olduğunu sanmıyorum.

Örneğin, @ Shauna'nın bağlantılı makalesindeki Nike sitesini ele alalım. Dürüst olmak gerekirse, koşu ayakkabısı tasarımında ve aynı koşu ayakkabılarının reklamında ne kadar yenilik kaldı? Bu içerik, paralaks istiyorlarsa bir broşür veya Flash'a kolayca yerleştirilebilirdi. Bunun yerine , Flash'ın yükü olmadan yeni navigasyon şeması sonucunda şık bir paralaks efekti ekleyebilirler .

Hatta Smashing Magazine web sitesinde gösterilen siteleri ortaya çıkaran nasıl yapılacağını gösteren bir HTML5 / CSS öğretici olduğunu tahmin etmek için o kadar gitmek istiyorum.

Aslında bağladığınız ilk öğenin (sürüklenme çubuğu) serin bir faktörü olduğunu düşünüyorum: Hareket halinde iyi görünüyor.

Menü bağlantılarından birini tıklayana kadar benim için hiçbir anlam ifade etmiyordu ve şimdi animasyonun tüm fikir için tek itici güç olduğunu görüyorum. Eski bir Popeye veya Disney karikatür gibi eski okul 3 düzlemli kamera efekti.

Bu sayfadaki kaydırılabilirliğin, bir hata ya da kurtulamadıkları bir özellik olduğunu düşünüyorum.

Bir sorun, müşterilerle popüler olabilir! Bu siteler yeni piyasaya sürülen bir ürün için flaş mikrositlerinin günlerine geri dönüyor, paralaks şu anda bu işi yapıyor gibi görünüyor. Bir ürün mikrositi için iyi olduğunu düşünüyorum, aslında içeriği olan bir site için kesinlikle uygun değildir. Sanırım başka bir şey, tasarımcıların güncel ve 'trendde' olduklarını, popüler bir yeni fad tekniğinde bir web sitesine sahip olmanın yararlı görünebileceğini göstermek olduğunu düşünüyorum. Yukarıdakilerin hepsi benzer sitelerde interneti kapsar.

Sanırım başlığındaki sorunuzu hemen hemen cevapladınız - yani bir heves.

Javascript (ve sonra AJAX) yıllar önce ortaya çıktığında ve insanlar onunla her türlü süslü işi yaptığında, Jquery ve CSS 2/3 için daha iyi destek ve tarayıcılarda daha iyi oluşturma hızı yeni yollarla yeni bir deneme turu başlattı. bazı eski tarayıcılar nedeniyle geçmişte bu kadar pratik olmayabilir sitelerin yerleştirilmesi.

Ancak tıpkı CSS, Javascript ve AJAX gibi fad olgunlaşacak ve olgunlaşacak ve zamanla daha honlanmış, hoş ve kullanışlı hale gelecektir. İlk örneğiniz , deli ayrık kaydırma ile baş ağrısına neden olan düz başlangıcıdır (örneğin, başlangıçta ve "Galeri" ye basarsanız). Benim düşünceme göre çok ileri gitti ve normal ile ayrılmayı haklı çıkarmak için yeterince pürüzsüz bir deneyim değil. Bu, benzer teknikleri kullanan tüm sitelerin kötü olacağı anlamına gelmez.

Tasarımcıların yeni teknolojilerle yeni şeyler yapmanın denemeleri önemlidir. Bir an için bunun asla denenmemesini önermem. Ama ne olduğu - deneysel.