網站架構與內容關聯性怎麼決定 SEO 評分，Sitemap 的金字塔與煙囪兩種結構

大家好，我是Jayden。我是Chair。我們今天又來聊天了。對啊，又是我們兩個。Lucas好像，他已經不在人世了。喂！好啦，不要在台灣啦。在台灣，可能下一集才會出現。真的。我們還是期待我們Lucas趕快回來，跟各位聽眾做線上的互動跟交流。對啊，我們今天要聊啥？今天？對，我今天要問Jayden一個問題。也是我們最近學校碰到的問題。

因為我們最近學校做了一個全面的網頁的更新。要講網頁是吧？就網頁的更新。對。但原因是這樣，因為學校的網頁它已經使用很久了。

對，最近可能學校的政策，或是我們單位的政策，就是要全部的翻新。對，所以我們最近就是在做新網頁新網站的，應該說，資料的轉換。

對，其實我們也有開會，檢討有關於說就網頁大家的，比如說學生不愛使用，或者是什麼樣的一個問題。今天想說藉這個機會，來問一下我們Jayden對於網頁的設計也好，或是行銷也好，有沒有一些什麼可以建議的？

你說網頁設計？我覺得學校的網頁，尤其工部門網頁，他們在做很多，不管是程式，或者是網頁的設計，都是用大概20年前，或者是十幾年前的技術。

這麼久以前的技術？對。因為這也是在很多公司以後，他在做整個，不管是整個系統更新，或網頁更新上最困難的地方。是，就是你的網頁可能是10年前設計的，所以你在東西10年前設計以後，你要用現在的人，跟現在的，不管是資訊工程的人，他們在學的技術，跟你過去的那一些網頁的技術，已經沒辦法維修了。

我知道資訊類的，應該說技術的部分，應該更替是蠻快的。對啊，可是問題是，如果你要更替的話，你整個系統要更替。你整個系統要更替？

那開什麼玩笑，超貴的！真的，一個是貴，另外一個就是說，學校都花這麼多錢做了原本的網頁，他現在要如果全部翻新的話，感覺是要經過很多的溝通。

對啊，而且重點是，很多學校的資料，他的伺服器是建在教育部，你知道嗎？對，建在教育部。因為現在資安的問題。對啊，所以教育部那一邊，如果系統不更新，他就必須要用舊的系統來寫，就是舊的一直用掉。對，所以你會看到，其實為什麼現在的，尤其是學校的網站，都設計的這麼醜，是有原因的。是，當然第一個部分是，就是政府部門的，有一些網站的經費本來就很低，可是他現在要求的，資安的要求特別高，資安的等級。對啊，等級又特別高。

有時候你只是做一個網站，還要隨口隨到。對，這倒是，就是我那時候看了以後，就覺得，嗯哈哈哈哈，這沒辦法，這就是太爛的過程。所以現在的網站，尤其是網站類的，其實比較主流的一個網站的設計的概念，叫WordPress。

WordPress？對，就是WordPress。OK。這是現在比較主流的寫法，然後他的寫法的概念，是有兩個很重要的語法來寫的，一個叫做CSS，一個叫做HTML5。它是程式語言的一些內容。

OK。可是過去，尤其是學校類的，常常都還是用PHP。PHP？都是程式語言類的，都是比較舊的。甚至還有更老的，還是用C++。超級老的一些程式碼，然後由這些程式碼去堆疊。

然後再來的部分是，在寫這個code的過程中，在做網站架設的過程中，他還會用到的東西有更老的一些概念，還有的是用Linux去寫的。

Linux是跟一般的程式不太一樣的東西。就跟我們一般的寫法，我們大部分是Windows系統，Linux是另外一個系統的概念。

OK。所以他有很多這種像是很限制的寫法，所以導致於其實不管是，現在的人才，有沒有這些人才，人才越來越少。然後再來是會寫的人也少，然後再來開的價碼又低，所以有點殺價的競爭。

對，所以就會變成是在很多的，不管在介面上面，或者是在美觀上面，或者實用性上面，都沒有現在的語法寫的來的漂亮，跟來的好看，這其實就是沒辦法。

系統上面的限制就長這樣，所以導致於很多的網站，有的時候你現在發包，可能三年後這家公司就倒了，因為如果是用這個程式，去接案子或接網站的人是根本不可能會接到，就是學校以外的案子，這是不可能發生的事。

這樣聽起來反正就是舊的東西，但現在新的技術跟上了，但是學校還是舊的技術，但已經過時了。可以這樣講嗎？所以他可能，對，像我們其實最近也碰到這個問題，就是我們也只能一直找，原本的那一個廠商然後用原本的技術去處理。

