Gremlin Works網站架設公司

網路架設技術與程式應用整合是重要的核心基礎，包跨國際企業網站應用整合、中小型網站、工具應用平台、內部服務功能平台、ERP、CRM導入串接… 等項目，透過完整分析與計畫， ... 跳至主要內容 網站架設|掌握專業的設計與開發技術，為您的網站創造無限價值 我們希望您喜歡這篇文章！ 如果您希望我們協助您進行品牌設計，請點此。

首頁»WebDevelopment»網站架設|掌握專業的設計與開發技術，為您的網站創造無限價值 為什麼GremlinWorks與眾不同？ GremlinWorks擁有專業用心的網站設計服務，與多年網站建置的應用開發經驗，深知網站最關鍵的核心在目標與定位。

我們透過與客戶溝通了解您的需求，不論是購物網站、形象官網的架設，還是ERP與CRM系統建立，或是客製化網站、一頁式網頁設計等，利用程式撰寫和UI/UX設計等技術，提供最有效率的網站架設解決方案，並進行完整的分析，擬定SEO企劃及品牌行銷策略，協助您打造心目中理想的網站，讓GremlinWorks為您的企業創造最佳效益與無限價值。

GremlinWorks網站架設的六大特色 網站目標分析與品牌策略 透過品牌價值與目標客群分析，定位網站發展方向與成效，建構品牌與服務產品在網站上的完整連結性，佈局客戶體驗與策略需求，提升網站關注瀏覽量，創造網站所帶來的企業價值與效益。

模擬體驗UI/UX設計 以良好的使用者體驗為核心，運用UI/UX企劃與設計技術，透過Wireframe製作，準確繪製所有功能與模擬使用者操作，並進行設計與規範製作，預覽網站視覺呈現與態度，以利進行下階程式開發的網頁製作。

網站SEO內容企劃 針對企業性質及需求擬定的SEO優化企劃，專注於改善關鍵字報告、內容行銷、內部連結等方向，為您打造穩定排名的關鍵字佈局。

我們將定期分析競業網站、線上流量與市場狀況，確保策略符合搜尋引擎的演算法更新。

網站程式開發與建置 網路架設技術與程式應用整合是重要的核心基礎，包跨國際企業網站應用整合、中小型網站、工具應用平台、內部服務功能平台、ERP、CRM導入串接…等項目，透過完整分析與計畫，提供最適切的開發技術與工具應用及物聯網整合。

網站設計與體驗優化 順應目前的主流裝置與使用趨勢，設計符合使用者習慣的網站，其中RWD響應式網站設計與一頁式網頁，不僅提供使用者在不同環境下都能有最佳的瀏覽體驗，還能提升SEO排名與企業形象。

網站維運與營運 網站在線上發佈後，持續提供維護與營運的服務，包含內容企劃、設計製作、功能製作更新、經營代管等工作執行。

國際企業的網站平台營運執行與技術支援，有效提升數位化與網路化效能與創造利潤。

我們提供了哪些網站架設服務？ 購物網站架設 面對網路世界的龐大商機，該怎麼架設自己的購物網站，如何讓自家品牌的產品與服務在同行中展現優勢呢？GremlinWorks提供全方位「購物網站架設」方案，幫你一次分析我們的購物網站架設特色！ 根據客戶需求訂製的基礎軟體包，包含獨立電商網站架構、、操作簡易方便，讓客戶可隨時客製化自己的產品。

雖然Shopify、Shopline及Cyberbiz等電商平台容易上手，對於新手賣家友善，但制式模板上的設計受到很大的限制，也無法擴充功能。

選擇我們的購物網站架設服務，不只可隨意設計網站版面樣式，更提供SEO優化的服務，方便商家做未來的電商規劃。

GremlinWorks的購物網站架設服務，與線上各店商平台最大的不同點在於，我們不必每月付費、無須繳交易手續費，也不會有不續約就無法取得網站上所有資料的問題。

長遠來說，客製化購物網站架設的費用，其實比每個月付給電商平台的成本來得省很多。

想知道GremlinWorks的詳細購物網站架設服務嗎？立刻進入購物網站架設了解更多。

了解更多 品牌官網架設 大多數的公司為了增加自家品牌的曝光度，提高企業營收的轉換率，會選擇架設品牌官網。

想要打造自己的官方網站，提升企業形象又可以傳達品牌精神嗎？GremlinWorks提供客製化的「官網架設」方案，幫你一次分析我們的官網架設特色！ 我們的客製化官網穩定性高，不受市面上架站平台系統的限制與干擾。

