5G 世代來臨，2020 網頁設計最新發展趨勢（上）

2020 即將進入 5G 的高速網路世代，也就是說網路世界勢必走向一個全新的面向，在這股新勢力的推動下，過往的網頁設計早已無法因應網路世界龐大的需求，因此將網頁設計的品質、實用性、使用者友善性全面提升，成了當今網頁設計最大的課題。而在這新課題的產生下，也有許多提供網頁設計服務的公司如雨後春筍般出現，如戰國策集團，這些網頁設計公司，提供了網站業者更多的選擇以及諮詢管道。

網頁設計趨勢一：影片的使用

以往的網頁設計，多數選擇使用圖片多於影片，而現在，令人印象深刻的影片露出，卻更能夠抓住使用者的眼光，拉長使用者在網頁的停留時間。然而在網頁中添加影片，複雜度卻遠遠比添加圖片還要來的多，像是網頁開啟後影片的加載速度、影片是否自動撥放、影片的畫質、載入時是否靜音、影片是否可以在不同裝置上正確播放等等，都是在網頁上加入影片時需要注意的。

關於影片使用，除了後期的網頁設定外，前期的拍攝以及素材挑選也暗藏玄機，如何在短短數分鐘的影片畫面中，將欲傳達的資訊準確的傳達給觀看者，影片的拍攝手法、運鏡、後期的字幕以及特效剪輯等等，都需要特別的著墨。

最後，介於圖片以及影片之間的 Gif 動圖檔，也是當今網頁設計愈來愈熱門的呈現方式，製作的繁複程度低於影片製作，卻依舊可以呈現生動的效果，在連續的秒數中，不斷重複播放相同的畫面，更可以加深使用者的印象，也提高了網站整體的趣味性，然而目前在某些架站平台中，並不支援 Gif 動圖檔的使用，因此在使用 Gif 動圖檔時，也需注意網頁瀏覽時是否可以順利呈現，或是需要透過其他外掛裝置去優化。

網頁設計趨勢二：設計排版

過往的網頁設計通常趨於保守，現今的網頁設計則更為講究整體設計感與排版動線，讓使用者在瀏覽網頁時，除了可以輕易獲得想要的資訊，更可以滿足視覺上的體驗。根據統計，網頁設計的排版方式以對稱排版最被廣為採用，因為對稱的設計界面，可以讓使用者可清楚的了解網頁動線，並幫助使用者更快速的找到資訊整理出重點。對稱網頁設計呈現的方式有很多種，可以是顏色上的對稱、格式上的對稱又或者是水平型式的對稱。網頁設計者可以根據不同的網站目的以及多數使用者的需求去選擇適合的對稱方式，常見的對稱模式為 Z 字型的排版樣式。

為了要在眾多網站中脫穎而出，有些網頁設計者會捨去非對稱的設計型式，例如 N 字型的模式，利用不同的變幻風格，讓使用者產生視覺上的衝擊，讓使用者留下深刻印象，然而在採用這種設計風格時，還是要留意整體的使用性以及使用者體驗，才不會弄巧成拙，加速使用者跳出網站的時間。

網頁設計趨勢三：網站加載速度

忙碌的現代生活，分秒必爭，有時點進網站頁面，加載中的圈圈多轉個幾圈，都能讓人感到心浮氣躁不耐煩，最終跳出頁面，因此網站加載速度，也是另一個網頁設計需要注意的重要課題。而網站加載速度取決於多個面向，包括了瀏覽器、使用者的裝置、網頁圖片大小、網頁主機、網頁附加程式、當前的網路品質等等，都是可能會影響網站加載速度的原因。一般來說，影響網站加載速度緩慢，最常見的原因是網頁圖片的大小，因此網頁設計者在上船圖片到網頁時，一定要記得利用圖片壓縮軟體，像是 TinyPNG ，幫助縮小圖片大小卻不影響圖片品質。

當網頁設計者想在網頁中加入更多的附加功能，或是增加許多不同的設計以增加網站的豐富度，這些往往都會拖累網站加載的速度，因此網頁設計者需要在這兩者之間取得平衡，捨去不必要的環節，找出效能以及品質的中間點。想要找出減緩網站加載速度的原因，可以透過一些網路檢測工具，像是 Google PageSpeed Insights、GTmetrix、WebPagetest 等等，透過這些網站的診斷，找出網站速度緩慢的原因，並進行改善。

網頁設計趨勢四：RWD 網頁設計

隨著使用者使用網路的裝置越來越多元，響應式網頁設計 RWD，已逐漸成為當今網頁設計的主流。 RWD 網頁設計簡單來說，就是網頁會根據使用者所使用的瀏覽裝置，去呈現不同的網頁設計顯示方式，以達到最佳的瀏覽體驗。

雖然當今大部分的網站都有針對RWD 網頁設計做優化，許多的架站平台也都有附加的 RWD 網頁設計功能，但是依舊有許多潛在問題存在，像是空白間隔過大、圖片以及文字跑版或是顯示比例不正常等等，這些問題單靠程式設定往往不足以解決，還是需要藉由人工一個一個去進行調整，才能夠達到最佳的 RWD 網頁設計效果，而這也表示需要投入更多的時間以及精力。

本篇文章列舉出了四個因應 5G 世代來臨，網頁設計趨勢的重點，下一篇 5G 世代來臨，2020 網頁設計最新發展趨勢（下）將接續本篇內容，帶出 2020 網頁設計趨勢的另外四大重點。