對，所以就碰到一個，面臨一個很大的問題。但你會發現到原本的廠商，越來越多都開始轉型或倒閉，因為已經沒有人再培育這樣的人才。

了解，對，就是這方面的人才越來越少。所以現在的在網頁上面，其實有個很明確的分類，叫做前端跟後端，那什麼是前端工程師呢？前端工程師在做的事情，就是跟介面有關的設計包含是這個介面，他要又讓人家用，要更直覺更美觀，要更有效率，但你會發現到學校的這一些設計，尤其是他後台，他會長得很像是你以前有用過電腦嗎？

電腦不是有EXE檔，執行檔的，對就是EXE，然後點下來可能它會是一個，一個程式的那個東西，那個就是過去的非常老久，大概20年前的程式寫法。

後台就會長這樣對，你後台就會長這樣。然後你就會發現，他們的寫法就會超級醜，那也沒辦法，為什麼醜呢？就是因為他的程式就長這個樣子，技術就只有到那邊。對，所以你會看到就是，很像是那種老阿公在用的程式就像踩地鐵就是這樣子，的那種感覺，就是那種感覺，那種感覺就是20年前的程式寫法。

這種20年的程式寫法，目前在Windows上面，已經越來越少有這樣程式，大部分都會他們說第三方的軟件然後去做開發，然後就看起來就很多美觀，因為這些程式它的限制很多，包含是它的圖片，它沒有辦法用很高清的圖片，對，它的程式也沒有辦法寫的很大，對，這些就是這個程式的限制它就會限制整個網頁的美觀性，然後整個網頁的使用，甚至是那個畫板都要變得很麻煩。

就是我們現在做網頁都是用拖的，大部分都是用拖的，你想怎麼用怎麼做，你想外面的YouTube連什麼就連什麼超連結，但是問題是你看發現學校就沒辦法了，學校就是最傳統的，網頁做法跟網頁寫法，所以它能夠限制的東西就很多。

這是第一塊叫做前端工程師。前端工程師在做的東西，就是把所有的，例如說你的整個網頁的呈現模式長什麼樣子，它就會把它切成好幾個區塊，然後這個區塊都會是，讓人家很簡單的能夠找到你想要的東西是什麼，想要的功能在什麼地方，對，就是前端工程師在做，包含美術的部分是前端工程師在做的，這是第一塊。

第二塊的部分就是後端工程師，後端工程師在講的東西就跟資料庫有關。現在很多資料庫都是上傳到雲端，例如說是亞馬遜的AWS，或者是Google的雲端，這些其實就是後端工程師在做，包含是什麼大數據，大數據分析，這些其實都是後端工程師的工作，它最主要的功能，很重要的存在就是資料庫管理跟資安，對，資安，對，就是資訊安全，大概主要是這兩個，當然後端工程師還有很多很細部的工作，但我就簡單分成這兩個，所以一個網頁的設計，大概就分成前端工程師跟後端工程師對，這個是現在比較主流的做法。

然後大部分都是做WordPress，就新的技術，對，就是用WordPress，用第三方網站，它是一個比較完整的網頁的支援平台。

它當然不只是能夠做網頁，它還能做非常多的東西，只是我們大部分做網頁都是用WordPress，最主要的原因是跟SEO有關，SEO，對，這大概是簡單的做一下介紹。其實現在這種工程師都很貴，很貴，而且發展性都很好，例如說你可能要請一個前端工程師，你大概沒6萬沒7萬請不到，你說架一個網站嗎沒有，你就請一個前端工程師。

你的薪水大概沒6萬沒7萬，一個月這樣。對，一個月大概請不到。那如果請後端就更貴了，後端大概沒有9萬，8、9萬請不到。這些就是工程師，就是有關於網頁工程師的現在的一些算是一些薪資的比例。所以這兩個不一樣的工程師的專業發展也不一樣。

會有人同時都會嗎？有，會有人同時都會。但前端比較偏設計，比較偏，要比如說就是我們一般民眾，去網頁上面可能看到漂亮的按鍵，或是那種，美編也是算前端。那些其實都屬於前端，或是按這一個會跳到哪一個頁面，類似這樣。

對，那些都屬於前端的工作。是，對，那前端的工作就是你只要包含是APP的介面的設計，都跟前端有關。OK，對，那以專業來分，他是就是有前後端這個之分。對，所以前端是不太會程式碼的，前端是不太會程式碼，前端主要偏設計，偏設計。那主要偏的是，有關於一些前端數據的，撥取。