透過與客戶的溝通協調，加強品牌與商品的連結強度，明確傳遞產品特色，並有效提升產品的曝光率。

內建SEO優化系統，以數據分析方式呈現商品頁面流量、商品關鍵字搜尋度等等，不僅方便了解使用者來訪目的，還可以協助企業擬定官網優化的策略，利於鎖定目標客戶(TargetAudience)，進而發掘潛在客戶並拓展市場。

想知道GremlinWorks的詳細官網架設服務嗎？立刻進入「官網架設」了解更多。

客製化網站設計 如果以上的服務項目都不符合你的需求，別擔心！我們也提供全面客製化的網站設計，讓你擁有自己的專屬網站。

GremlinWorks提供專業用心的「客製化網站設計」方案，幫你一次分析我們客製化網站的特色！ 特殊獨有的網站架設與網頁製作透過與客戶的溝通，了解客戶明確的架站要求，進一步擬定具體詳細的網站設計畫。

想知道GremlinWorks的詳細官網架設服務嗎？立刻進入「客製化網站設計」了解更多。

了解更多 一頁式網頁  一頁式網頁精簡的單頁設計擁有不少優點，包含節省時間、使用者體驗佳、搜尋機率提高等等，許多企業紛紛開始架設一頁式網頁，儼然成為目前網站設計的趨勢。

具備一頁式網頁設計的專業技術，是我們的一大優勢。

GremlinWorks提供的精美「一頁式網頁」方案，幫你一次分析我們的一頁式網頁特色！ 優質且專業的客製化設計，使用者在介面上的操作簡單方便，也因為其製作容易的特點，可以在短期內快速上線，非常適合做企劃活動的網站。

我們的一頁式網頁設計方案，不只是網頁製作而已，也提供網路行銷策略的規劃，融合線上與線下的服務，提升企業或活動成效。

(CTA) 想知道GremlinWorks的詳細官網架設服務嗎？立刻進入一頁式網頁設計了解更多。

了解更多 如何選擇適合的網頁設計公司？ 關於網站架設，應該自己架設網站，還是交給網頁設計公司製作呢？自己架站的成本是不是比網頁設計公司便宜？但聽說自己維護網站費時又費力？業界的網頁設計公司那麼多，究竟要怎麼選擇適合自己的公司呢？ 如果你曾有這樣的疑慮，我們都幫你分析好了！可以參考：該選擇網站設計公司還是自架網站？優缺點大分析！，協助正在猶豫的你做出適當的決策！ 另外，決定尋求的網頁設計公司的你，可以閱讀「如何選擇適合的網頁設計公司？」，讓我們教你如何做出聰明又適合的選擇！ 網頁設計範例 看完了GremlinWorks提供的各項網站架設方案，是否對我們的網頁設計範例有興趣呢？參考更多成功案例並聯絡我們，讓GremlinWorks為您服務，設計您專屬的網站，創造更大的效益！ 如何架設網站呢？分享我們的網站設計秘訣！ 你正在尋找適合的網站架設平台嗎？該運用什麼網頁製作的軟體或程式語言？網站建置流程又是什麼呢？想自己動手架設網站卻還是初學者的你，看完網路上琳瑯滿目的教學資訊，不知道該從何下手？GremlinWorks分享我們的專業網站架設經驗，一次補齊你入門前必須具備的重點資訊！ 這套網站設計秘訣內容涵蓋5大主題，包含： 網站架設流程網站架設的必備知識網站製作軟體與架站平台網頁製作的程式語言網站維護與SEO優化 網站架設流程 網域申請、虛擬主機租用與DNS指向設定 如果我們將網站架設比喻成「住家」，「網域」如同網站的門牌，申請網域才能讓我們的網站在茫茫網路世界中能夠被清楚辨識，因此網域名稱通常越精簡好記越好，通常以幾個原則為主：「.com」優先、以品牌命名、去除www、避免使用中文。

虛擬主機可以視為網站的「房子」，需要先有個空間才能存放網站的所有資料，通常自己經營的主機所費不貲，現在許多主機商提供租用虛擬主機的服務，不僅方便更是省下了許多人事和技術成本，而挑選主機的的考量點有：公司、價格、功能性等，其中大多數的人推薦選用國外主機，例如Bluehost和Siteground。

DNS為網路名稱系統，像是「地址簿」一樣，是儲存許多IP位址的資料庫。

