web design noun

想經營網站 您應該懂的10個專有名詞 | 聖僑資訊

翻轉行銷 黃詩宜( 2017 . 1 . 10 )

一、靜態網頁 VS 動態網頁

靜態網頁指的是純文字與圖片搭配的網頁,沒有包含網頁程式( PHP、ASP等)以及資料庫等,它無法藉由購物車、會員登入、投票、討論區或是尋找產品等型式與網友們互動,動態網頁則是包含上述所有功能。

簡而言之,靜態網頁如要更動頁面資料或是增加產品,需要具備網頁編輯能力,每新增一個產品就會多一個頁面,管理不易;動態的話只要具備後台登入權限,任何人都可以簡單的更新網頁訊息。

靜態網頁並非完全靜態,它也可以包含GIF、滾動字幕等動態效果。整體來說,靜態網頁載入速度較快但視覺較單調;動態網頁雖然活潑生動但載入速度較慢,建議在設計上交互使用,較少變動的頁面以靜態製作,其它需要定期更新或是資料較多的頁面則以動態設計。

題外話:靜態網頁內容穏定較容易被搜尋引擎檢索,所以SEO常會將動態網頁轉換成靜態型式,稱之為【偽靜態頁面】來優化排名。


二、網站前台 VS 網頁後台

簡單來說網頁的前台就是我們在網路上看到的網站,是一個視覺化的版面讓顧客可以瀏覽和互動;而後台就是指程式端,是賣家用以更新網站資料所用的「後端管理系統」。

動態網站可以透過後台來更新訊息、發佈產品、上傳圖檔或影音資料等,只要具有後台的登入權限,不需要具備專業技能就可以直觀調整前台資訊、快速操作資料庫和管理文件。


三、版型設計 & 切版

版型指的是網頁整體的視覺畫面,版面的配置、框架大小、區塊位置等,除了視覺規劃之外,它更需要考慮網頁的瀏覽動線、網站風格、以及切版等,版型等於是房子的基底,一但確認切版之後就難以修改,因此在設計時必需釐清網站的目的和品牌想呈現的風格。。

切版就是指將提案後的圖檔切成HTML+CSS,利用語法組成我們在瀏覽器上所看到的網頁樣子,以供後端工程師上程式(可稱之為套版)。

題外話:現在多數使用CSS切版的原因,是因為CSS較符合SEO優化,它可以精簡程式碼、提升網頁載入速度,且能更為靈活的調整網頁內容。


四、RWD響應式網站 VS 手機版網站

全名為「響應式網頁設計( Responsive Web Design)」,又名為自適應網頁設計,是讓網頁可以自動配合不同解析度變換頁面大小及版面配置的技術,讓使用者可以透過桌上型、筆電、平板或手機等裝置隨意閱覽網頁。

常見誤解:很多人認為RWD就是指手機版網站,其實它們是不一樣的,雖然都是為了適應不同解析度瀏覽的設計,但RWD不僅支持平板或手機,同時也支援桌上型和筆電,手機版則是僅支援解析度小的裝置使用;另外若是建置手機版網頁,則在官網更新的同時,也需要更新手機版,等於是耗費多餘的成本和人力去同時維護二個相同的網頁,相比之下,RWD更為人性化且便利。

題外話:RWD網頁有助於SEO優化,它的好處如下:

(1) 避免內容重複 可集中流量
因為不需要另外建置手機版網頁,所以可減少網路上出現不同網址卻有重複內容的情況,且不同裝置的流量都可算在同一網址中,用戶更容易分享、接觸內容,可提升網站整體評價。

(2) 優良的使用者體驗
用戶不需要調整行動端版面去閱讀網頁資訊,所以不論是使用什麼樣的裝置都可以享受到最好的視覺介面,若再配合良好的瀏覽動線就可降低頁面的跳出率。

(3) 在地化搜尋
由於行動裝置定位的便利性,愈來愈多的APP和Google引擎都加入了地點的考量機制,讓使用者只要查詢餐廳或是五金行等,就可以輕鬆搜尋到離所在地點最近的商家,若這個店家的官網有提供RWD則能提高使用者前往消費的機率,大幅提升行動搜尋排名。


五、JavaScript VS Java

JavaScript是一種高階的程式語言,常用來在HTML頁面嵌入動態文字、回應用戶操作、讀寫HTML、資料驗證、檢查訪客瀏覽器訊息和cookie等,它是為了豐富網頁功能並提高互動性,以最方便快速的方式來進行網頁工作,所以能大幅減低伺服器負擔,打個比方,當用戶在填寫表單時,如果有漏打的必填資料,則JavaScript就會自動跳出訊息提醒對方,在HTML5和CSS3推行後,它也開始常見於遊戲、APP的開發上。

JavaScript跟Java雖然名字和語法相近,但實際上是不同的語言, JavaScript能夠編寫於HTML內,且在開啓網頁的同時會被直譯執行,它的程式碼僅能在瀏覽器上執行;Java則相反,可以跨平台執行。

資料參考

維基百科

fblike
  • 155