例如說我們常用幾個蠻好用的，一些前端的分析工具。包含是一個叫HotjarHotjar是一個第三方的程式碼，他可以分析這個網頁的熱點圖。熱點圖，對，那什麼是熱點圖？

就是他會有一個程式，然後他會把你的網頁把它變成是，哪一些地方是滑鼠比較常點擊跟滑動的地方。然後他的區域會變成紅色，那你就可以根據這個設計的分析，去把重要的資訊、重要的文字、重要的圖片、甚至是按鈕放在那個紅色區，那你的點擊率就變高。

所以這個也是前端工程師那邊負責，然後可以請他分析的，對，這是前端工程師做的。對，那第一個是Hotjar，然後第二個是，Microsoft有個免費的，叫Microsoft Clarity。

對，那他也是一個就是有關於這方面的數據上的獲取。那我就可以知道，我們每一個的使用者，他到完這網頁以後，他會幫你錄影。還會錄影？

他會幫你錄影。然後錄影說，這個網站使用者，他是怎麼樣使用這個網站的，路徑是怎麼樣。對，他的路徑怎麼樣，他看到這網站他會怎麼點，都會根據這個數據會回推。或者是這個錄影會回推，你就可以重新去設計你的網頁的排序、網頁的排版，然後讓整個網頁變成更符合使用者的使用習慣。這個其實就是在網頁設計中，前端工程師一個很重要的工作。

我覺得網頁上比較重要的第一個環節。對，那第二個環節就會是，跟網站的排名跟排序有關。排名，你說曝光錄吧，可以這樣講嗎？其實簡單來講就是，只要是你的網站建構在網路上面。對，他都會有一個叫做評分。評分，那這個評分是誰幫你打的？是Yahoo搜尋引擎並Microsoft搜尋引擎，然後跟Google幫你打分數。就這些搜尋引擎的平台會打分數，對，他會幫你打這個分數。那他為什麼會幫你打這個分數？

因為搜尋引擎平台，他會有一個很重要的評分關鍵叫關聯性。關聯性，就舉個例子來講，我今天是一個網站他一開始這個網頁就要問你說，你是什麼類型的網站？

例如說你是一個電商網頁，你就要跟Google說，你是一個電商網頁。有點像是先領個牌的概念，對對對對。那在這樣子的過程中，你在搜尋引擎上面，他就會幫你分類到你是電商網頁。但你是分類到電商網頁的時候，他會有一個很重要的排序機制，這個機制在於你的內容，是不是跟這個你所申請的項目有關。他會去分析這個東西，對，抓取這個數據。例如說我是一個電商網頁，可我所有東西都在講政治，他就會分辨出來說這東西的關聯度不相干。你的評比就會下降，有點掛羊頭賣狗肉。對，你的評比就會下降。那這個評比下降就會影響你的，在網頁上被搜尋到的機率跟機會。

因為分數降低了，對對對對對，所以在網站的設計中。會有兩個很重要的技術，就是在做這個關聯性的，有點類似很像書籤的概念。例如說我這個書籤叫電商的書籤，電商的書籤以後他可能會分類為衣服、鞋子。 更細的分類，那這些衣服鞋子的分類還會分成什麼？哪一些衣服？

哪一些鞋子？然後再來，然後種類再下去以後，還會有大小、顏色，然後款式這種的分類方式。在網站上的架構非常重要。他有個專有名詞叫Sitemap，Sitemap在中文的翻譯應該叫網站地圖。網站地圖，那他就是一個這樣子的，有點類似樹枝這叫什麼，就叫樹狀圖的方式。然後繼續下去，一層一層的，一層一層的方式去下去的，那這種的設計類型，一共有兩種是比較重要的網站架構。所以你一開始在做網站的時候，就必須要把這兩種架構先想好，你要用哪一種架構？

第一種架構叫做金字塔架構，金字塔架構就是我剛剛講的，例如說我現在是電商，電商有分鞋子、褲子、衣服、太陽眼鏡。好假設是這樣，然後根據衣服類的，我就把它放成一個區塊，所有跟衣服類就放一個區塊，所有跟褲子類我就放一個區塊，這種叫做金字塔架構。那第二種架構比較特別，第二種架構叫做煙囪型。

煙囪型，對，煙囪型的架構，它會有一個很重要的環節，是它是以分類詞的方式來做。例如說男性配件、女性配件、兒童配件，所以男性配件有男性的衣服，女性配件有女性的衣服，兒童配件有兒童的衣服。