設定DNS指向的意思如同告訴別人這間房子的門牌就是你家，讓瀏覽者可以輸入網域就找到你的主機，參觀你的網站。

更多網域、虛擬主機和DNS的運作和推薦，在下方「網站架設的必備知識」有更深入的介紹喔！ 網站地圖 正式進入網頁製作的步驟前，建議繪製網站地圖(Sitemap)確立網站的架構，並釐清網站架設的目的、目標客群是誰、期望達到的效益等等。

網站地圖(Sitemap)：製作Sitemap就像是繪製你的網站地圖，計畫頁面組織以及資訊該存放在哪個位置，讓用戶可以找到他們想去的方向。

網站架構的全貌在這個階段會被具體繪製出來，以「頁面」為單位進行架構的確認，透過sitemap圖可以知道各頁面的層級關係及如何連結，以及定義清楚靜態頁面及需要後台管理的頁面。

確認網站架構和內容主軸後，就可以開始探討網站呈現的方式。

首先，我們要先了解網頁組成的3大要素：Header(頁首)、Content(內容)、Footer(頁尾)，每一部分都有它的功能與策略。

Header包含主要的視覺設計和精神，企業Logo也涵蓋在內，是維持網站整體感的重要部分，由於不斷的重複顯示於每一頁，不宜做得太花俏。

Content是變化最多元、最有趣的地方，內容可以用段落(section)組合而成，而段落中可以依照需求劃分數個欄(column)，不同的欄數也有不同的效果。

Footer為頁面做收尾的動作，跟Header一樣重複顯示於每一頁，其提供網站的聯絡資訊，例如聯絡電話、Email、版權宣示…等，同時也是SEO的重要項目之一。

圖稿原型 在前置作業階段，不需要太仔細設計外觀，只需把網站架設的配置大略提出並製成圖稿原型(Wireframe&Prototype)，主要是為了呈現頁面上的重要資訊與資訊的排版。

圖稿原型(Wireframe&Prototype)：為了避免製作網頁後一直修改設計消耗成本，必須先做出基本的UI使用者介面設計圖稿及原型。

Wireframe是將所有頁面的功能繪製出來的靜態線框稿，它完全不考慮任何視覺上的元素，目的就是要專注於頁面的主要資訊及編排架構。

Prototype和Wireframe基本上目的一樣，是讓我們得知頁面功能及資訊的原型，但差別在於：Prototype要考慮UX使用者經驗！它是像瀏覽網站一樣可以被操作的，並不是靜態，因此能讓你更真實感受網站使用者的體驗。

使用案例的執行方針 架設一個好網站並不只是發布一些文章和漂亮的圖片而已，網站設計業界有眾多公司競爭，要讓自己的網站在網路上曝光，除了分析競爭對手追求知己知彼、百戰百勝，也要了解使用者的行為與目的，掌握使用趨勢利於規劃網站優化方向。

與競爭者的策略分析(Plan&Analyze)： 當你在比較競爭對手的網站時，是否總覺得對方經營得很出色，而自己想要進入線上市場，卻缺少網站結構及技術端的資訊分析？其實了解線上消長趨勢是個一直持續的過程，因為網路世界不斷的在變化。

你可以從最簡單的開始，注意競爭對手介面設計(UI)、使用者經驗(UX)，構想一個你喜歡的網站範本。

以後再慢慢深入到文章架構、網頁讀取速度、搜尋引擎優化等等。

進行競爭者分析，知曉對方的優勢後，也需要了解消費者行為(ConsumerBehavior)，精準切入使用者的想法，才能做有效率的改善規劃。

而其中包含5W1H的思考： 客戶為什麼搜尋到你的網站？你的目標客群(TargetAudience)是誰？客戶來訪你的網站的原因？客戶透過什麼方式搜尋到你的網站？你能提供什麼樣的服務？哪個網頁是你希望客戶進入的頁面？ 掌握了這些資訊後我們就能更完善企劃網站整體方向，架設出一個符合使用者來訪需求的網站，成功創造更多商機。

網頁製作與設計 開始網頁製作前，建議可以做幾項事前準備工作： 找喜歡網站作參考範本：為了讓網站設計的雛型更明確，可以根據網站架構、排版樣式、功能等，將設計的藍圖具體化。

深入了解品牌形象：透過品牌形象的理解，可以清楚自己的核心價值和想要傳達的理念，因此更確立網頁製作的方向與強調的重心，思考適合品牌形象的網站風格，加強網站與品牌之間的連結。

