身處數位時代,網站已成為個人或者企業介紹自己的重要媒介,一個運作穩定且目的明確的網站不僅在設計上要夠吸睛,還需要高延展性的技術支援,更重要的是高效的網站載入效能需,做了一個很美且功能很強大的網站,但載入速度過慢,使用者一進站後立即轉跳,完全是沒意義的啊!不僅如此還會對 SEO 排名有負面影響,網站效能 Good 編甚至認為是網站建置裡最重要的一環,他的權重高於設計規劃、功能開發!
這篇文章主要是介紹網站的基礎知識、運作原理、實務應用,讀完這篇文章的讀者,會對以下 6 個議題有一定程度的理解和認識
主機介紹
原理說明
網站主機是指存儲網站檔案、數據、資料的伺服器。這些伺服器通常由專業的主機商運營 (ex. AWS, GCP, Microsoft Azure),以生活應用的例子作為比喻,可以想像它就像網站的房子一樣,儲存著網站裡的所有檔案。
實務應用
目前市面上主流的主機有以下3大分類
虛擬分享主機 (Virtual Hosting)
- 運作原理:物理上的主機硬體資源與眾多使用者共享,每位使用者的網站資料都被分類到不同資料夾裡,如果一起共享此虛擬主機的使用者網站佔用資源較大,自身網站的效能可能因此受到影響。
- 實務應用:虛擬分享主機適合小型企業或個人部落格通常會選擇虛擬分享主機,因為它成本較低,並提供足夠的資源來應對有限的流量和簡單的網站功能。
VPS 主機 (Virtual Private Server)
- 運作原理:概念和虛擬主機類似,也是多人共享一個主機空間,但唯一最大的差異在於 VPS 提供更獨立的託管環境,每個 VPS 都有自己的一部分資源 (如CPU、記憶體、存儲空間) ,並且運行自己的作業系統,同時 VPS 使用者擁有對其虛擬機的完全控制,包括根訪問權限,可以安裝和配置軟件,甚至選擇操作系統。
- 實務應用:VPS 適合需求較高、需要有獨立控制權的使用者,因為有獨立控制權所以需要設定的配置較多,費用比虛擬共享主機貴一些,適合流量適中且有伺服器維運專業的工程師團隊。
專用伺服器或雲端主機
- 運作原理:專用伺服器是指一種託管服務,其中使用者租用並獨佔使用一台物理伺服器主機 (或者透過雲服務租賃所於自己的獨立主機)。這台伺服器不與任何其他使用者共享,提供使用者完整的控制權和對伺服器資源的獨立訪問的權利。
- 實務應用:適合流量大、需要高頻寬處理海量數據與資料的網站,例如:大型電商平台、新聞網站、CRM POS系統、線上遊戲系統或者需要高度客製配置的軟體應用。
網域介紹
原理說明
網域名稱是一種用於標識網絡上某一地址的使人類容易解讀的名稱,在網路的世界,網域名稱通常用來代替主機 IP 地址,讓使用者更容易記住和訪問網站。
例如:“example.com“ 它不僅是網站的身份標誌,如果主機是房子,簡單來說網域就是房子上的門牌地址,網域同時也是品牌的一部分,選擇合適的網域名稱並進行註冊是建立網站的第一步。網域名稱系統 (DNS) 則負責將網域名稱轉換為伺服器的 IP 地址,使瀏覽器能成功找到主機位址最後成功載入網站。
實務應用
品牌識別
網域名稱對於建立品牌識別非常重要。一個好的網域名稱反映企業或組織的名稱或其主要業務。 例如:Jason 想開創一個屬於他的 AR 技術應用事業 “Jason AR” 可能選擇使用 “jasonar.com” 作為公司的網域名稱。
國際化 & 在地化
網域名稱可以用於針對特定的地區或語言群體。國家代碼頂級域(ccTLD)如 “.uk”、“.jp”、”.tw” 用於針對特定國家。 企業在不同國家或地區經營時,可能會選擇使用不同的國家代碼頂級域名。像是 Good Vibe 好感數位整合目前主要的業務範疇是以台灣地區為主,我們使用 goodvibe.tw 為主要網域名稱,這同時也意味著我們從台灣出發。
行銷活動推廣
網域名稱也用於行銷活動推廣,一個易於記住且相關的網域名稱有助於吸引更多訪客,如一個特定活動或產品的推廣可能會使用特定的網域名稱,如黑五檔期活動促銷 “blackfridaysale.com”。
搜索引擎優化 (SEO)
網域名稱對於搜索引擎優化也很重要,選擇包含特定關鍵詞的網域名稱是一種常見的 SEO 策略。 例如:一個提供咖啡維護服務的網站可能會選擇一個包含 “coffee ”或 “latte” 字樣相關關鍵詞的網域名稱,有助於提高其在與這些詞相關的搜索查詢中的可見性。
CDN 介紹
原理說明
CDN (Content Delivery Network,內容傳遞網路) 是一組分佈在不同地理位置的伺服器網路,用意在於通過更靠近用戶的伺服器提供網頁和相關網路內容。這些伺服器通常存儲網站的靜態資源的副本,如圖片、影片、CSS、JavaScript 文件。
服務優點
提高載入速度
通過將網站內容存儲在使用者附近,CDN 可以顯著減少數據傳輸時間,加快網頁載入速度。
減少延遲
CDN 減少了數據傳輸的物理距離,進而降低了延遲。
提高系統穩定性
即使某個伺服器或節點出現問題,CDN 也能從其他節點提供內容,確保網站持續運行。
減輕原始伺服器負擔
大部分流量由 CDN 處理,原始伺服器的負擔得以減輕許多,對於處理流量較大的網站算是必備服務。
實務應用
網站效能提升常見案例
- 靜態內容傳遞: CDN 被廣泛用於加速網站的靜態內容 (如圖像、CSS、JavaScript 檔案) 的載入時間。透過在全球多個位置存儲這些內容的副本,CDN 能夠確保用戶從最近的伺服器獲取數據,從而減少延遲。
- 動態內容傳遞: 一些強大的 CDN 解決方案還能夠有效的處理動態內容 (即實時生成的內容) 提供更快的響應效率。
- 多媒體影音串流平台: 對於流媒體平台 (如 YouTube、Netflix) 來說,CDN 是不可或缺需啟用的服務項目,CDN 能支援高效的影片和音訊數據傳輸,即使在高峰時段也能保持穩定的傳輸質量。
- 大型檔案資料傳輸: 軟體和遊戲公司利用 CDN 來分發大型檔案,例如:遊戲安裝包 or 系統更新。確保即使在高需求情況下也能快速且穩定的傳輸數據。
- 行動裝置內容傳遞效率優化: 隨著移動網際網路的發展與普及,CDN 也被用於加速行動裝置內應用城市的內容載入,尤其在網路連線質量較不一的地區。
- 全球範圍的數據適量分配: 對於全球運營的企業,CDN 能夠確保無論使用者位於何處,都能夠快速訪問網站和應用程式。
- 安全性和 DDoS 防護: CDN 不僅提供內容傳遞效率之功能,還包括安全性增強,如分佈式拒絕服務 (DDoS) 攻擊防護、網絡防火牆 & SSL 加密。
資料庫介紹
原理說明
資料庫是一種系統,以數位資料的方式儲存、檢索、更新和管理數據。在網站架構中,資料庫通常用於存儲用戶信息、商品資料、交易記錄等重要信息。它允許快速且高效地訪問大量數據,並支援複雜的查詢和數據分析。
實務應用
電子商務網站
在電子商務網站中,資料庫用於存儲產品、會員、產品庫存、訂單資料。透過工程師建置獨特的銷售功能從資料庫爬取專屬資料,例如:針對指定會員,在指定頁面的指定位置,推薦指定偏好產品。
內容管理系統 (CMS)
資料庫是許多內容管理系統的核心,用於存儲網站的文章、圖片、影片。例如:WordPress 使用 MySQL 資料庫來存儲所有網站內容和設置。
社群媒體
社群媒體如 Facebook 和 Twitter 使用大型分散式資料庫來存儲會員資料、貼文、訊息和互動記錄。資料庫必須處理大量請求並快爬取相關速數據給即時給予回應。
企業資源規劃 ERP, CRM 系統
ERP, CRM 系統使用資料庫來整合和管理企業的業務流程,例如:財務、人力資源、供應鏈、產品庫存等資料。這些系統依賴於資料庫的穩定性和安全性,以確保機密數據的保護。
前端開發介紹
原理說明
前端指的是網站或應用程式的會員界面和使用者體驗部分,涵蓋了從使用者如何看到網頁 (視覺呈現) 到與網頁的互動 (互動性)。前端通常由3大核心技術構成:HTML、CSS、JavaScript。HTML 負責結構,CSS 處理呈現和樣式,JavaScript 則負責功能和互動性。
實務應用
網站建置與開發
在設計網站時,前端開發者會使用 HTML 來建立頁面的結構,CSS 來添加樣式,並通過 JavaScript 增加動態元素和互動性與功能。例如:一個電商網站會有產品展示頁面,優於使用者體驗的前端開發確保這些頁面在不同的裝置上都能正常顯示並易於操作。
響應式設計
響應式網頁設計是前端開發的一個非常重要的任務,它確保網站可以在各種裝置上 (如手機、平板、桌面電腦) 能正常顯示,讓使用者有好的瀏覽體驗。
前端框架的使用
現代前端開發經常使用各種框架來提高開發效率,例如:React、Angular 或 Vue.js。這些工具制定好了預先規劃好的模組 & 功能,開發者能夠更快地建立複雜且互動性強的網頁。
使用者體驗 (UX) & 使用者界面 (UI) 設計
前端開發不僅涉及程式碼,還包括對用戶體驗和界面設計的考量。良好的 UX/UI 設計能夠為網站帶來更多使用者前來觀看瀏覽,增加網站曝光的同時還增加使用者的停留於網站的時間。
前端效能優化
前端性能優化是提升網站加載速度和效率的重要環節,網站效能也是 SEO 搜尋引擎優化很關鍵的一項評分指標,關於 SEO 評分指標之後再與大家分享。前端提升網站效能的部分,包含壓縮圖片、最小化 CSS 和 JavaScript 文件的大小,以及使用瀏覽器快取技術。
後端開發介紹
原理說明
後端通常指網站或軟體應用的伺服器端 & 資料庫端,負責處理軟體應用的核心功能,如資料處理、存儲、檢索,以及其他伺服器端邏輯和功能,網站要開發特定功能需要從資料庫抓取資料再將資料以特定邏輯吐到前端,這都屬於後端的開發範疇,涉及使用伺服器端語言 & 框架,例如:Node.js、Ruby on Rails、PHP、Python。
實務應用
資料庫管理
後端工程師開發功能 & 維護資料庫,確保數據的結構化、安全性和有效存取。例如:一個客戶關係管理系統 (CRM) 會使用後端來管理用戶數據、交易記錄 & 互動紀錄 (log)。
伺服器端管理
後端開發涉及建置和維護伺服器的應用。包括如何存儲數據,在伺服器和使用者端之間有效的傳輸數據,以及如何確保軟體應用的整體性能 & 安全性。例如:在一個電商網站中,後端會處理會員的訂單資料、網站上的產品資料數據的存儲和使用者間互動的邏輯。
API開發
API 技術的發展省去了企業端重建資料數據的時間,直接與需要的系統進行資料抓取和互動即可,所以在遇到系統串接情境後端開發常常需要開發 API,使不同系統資料、或者前後端資料的拋轉與應用。良好設計的 API 不僅提高了開發效率,還有助於確保系統的延展性性和維護性。例如:遊樂園網站需要顯示天氣資訊,可利用 API 技術爬取氣象局的開放 API,將天氣資料顯示於網頁中。
安全性和資料保護
在後端開發中,安全性是一個不可或缺開發要點。這包含實施身份驗證 & 授權機制 (2FA)、保護數據免受 SQL 注入和跨站請求偽造 (CSRF) 攻擊,以及加密機密數據資料。在處理個人財務相關的應用,如網銀服務,後端必須符合嚴格的安全標準和規範。
總結
2張圖總結上述所有應用與介紹
- 使用者、前端、後端、伺服器主機、資料庫、3方 API 運作流程如下
- 使用者、網域、CDN、伺服器主機運作流程如下
相信讀到這裡的讀者們對網站建置的基礎知識有一定的了解,我們會陸續分享更多關於網站建置相關的知識,如果您有更進一步建置網站的需求,歡迎與我聯繫,讓我們一起開啟屬於您的線上事業吧!
參考資料