所以它不是把衣服拆開來的這種架構，這種叫做煙囪型架構。那煙囪型架構會有一個比較好的地方，我們在做網站的時候會比較喜歡用煙囪型架構，就是它可以互導。例如說我現在講完男性配件，那我可不可以在這個的關聯性的一些衣服上面，可以拉女性的衣服，或者是兒童的衣服。

所以它最後會有一個連貫型的這種方式，這種目前來講對於SEO是比較好的，這一種會對SEO。對，但其實兩種對SEO都不錯，其實都可以增加網站的排序。所以很多人都問我說，就是怎麼樣去建一個網站，建一個網站最重要的部分，就是一開始就要把這個柱狀圖做好。

做完了以後，你這樣子對於網站的評分才會比較高，有點像是前期規劃，就要都先想好，後面就是照著規劃來走。對，對，對，對。不然你的SEO會非常難做。了解，其實以今天你真的也聽了蠻多，因為以我一個資訊小白，或是真的只是網頁的使用者，頂多就只是工程師開了一個後台，讓我可以更新我的最新消息，就這樣而已，對。

但今天聽了好多，好像從前端到後端，然後到剛剛這個規劃的柱狀圖，或者是什麼煙囪類的這種東西。對，其實這個也回歸到我們的聽眾，應該說很多都是自己在開店或是當老闆，其實都有這樣的網頁的需求。不管說現在有沒有網頁，因為現在這個時代，其實網頁算是一個大家都會去使用的一個媒介。

對，剛剛Jeden所說的這些東西也真的是博大精深，或者是說今天可能才提到了一點、一點皮毛，所以還是要幫聽眾們問一下。覺得如果對於這種網頁想要再更深入了解，或者是說真的有機會是請Jayden這邊可以再去針對網頁設計這一塊，有沒有什麼樣的給我們聽眾的，要怎麼講，不能講建議嗎？建議或福利，或者說Jayden這邊有沒有提供一些比如說哪些的服務，可以更深入的。

服務基本上可以來問我，就是你想要做的內容，主要還是做網頁目標的，因為目標還是有分，to B端跟to C端。它到底是給企業端看的，還是給一般的消費者看，這個又都不一樣，又都不一樣。

所以網站的內容，其實它很複雜，我覺得就很複雜。最重要的東西是這樣，就是不要為了做網站而做網站。因為網站真的很貴，不要為了做而做，因為客製化的網站，我們講就是全部都要照著我的方式，然後整個客製化，大概要20萬左右。

起跳，15萬起跳，這是完全客製化。如果你是套版的話，你可能就是看到這個版型，我很喜歡選的，大概也要8萬塊。所以很貴，但大多數這種套版是，如果你沒有做，剛剛我講的那兩個，就是你對你的內容不是很熟悉，你到底要做什麼東西，這樣子你想要做SEO會非常辛苦，基本上就是 有點被套住，它就是長這樣，就是套版類的這樣，不是，是我的分類，分類不清楚。

對於SEO而言，它會非常難做連結，你整個關聯性就會很低。所以你整個網站上面的SEO的評分就很低，就算做了SEO的內容，也不會被收錄進去，或者也不會容易被排名上能夠被拉起來，就會比較困難一點。

所以很多人在說要做SEO，就是做這種。關於搜尋引擎優化，我只做文章可不可以？不行。基本上網站的分數佔的比例非常重，OK。有點它是就是主體或是佔了一大部分的分數，對？網站沒有架好，不要講沒有架好，就是架的東西跟那個分數沒連結，內容再好或什麼，加分也不會，對？他就會覺得這個客戶搜尋的內容沒有關聯，那沒有關聯性就會很麻煩。

所以就是一環扣一環，是的。好啊，那其實也是，因為今天短短的時間，先把這個網頁設計，網頁製作的部分，先做了一個初步的介紹。

那其實覺得我們這邊也是有在接這個，算是網頁設計比較少，網頁製作比較少，我會發包給我的朋友，就是都有相關的資源。因為聽眾，或是說現在行銷的問題，真的百百種，對？那網頁真的也是大家第一個可能會想到：我要弄網頁，我要弄網站，可是都沒有頭緒，只是一個很單純的，不知道怎麼做。那其實都可以，再來留言告訴我們，或是私訊我們，我們如果有機會的話，都可以幫忙你的網頁，可以再優化一點，或是可以分數高一點，對不對？

達到行銷的功能，看能不能幫上忙，如果能夠幫上忙的話就OK，沒問題，沒問題，就可以來問問看，真的。好，那今天時間差不多，那我是Chair，我是Jayden，我們下次見，我是銷波快，我們下次見，拜拜。