以線框稿(Wireframe)為網站設計指南：上面提到的圖稿原型，其中包含網站線框稿(Wireframe)，以線框稿為主軸設計你的首頁(homepage)，可視你的喜好、參考範本等再添加圖片、動畫特效等等美化你的頁面，在視覺效果上吸引使用者來訪你的網站。

前端程式撰寫 雖然市面上有許多不需要太多程式基礎的架站平台，但如果想要完全客製化自己的網站，前端(Front-End)和後端(Back-End)程式撰寫是你不可不知的工具！ 前端(Front-End)：進入一個網站，映入眼簾的是漂亮的圖片排版和許多連結按鈕，這些畫面與使用者的互動功能就是前端(Front-End)的範圍。

前端作為網頁的前台，前端工程師主要打造網站的「門面」，建立流暢、友善的的介面，讓瀏覽者可以順利接收頁面的資訊，並使用網站上的各種功能。

同時，不斷優化產品的效能也是前端工程師重要的工作。

組成前端的三大語言有HTML、CSS、JavaScript。

後端程式撰寫 後端(Back-End)：在前端接收了許多使用者的指令後，後端(Back-End)則是負責管理後台的開發，方便以後長期的網站內容裡。

網站的資料內容透過後端的程式存放到網站的資料庫內，資料庫就像一個大型的倉庫，裡頭會分門別類儲存資料，當有需求時，會再透過後端程式將這些對應資料傳送到前端的畫面中。

後端的程式語言數量眾多，現今主要的有：PHP、Python、Ruby、Node.js、Go。

現在我們知道了前端與後端各自負責的工作，那它們實際上是怎麼運作的呢？ 這邊要提到另一個過程中重要的角色：網頁伺服器(WebServer，可稱Server)。

伺服器是存放寫好的程式碼且讓它們可以運作的地方，，當使用者輸入網址連到伺服器時，就能看到伺服器上的網頁，而這時伺服器開始執行程式與儲存資料，這裡就是所謂的後端(Back-End)，處理完之後的結果再印出來呈現給使用者看，丟到使用者面前的結果就是前端(Front-End)，由此可知，後端負責邏輯運算、儲存資料，而呈現給使用者的結果與畫面的就是前端。

網站架設的必備知識 在開始著手架設網站前，先回想一下你是否具備了網站設計的基本概念？檢視一下是否都做好架設前的準備呢？ 我的網域申請了嗎？我的網域名是什麼？我的主機商是誰？主機資訊已經完整從該公司收到了嗎？我是否已經正確將DNS指向我的主機位置了？我的網站需要資料庫嗎？如果是靜態網站則不需要。

我需要SSL憑證並且購買好了嗎？或是認為現階段還不需要？ 面對上面這些陌生的專有名詞，是不是看得一頭霧水呢？別擔心，GremlinWorks在接下來的介紹幫你一次解惑！ 1.網域是什麼？ 網域是什麼？網域申請教學 每個人都有自己的名字，每戶人家也都有自己門牌，這些都是辨別個體的一種方式。

浩瀚的網路上有來自全球成千上萬的網站，當然也需要分別它們的辦法。

而每個網站自己專有的名牌，就是網域。

以我們GremlinWorks網站為例子，我們的網域便是：www.gremlinworks.com.tw 以下是幾個常見網站的網域： 谷歌：www.google.com臉書：www.facebook.com推特：www.twitter.com 要架設網站前，你得先搞清楚你想要申請自己的網域，還是用架站平台或部落格平台上提供的免費網域。

這兩個有什麼差別呢？為什麼免費的不用還要考慮？ 如果你有用過痞客邦Pixnet、隨意窩Xuite、Tumblr、Blogger 等部落格平台，那你用的就是他們的免費子網域。

在類似平台上辦部落格，他們都會要求你設定一個還沒被用過的使用者帳號，而這個帳號名會被用來區分你的部落格網站。

假設我們創了一個帳號叫gremlinworks，以下是我們在不同平台上會擁有的免費網域。

痞客邦：gremlinworks.pixnet.net隨意窩：blog.xuite.net/gremlinworks/blogTumblr：gremlinworks.tumblr.com 看得出來這些子網域跟我們自己申請網域(gremlinworks.com.tw)有什麼差別了吧，選用自己的網域會給用戶更專業的感覺！雖然使用免費網域是最快速又(短時期內)省錢的方式，但卻也隱藏一些問題，因此建議在一開始就把網站未來發展考慮進去才行。

