用Excel製作網站分析儀表板的設計思路

<h1>&nbsp;</h1><p>在全球網路普及率逐漸提高的現在，越來越多的網站如雨後春筍般地紛紛探頭冒出，網站經營者無不希望自家網站流量漸漸上升，也因此需要網站分析儀表板來協助管控網站表現，讓經營者有能力即時掌控網站流量情形，進而調整決策。</p><p>此儀表板建立在假想資料上，主要目的是分享網站分析儀表板的設計思路，工具不局限於Excel，此篇文章僅以Excel作為工具範例，因此可能會因工具功能限制而與實務上使用的儀表板有些微不同。</p><p>若對如何用Excel製作此儀表板有興趣，可以至這裡了解製作步驟。</p><figure class="image"><img src="/imagefiles/dashboard-excel-website-analysis-1.png"><figcaption>excel</figcaption></figure><h4>背景說明</h4><p>我是資料視覺化網站FactsViz的創辦人，我想透過建立網站分析儀表板追蹤自家網站的表現，想知道網站前景是否良好，以網頁瀏覽量作為主要評估指標。</p><h4>需求</h4><ul><li>了解網站從上線到現在的瀏覽量趨勢，不斷增加還是逐漸下滑，若是負面的趨勢，可能需要盡快找出原因。</li><li>了解網站整體（或特定主題）的瀏覽量與所有文章數量。</li><li>了解一週中星期幾或一天中何時的瀏覽量較高，作為下次增添新文章時機點的參考。</li><li>了解在五個主題中，哪個主題比較受歡迎，且在所有文章中，哪些文章最熱門，以透過增加該主題與種類的文章，提高網站整體的瀏覽量。</li></ul><h4>使用方法</h4><p><strong>1. 視線引導</strong></p><p>使用者在最初觀看此儀表板時，會習慣從左上角開始，再看往右上角，接著視線來到左下角，最後才是右下角，類似英文字母「Z」的形狀。因此最重要的資訊放在左上角，最不重要的資訊放在右下角。</p><p><strong>2. 使用頻率</strong></p><p>因為此儀表板的主要使用者為網站創辦人，通常為了監控網站表現會每日使用，因而設計時不需擔心使用者不熟悉儀表板，可以大膽地將篩選器或標題等次重要資訊放到不顯眼的地方。</p><p><strong>3. 圖表用途</strong></p><p>此儀表板以多種不同角度呈現「網頁瀏覽量」，包含網站整體（或特定主題）的瀏覽量、以時間呈現變化的「瀏覽量變化折線圖」、以一日各時段與一週各日切入的「每日各小時瀏覽量長條圖」和「一週瀏覽量長條圖」、比較主題瀏覽量的「主題瀏覽量橫條圖」，以及比較所有文章瀏覽量的「熱門文章表格」。</p><p>使用者可利用「瀏覽量變化折線圖」了解瀏覽量從上線以來的趨勢，且可從白色趨勢線得知趨勢的方向，同時運用Excel提供的工具提示功能，將游標移至資料線上，即可看到該日期的瀏覽量。得利於工具提示功能，我們將圖表的縱軸、刻度線與資料標籤移除，降低圖表複雜度。</p><p>「每日各小時瀏覽量長條圖」和「一週瀏覽量長條圖」則提供使用者從時間的角度剖析瀏覽量數據，透過這兩個圖表，使用者可以了解在一週中的哪天以及在一天中的哪個時間段瀏覽量較高，作為上傳新文章時機點的參考依據。</p><p>使用者可從「主題瀏覽量橫條圖」與「熱門文章表格」中了解較受歡迎的文章主題與內容，如此一來就能多多發表熱門主題與內容的文章，吸引讀者提高瀏覽量。</p><p><strong>4. 資料切片</strong></p><p>使用者可透過右上角的篩選器，選擇不同主題以個別查看不同主題的瀏覽量表現與文章數量，作為挑選未來新文章主題的參考。當該主題被選定後，其會變成白底黑字的格式，在儀表板黑色背景的襯托下較為搶眼，方便使用者注意到。</p><p><strong>5. 資料更新</strong></p><p>點擊在儀表板右上角的「更新」按鈕，即可更新全部資料，且其左邊會顯示上一次更新時間，使用者使用儀表板時可依照需求更新資料。</p><p>&nbsp;</p><h4>為何有效</h4><p><strong>1. 用不同圖表呈現同一指標，有利於理解</strong></p><p>此儀表板運用折線圖、長條圖與橫條圖呈現單一指標「網頁瀏覽量」，有利於使用者從各個角度理解瀏覽量表現，且因為只呈現單一指標（除了文章數量指標），使用者無需花費時間適應多種數據，只需專注於一個指標上即可了解網站表現。</p><p><strong>2. 只使用單一顏色，降低畫面雜亂程度</strong></p><p>此儀表板使用色彩印象理性的藍色作為唯一的色彩，暗示使用者關注藍色的部分，有效降低畫面雜亂程度。通常若儀表板只呈現一個色彩時，可選擇網站代表色，此例中FactsViz網站的主色是有著積極色彩印象的紅色，但此處考量到人眼看紅色久了容易產生視覺疲勞，且紅色也代表著危險警示的印象，不符合此儀表板的情境，因此選擇看起來較理性平靜的藍色。</p><p>另外，圖表中使用藍色「線段」呈現資料，但右上角的更新資料按鈕以藍色「背景」顯示，意圖區分圖表與按鈕，暗示使用者兩者為不同東西。</p><p><strong>3. 依照實際使用方式調整圖表細節</strong></p><p>在「瀏覽量變化折線圖」方面，若使用長條圖呈現每日瀏覽量趨勢，畫面會因數據量太多顯得雜亂，因此採用折線圖呈現趨勢，且縮小線段寬度以更清晰地顯示每日數據。另外，折線圖的水平軸標籤以月為單位，且只顯示每月一日的標籤，簡化標籤有利於使用者不分心地快速理解圖表。</p><p>在「每日各小時瀏覽量長條圖」中，水平軸標籤預設是由數值0開始，代表午夜12點，不符合一般人起床的時間，因此修改為以數值6開始，代表早上6點，方便使用者聯想訪客活動開始的時間，更有利於理解。</p><p>在「熱門文章表格」中，右側預留空間給長標題，且降低標題字型大小，並將該文章瀏覽量數據置於標題前方，避免標題過長影響到瀏覽量數據的呈現。</p><p><strong>4. 清晰簡單的設計，移除不重要資訊</strong></p><p>每個圖表皆無顯示垂直軸線與刻度線，而是利用資料標籤與工具提示功能讓使用者讀取瀏覽量數據，此舉可降低畫面中線段的存在，不讓使用者感覺空間被割裂，提高畫面美感。</p><p>在長條圖與橫條圖中，將大面積的藍色替換成藍色框線，讓圖表可在提供條狀物面積比較之餘，不至於因大面積顏色搶奪使用者的注意力。</p><p>右上角的資料更新時間只顯示至分鐘而非秒數，簡化數據只提供有用處的數據，有利於使用者快速理解。</p>