全螢幕 HTML5 一頁式網頁版型

說到一頁式網頁,早期都用於產品銷售頁,但近幾 年一頁式的網頁版型變得相當的夯,最主要的原因就在於,所有的資訊, 全部都在一個頁面中呈現,因此使用者完全不用再跳頁,在瀏覽上或操作上,也更加的順暢,所以現在一頁式網頁,運用的範圍 變得更加廣泛,像是作品集、公司官網、個人履歷…..,再加上一頁式網頁,都是由上向下滾動,因此在滾動的過程中,也可加 入一些滾動特效,讓畫面看起來更加炫麗,由於是一頁式網頁,因此在網頁載入的速度也相當快,甚至一般的HTML空間就可執行。

聽起來感覺一頁式網頁,就是一個頁面而已,應該 設計上更加的簡易,其實也不盡然,換個方式想,要將原來是一個網站的 架構,現在透過一頁式頁面來呈現,因此在設計上,就得花更多的巧思,才能讓畫面看起來,不單調且感到酷炫,而最近也發現 一個平台,裡面收集了各式各樣的一頁式版型免費下載,同時還有WordPress的佈景主題,因此有需要的朋友,現在也一塊來看看囉!

一頁式的設計越來越多變化,一頁式的好處在於瀏覽方 式單純而直覺,使用者只需用滑鼠不斷向下捲動,就可以從頭到尾欣賞完整個網站的內容像在翻閱雜誌的感覺,因為捲動的情境, 很多設計師開始加入了有趣的創意,無論是動畫、場景變換、翻頁等效果,都讓一頁式網站的瀏覽體驗變得更加豐富。

1.整個網站只有一頁網頁,類似公司或產品的網路電子型錄,設計簡單、平坦化

2.選單的項目只是捲動到(scroll)這一頁網站的某個區塊,一般都是使用HTML中的錨點(anchor)連結

3.會應用許多特效,多半和捲動(scroll)、燈箱(lightbox)相關的Javascript特效。

4.必定會使用"響應式網頁設計(RWD),這是指網頁可以依照螢幕解析度,自動調整大小或給定觀看的內容