免費網域會衍生2個問題： 冗長的網域名：立即要面對的問題，就是當你必須曝光自己的網站時，不論是名片上也好，在行銷廣告也罷，往往會是一長串字母，裡面還會交雜平台名字(跟自己品牌無關)的文字。

SEO權重的轉移：你在網站上所有經營累積的成果，都很有可能在日後面臨搬家轉址的過程，而必須得從頭開始，主因是不少平台仍不提供權重的轉移。

白話來說，就算你搬家了也重新指向新頁面了，但使用者搜尋時還是會因為舊網站的權重較重而先搜尋到。

各位應該有搜尋過一些文章，頁面點開後顯示「我已搬家，將為你連到本頁新連結」吧？沒錯，就是這個缺點。

如此一來，以後使用者要找到你，搜尋結果都要先繞過以前使用的平台頁面。

這實在不是長久之計啊！ 要去哪裡買網址呢？ Namecheap：24小時客服團隊(雖然要用英文溝通，但有問題時，他們LiveSupportTeam回覆真的很快！)，一年.com費用較GoDaddy少約1塊錢美金，網友評價高，購買介面簡單。

GoDaddy：有中文介面，老品牌網站，全球客戶眾多，僅提供週一至週五客服，購買流程對新入門者較容易產生誤會。

PChome買網址：沒錯！萬能的台灣PChome也可以買網址，當然介面客服也都是很「台灣」，對於追求親切感的朋友，這也是不錯的選擇。

2.URL是什麼？ URL是什麼？URL和網域的差別在哪？在製作網站過程你一定會看到URL這個名詞，卻一時不知道是什麼。

其實，這在生活中很常使用，我們常口語化把它稱為「連結」，也就是「網址」。

當你要分享一篇實用的文章，或有趣的新聞給朋友時，你複製貼上的那一串網址就是所謂的URL。

或許有些人會有疑問，那URL和網域的差別在哪？所謂的網域是你網站的名字，但仔細觀察後發現，在這個網站中每一頁的網址其實都會不同。

舉例來說：你的網域是example.com，而你的最新文章的URL肯定會在網域後台加上一些後綴，就像example.com/blog/post-2019，像這樣的字串。

基本上，網域只是URL的其中一部分。

有些人在工作時可能需要附上一個連結到信件中，但往往頁面的URL極為冗長複雜，這時請記得善用Google的短網址工具：https://goo.gl/ 。

只要把你的連結貼上去，它自動幫你產生一組短網址喔！更棒的是，他還有幫你記錄點擊次數，所以你也可以同時追蹤呢。

3.虛擬主機是什麼？ 虛擬主機是什麼？最受歡迎虛擬主機比較 若把架設網站比喻成一個室內裝修的工程，那麼首先你至少需要有一間房子。

不管是小型公寓還是濱海別墅，總是要先有一個房，才能開始動手室內裝修，把漂亮的傢俱放進去。

同樣的，你的網站就是需要這樣的虛擬主機空間(WebHosting)，來存放網站的所有資料。

如果本身沒有工程師在管理網站的話，記得要詢求「虛擬主機」，而不是VPS或實體主機的方案喔！虛擬主機就等於主機商已經幫你蓋好所有的環境，而你只需要把自己的物品搬進去就可以了，對於非工程師背景的人，管理及使用上會比較容易。

要去哪裡租虛擬主機呢？ 遠振資訊：台灣機房，中文客服，超簡單中文介面，適合對主機相關知識很陌生又有點懼怕的初階管理者使用，好上手。

BlueHost：香港機房，價格平價、無限流量、無限容量、也無限網域，相當俗又大碗的選擇。

SiteGround：新加坡機房，穩定性很高，客服展現高評價的水準，自家開發的SuperCacher功能，也就是讓你的WordPress網站瀏覽起來飛快。

還有，最重要的還有免費支援Let’sEncryptSSL憑證功能。

一整個水平高到破表的服務，也讓近期很多人都轉而投向它的懷抱了！ 另外，許多人挑選虛擬主機最主要的考量重點在價格，但是虛擬主機的選擇也會影響網站的SEO排名，以下為幾個可能造成的影響： 網站運作速度：網站的運作速度在使用者體驗裡是很關鍵的影響因素，若網站載入速度快，不僅提高用戶滿意度，對於搜尋引擎認同度也會有很大的幫助。

而Google也指出，網站速度是搜尋引擎排名的評分標準之一，由此可見網站運作速度的重要性不容小覷。

網站安全性：網站的安全性，對於企業與使用者都有重大影響。

企業方可能有許多重要的數據，如果安全性不佳可能有數據遭竊、遭惡意散播廣告等，而使用者方則可能存在中毒或個資遭駭等風險。

若選擇正規的主機商，使網站的安全性得到多一層的保障，網站數據遺失或損壞的機會下降，因此虛擬主機的選擇對於網站安全有一定的重要性。

網站穩定度：網站的穩定度對於使用者體驗也是十分重要的，虛擬主機運行正常與否，攸關網站的運作是否穩定，虛擬主機的品質越好，網站正常運作的時間就會越長、越穩定，假如當機發生機率頻繁、當機時間過長，則須考慮切換主機商了。

網站無法穩定連線不僅影響SEO排名，對於網站的跳出率和搜尋引擎點擊率都會產生負面結果。

虛擬主機所在位置：影響網站性能的另一個因素是網站主機的所在位置，大致上來說，當訪客距離主機位置越遠，網站載入速度就會越慢。

若網站主要鎖定的市場在台灣，那虛擬主機的位置和服務供應商的選擇，原則上離台灣越近越好，或是直接選擇當地的服務供應商。

4.DNS是什麼？ DNS是什麼？如何設定DNS？ 前面我們已經說明了「網域是你的門牌」、「主機是你的房子」，那如何在網路世界讓大家找到你的房子呢？這時就是要倚靠DNS設定(DomainNameSystem)。

DNS像是地址簿，確定網域指向主機，讓瀏覽者可以輸入門牌就找到你的房子，參觀你精心設計的家。

另外要提醒你，所有的DNS設定變更最久會在48小時才生效。

DNS設定最常使用的有三個記錄(RecordTypes)： A記錄：將你的網域名稱指向你的主機IP，將網域及主機串接起來最主要的記錄，多數人的需求只要成功設定此項，就可以讓你的網站順利運作了。

MX記錄：當你需要用這台主機收發信件時，記得也要將你的MX記錄指到這台主機，才能正常使用信箱。

CNAME記錄：當你的網站有其他別名時，你就需要設定CNAME記錄來連結到正規的網域。

舉例來說：你的正規網域是example.com，你可以使用CNAME設定，將www.example.com或子網域abc.example.com指到example.com。

記得！A記錄是對應IP位址，而CNAME則是對應網域。

5.SSL憑證是什麼？ SSL憑證是什麼？如何安裝SSL？ 在瀏覽網站時，你有沒有注意過有些網站開頭是https://有些是http://，而且https的網站前面還有個小鎖頭？擁有這個鎖頭的網站就是有特別建立SSL憑證的網站。

https的「s」就是代表安全性，secure的意思。

透過這個字母來告訴瀏覽者，他們正在觀看的網站是有認證過的，可以放心又安心！因為你申請時必須接受公司資料的審核，而使用者也可以直接點擊鎖頭，看到這些公開的資訊。

哪些人一定要申請SSL憑證呢？ 如果你的網站會有記錄個資、商品交易、訂購等功能的，那麼，強烈建議你在準備主機網域時，也一併將SSL憑證準備好。

若是消費者在填入個人資訊時發現你的網站不安全，很有可能會打消念頭，嘗試其他網站。

去哪裡申請SSL憑證呢？ 除了前段介紹到的SiteGround主機商是免費提供SSL憑證，並且可簡便完成之外，其實上方推薦的網域商及主機商都有各自提供SSL購買的服務。

因此，對於網站架設初階入門的人，建議選定好主機/網域商之後，直接選擇他們的SSL憑證即可。

若考量預算，而想轉而選擇免費的SSL憑證的朋友，Let’sEncrypt也是不錯的選擇。

網站製作軟體與架站平台 網路上有許多架設網站的線上資源可以利用，而網站製作方式大約可分為三大類： 使用程式語言寫網頁，例如：HTML、CSS、JavaScript等使用架站平台，例如：Wix、Weebly、Strikingly、Webnode、痞客幫等使用CMS(ContentManageSystem內容管理系統)，例如：WordPress、Joomla!、Drupal等 以下介紹幾個全球目前較知名的網站架設平台： 1.WordPress WordPress為目前全世界最受歡迎的CMS，根據W3C官方網站資料顯示，全球有超過37.4%的網站是利用WordPress製作。

WordPress的介面操作簡易、網站彈性極大，擁有數量豐富的主題與外掛程式，即使不會寫CSS、HTML、JS等程式語言，還是能輕鬆架設網站，後台系統也相當友善，可快速管理與更新內容，有利於網站維護。

另外，WordPress的網站架構大體一致，Google很快可以辨識出網頁內容並搜尋到你的網站，非常適合做SEO。

WordPress根據使用需求的不同分為WordPress.com和WordPress.org兩種，WordPress.com類似痞客幫等免費部落格平台，申請帳號後即有一套WordPress後台管理系統可自行架設，適合興趣導向、無盈利目的族群。

WordPress.org提供完整版的WordPress內容管理系統，還可根據自己的需求安裝SEO優化工具與串接GoogleAnalytics，但必須另外購買虛擬主機，適合想建立品牌形象、追求數據成效、擁有完全掌握主權的用戶。

2.Wix Wix 是一個提供架設網站的工具，目前全球有1.7億用戶使用，主打入門門檻低，不需要會任何程式語言與網站架設技術，就能快速架站。

Wix其中一大優勢在於內建拖曳式編輯器，只要拖曳物件到你所想的位置即可，也提供設計工具、模板、用戶指南等，可以按照你的想法設計獨一無二的網站。

3.Weebly Weebly和Wix性質相似，以拖曳式模組操作，對於沒有程式語法背景的人來說也是方便又容易上手的架站工具。

Weebly雖為免費的網站架設平台，但它提供免費的網址與SSL安全憑證，提升網站的安全性和信賴度。

另外，Weebly擁有線上客服的支援服務，可迅速解決用戶在架設網站時的疑難雜症。

4.Strikingly Strikingly也是免費的架設網站工具，操作介面可支援中文，一樣無需任何程式撰寫的經驗就能上手。

使用Strikingly設計出的網站線條感較強，特別適合製作視覺效果強烈的一頁式網站。

5.Webnode Webnode也是免費的架站系統，在全球協助3000萬用戶架設網站，提供完整的中文介面支援，具備拖曳式的編輯器，不需程式背景只要拖拉元件至想要的位置即可。

另外，Webnode內建SEO服務，而這項特色對於網站架設新手而言是很重要的。

網頁製作的程式語言 關於網頁製作程式語言，包含前端(Front-End)以及後端(Back-End)。

前端的作用就是替網站建構出一副骨架，穿上漂亮的新衣，並賦予他能與使用者互動的能力，後端則著重在功能和資料的儲存，透過它處理業務和操作資料庫，詳細的前端和後端用途和運作方式，可以參考上面的「前端程式撰寫」和「後端程式撰寫」。

現在我們知道了前端和後端負責的工作，那應該要學習哪些程式語言呢？以下介紹網頁工程師常用的幾種語言： HTML HTML(HyperTextMarkupLanguage)是前端程式的主要語言之一，是一種標記語言(markuplanguage)，用以描述一個網站的結構和內容，因此並非一般的程式語言，也因為沒有程式語言的邏輯，相對較容易理解。

HTML最大的特色在於文件中的元素(elements)含有以「」組成的標籤(tags)和內容(content)，大多數的瀏覽器都可以讀取HTML，利用標籤可以控制內容的呈現，也允許嵌入圖像與物件，還可以用於建立互動式表單，例如：標題、段落和列表等。

CSS CSS中文名稱為階層式樣式表(CascadingStyleSheets)，也是前端程式的主要語言之一，為一種風格頁面語言(stylesheetslanguage)。

僅利用HTML編寫的頁面只有基本的網站架構而已，頁面上華麗的排版樣式，像是字型、顏色、背景等等，就是透過CSS美化而成的，甚至一些動畫和簡易的滑鼠指令反應，CSS也可以完成。

基本上利用HTML和CSS就可以製作出一個簡單的網站。

JavaScript 如果想讓你的網站有更多複雜的動態互動功能，就需要運用JavaScript編寫了。

理論上，JavaScript(簡稱JS)其實才是前端裡真正的程式語言，JS是一種腳本語言(script)，之所以稱為腳本，就是在HTML頁面加載時可自動執行指令。

主要描述網頁的行為，可以回應使用者的動作、動態更新內容、控制多媒體等等，有賦予網站生命的功用。

在學習JS前，建議具備HTML的概念，畢竟先有HTML架構出來的「身體」，才會有JS能展現「行為舉止」。

PHP PHP是一種伺服器端的腳本語言，適用於後端系統並經常嵌入HTML網頁中。

由於入門門檻低，只要了解基本邏輯，即可架設出簡單的網站，因此適合網頁程式新手學習，也算是最普及的後端語言。

相對於HTML和CSS製作的網頁，只有單向接收使用者指令，但網站中的留言板、會員登入、購物車系統等需要後台資料庫蒐集保存訊息，此時PHP就可以作為與資料庫的溝通橋樑，在資料庫進行處理，將相對應的資料回傳給使用者。

網站維護與SEO優化 網站架設完畢後，後續的系統維護、內容優化和SEO策略等，都是很重要的一環，需要進一步規劃。

好不容易架設了精美的網站，如果沒有出現在Google的第一頁，網站也發揮不了效益，因此長期的維護工作絕對不能少。

網站測試與維護 透過網站測試，了解網站現況與體質，才能有效率地找出需要修正的地方，進一步找到SEO優化方向，並且找出執行重點。

而系統維護包含幾項： 網頁上稿除錯：上稿除錯(Launch&Debug)：每個網站系統的運作被開發完成後，一定需要經過多次的測試並除錯，透過不同測試者操作每個網站功能，並在各個環境(Windows、Mac、iOS、Android)及各瀏覽器(Chrome、Safari、Firefox)反覆測試過後，才能讓網站在上線後，面對不同狀態下的使用者都能正確地被呈現。

最後，網站的管理要把手上的所有資料都上傳到後台，讓頁面上的資料都是正確的。

如此一來，網站就可以正式公告大家上線了！網站安全性維護：安全性維護(SecurityandMaintenance)：採取一定的安全手段，提高網站的安全性，主要包含網站安全管理、監測、數據備份、防止病毒的攻擊和惡意的訪問等。

現在的駭客出於很多的商業目的，攻擊網站是經常的事情，因此網站安全維護是非常有必要的。

網站伺服器維護：伺服器維護(ServerMaintenance)：伺服器是最主要的硬體設備，盡量使用擁有多個CPU的專業伺服器。

伺服器的維護需保持設備處於良好狀態且安全運作，並對可能出現的故障問題進行評估，制定出一套或多套應急預案。

內容優化與SEO 好的網站，不只有介面功能、版面樣式佳而已，還需要依靠好的網站內容，才能被搜尋引擎判定為優質網站。

因此，除了在網站架設之時放上好的內容外，更需要定期追蹤、更新並加以優化。

線上有許多追蹤網站的工具，較為知名的比如免費的工具 GoogleAnalytics。

GoogleAnalytics： GoogleAnalytics 網站分析主要是用一種稱之為網頁標記(pagetags)的追蹤技術進行資料收集，而這標記是一小段JavaScript程式碼名為 GoogleAnalyticsTrackingCode。

當我們就將這串程式碼設置於網站中的每一頁，GA便能追蹤到訪客在每一頁上所進行的行為加以分析，並提供數據參考建議。

透過GA的四大報表：目標對象、客戶開發、行為及轉換，分析各管道的流量和使用者表現。

網站分析的結果能提供你優化的方向，而具體上是什麼樣的做法呢？ SEO(SearchingEngineOptimization搜尋引擎優化)：透過搜尋引擎的演算法則來優化網站環境，以提高網站在搜尋引擎內的關鍵字排名及曝光度。

SEO的核心基礎其實不難，以「提升使用者體驗」為目標，只要能掌握SEO優化關鍵，就能為你的網站帶來高網站流量、提升排名。

SEO大致可分為技術層面的技術SEO和內容導向的內容SEO。

技術SEO：即優化網站SEO架構，目的是幫助搜尋引擎讀懂你的網站結構和內容，並評估你的網站權重，因此也必須要了解Google演算法。

內容SEO：目標就是「提供優良的使用者體驗」，因此必須要提供優質的內容，說服搜尋引擎認可為優良網站，其中包含：關鍵字研究及分析、撰寫符合SEO架構的文案、新增內部/外部連結、運用內容行銷策略等。

成功案例 Kymco是台灣最大的摩托車製造商。

了解我們如協助其品牌轉變得更現代化，並確保品牌形象在國際市場的一致性。

了解更多 SearchSearch 成功案例 亞都麗緻Landis為一老字號品牌，我們整合旗下各飯店資源與廣告行銷之系統開發、全球會員與訂房系統服務開發、Intranet平台建置。

了解更多 您想要擁有一個獨一無二的官網嗎？ 嗨，我們是GremlinWorks，給予客制化的專案流程與方案，也為您提供各式網站開發語言及系統選項。

了解更多 需要網站、行銷建議嗎？ 和我們聊一聊吧！ Copyright©2021GremlinWorks