數位發展部 113 年度政府網站易用性測試建議報告

pdf
967.75 KB
42 頁
中華軟協-陳吟瑄
侵權投訴
加載中. ..
PDF
background image

 

 

數位發展部

 

 
 
 
 
 
 

113 年度政府網站易用性測試建議報告 

 
 
 

OOOOOO 

招生專區

 

 
 
 
 
 
 

執行單位:中華民國資訊軟體協會

 

中華民國

114 年 9 月 

background image

 

修訂歷史

 

 

版本

  制/修訂人員 

變更內容摘要

 

提供日期

 

1.0 

CISA 

初版制訂

 

114.9.24 

 

 

 

 

 

 

 

 

 

 

 

 

background image

 

審查意見修改對照表

 

 

項次

 

審查意見

 

回覆說明

 

對應頁次

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 
 

 

background image

 

表目錄

 

 

1

 

:測試成員相關背景

 ....................................................................................... 5

 

2

 

:關鍵步驟遇到的困難及使用行為

 ............................................................... 6

 

3

 

:測試成員操作服務時間與問題個數

 ........................................................... 7

 

4

 

:網站使用者體驗量表

 ................................................................................... 8

 

5

 

:網站服務優化順序

 ..................................................................................... 23

 

 

 

圖目錄

 

 

1

 

:「

OOOOOO-招生專區」服務流程關鍵步驟 .............................................. 4

 

2

 

google 搜尋畫面 ......................................................................................... 11

 

3

 

:首頁第一個畫面只有一個按鈕、圖片

 ..................................................... 12

 

4

 

:招生專區頁面

 ............................................................................................. 13

 

5

 

:點入

114 學年度軍事學校士官二專班聯合招生簡章 ............................. 13

 

6

 

:點入招生即時資訊頁面

 ............................................................................. 14

 

7

 

:士官二專班介紹頁面

 ................................................................................. 15

 

8

 

:招生即時資訊頁面

 ..................................................................................... 17

 

9

 

:網址名稱說明示意圖

 ................................................................................. 18

 

10

 

:主副標明確示意圖

 ..................................................................................... 19

 

11

 

:視線引導示意圖

 ......................................................................................... 22

 

background image

一、緣起

 

資訊科技應用蓬勃發展,民眾的日常生活與網路的連結越來越密切,

政府網站設計良窳影響民眾對機關服務的觀感與評價,協助機關瞭解民眾

的使用感受,其中網站易用性測試

(Usability Test)扮演至關重要的角色。依

據國際

ISO  9241 的定義,易用性為服務的使用者在特定情境中為達特定

目標,其所需具 備之有效性

(Effectiveness)、效率(Efficiency)與滿意度

(Satisfaction)。易用性大師 Jakob Nielsen 曾撰寫系統易用性基本框架

1

中指出易用性係代表系統服務功能提供輕易與愉快的使用程度,且包含易

(Learnability)、易記(Memorability)、避免錯誤(Errors)、效率(Efficiency)

及滿意度

(Satisfaction)等元素。因此,易用性測試即是測試上述 5 個面向

之內容,檢視服務對於使用者的表現。

 

為協助機關提升網站服務易用性與親和性,數位發展部

113 年度政府

網站易用性測試服務,以生活輔助、求學進修、生育保健及購屋遷徙等民

眾須經常造訪、申辦及查詢之網站為推動標的,期望透過群眾智慧測試機

制,提供機關便捷的網站使用者測試服務,降低機關網站導入使用者測試

門檻,以有效提升機關網站服務體驗。同時,為普及推廣政府網站易用性

之設計理念,本測試成果報告置於政府網站交流平臺分享予各機關參考。

 

 

 

 

 

1

  資料來源:Jakob Nielsen,系統易用性基本框架,https://reurl.cc/O0zKpX。 

background image

二、目的

 

機關經由政府網站易用性測試服務,瞭解使用者對網站服務的認知理

解、情緒感受及阻礙問題,並可參考設計專家建議,研擬網站精進之方向,

從而提升網站服務易用性與親和性,建構以民為本的政府網站服務環境。

 

 

三、測試方法

 

依據「政府網站服務管理規範」附錄一:使用者中心設計建議。易用

性測試為執行步驟的關鍵任務之一,經常用來作為檢驗網站設計是否具有

良好的使用者體驗,目的是檢視既有的網站與服務,其使用者在操作的過

程上碰到什麼問題與阻礙。測試步驟如下:

 

(一)說明測試目的與注意事項:讓測試者瞭解測試目的為協助機關提升網站

易用性,並提醒測試者測試前不須過度準備與檢視網站任務,同時測試

過程需須透過側錄軟體進行側錄。

 

(二)執行任務:本測試採用放聲思考法作為評核方法,完成指派之任務。放

聲思考法為引導使用者在每一個互動過程中,將其內心的想法用語言表

達,幫助設計專家掌握使用者心理。

 

(三)填寫測試結果紀錄表:請測試者寫下每個步驟操作當下的狀況。 

(四)填寫網站使用者體驗量表:請測試者填寫網站使用者體驗量表,測量使

用者使用服務的感受程度。

 

(五)分析並提供建議:設計專家進行評估,依測試結果剖析流程可改善之方

法。

 

(六)彙整測試結果:進行彙整建議草案並提供受測單位確認。 

 

 

background image

四、測試需求

 

(一)基本資料 

1.申請單位:OOOOOO 

2.申請時間:2025 年 3 月 6 日 

3.網站名稱:OOOOOO 

4.網址:OOOOO 

5.網站目標族群:學生、校友、政府人員及一般民眾 

(二)測試標的 

1.服務名稱:招生專區 

2.服務目的:節省欲了解本校特色時間,可快速查詢招生報名訊息

所需精簡化

 

3.測試目的:整體網站架構及服務,是否能達到想欲報名就讀軍校

瞭解程度

 

4.預計完成操作時間:10 分鐘 

5.預期服務產出:更快速知悉報名流程及資訊,報名本校成功後,

持續追蹤報名者。

 

 

 

background image

五、測試服務流程

 

目前服務流程需操作

5 個關鍵步驟,如下圖 1。 

 

1 :「OOOOOO-招生專區」服務流程關鍵步驟 

 

 

background image

六、測試成員背景

 

測試需求網站為學生、校友、政府人員及一般民眾,本案測試者皆符

合目標族群。

5 位一般民眾與 1 位設計專家(如表 1)進行機關網站易用性測

試。

 

1 :測試成員相關背景 

測試成員

 

性別

 

年齡

 

居住地

 

職業

 

使用電腦

 

時間長度

 

測試者

男性

 

26 歲 

雲林縣

 

工程研發

人員

 

6 小時/天 

測試者

男性

 

41 歲 

臺中市

 

行政

/總務

人員

 

10 小時/天 

測試者

女性

 

22 歲 

臺中市

 

學生

 

10 小時/天 

測試者

男性

 

31 歲 

桃園市

 

軍警消防

人員

 

4 小時/天 

測試者

男性

 

31 歲 

新北市

 

學生

 

6 小時/天 

設計專家

 

女性

 

23 歲

 

臺中市

 

設計師

 

6 小時/天

 

 

 

background image

七、測試結果分析

 

(一)測試紀錄彙整 

1.關鍵步驟遇到的困難及使用行為,彙整如下表 2。

 

2 :關鍵步驟遇到的困難及使用行為 

關鍵步驟

 

遇到的困難

 

順利的原因

 

須注意的狀況

 

1  搜尋到網站 

測 試 者 五 在 搜 尋 時

發現標題是網址,雖

然 有 點 困 惑 但 看 懂

是政府網站,所以有

認出來。 

其 他 人 在

google

搜 尋 看 到 的 標 題

是正常的。 

 

點入首頁,

尋找報名相

關資訊 

1.測試者二因誤點彈
跳 即 時 廣 告 連 到 不

同地方、測試者五很

難關掉彈窗。 
2.除了測試者五其他

人 都 忽 略 了 首 頁 第

一 個 畫 面 的 考 生 報

名鈕,使用者需要引

導才會想要點擊,只

要 在 首 頁 有 發 現 後

續的流程快非常多。 

無 

報 名 資 訊 入 口 很

多,測試者一透過

首頁報名資訊進入

詳 細 頁 、 測 試 者

二、三、四透過招

生 專 區 進 入 詳 細

頁、測試者五從首

頁按鈕進入、設計

專家從教學單位進

入詳細頁,所有人

對於報名相關資訊

的理解都不一樣,

在不同路徑中得到

的資訊都不相等。 

瀏覽報名詳

細資訊 

測試者一、五往下滑

了 很 久 才 看 到 跟 自

己相關的資訊。 

設 計 專 家 快 速 瀏 覽

完 頁 面 對 於 正 期

快速瀏覽過去,沒

有 注 意 太 多 內

容,報名系統按鈕

明顯。 

測試者一不小心誤

點技優加分連結而

跳到別的頁面造成

困擾。 

測試者四從招生專

background image

關鍵步驟

 

遇到的困難

 

順利的原因

 

須注意的狀況

 

班 、 二 專 班 有 點 疑

惑。 

區 點 選 文 章 「 114

學年度軍事學校士

官二專班聯合招生

簡章」沒辦法在此

頁 面 看 到 詳 細 資

訊 、 只 能 下 載 簡

章,感到有點困惑。 

進入報名系

統 

無 

所 有 人 看 到 報 名

按 鈕 都 能 夠 辨 識

並且進入系統 

 

 

2.測試者操作此服務時間較機關單位預期少 4 分鐘,完成平均時間:

6 分鐘。測試成員操作服務時間與問題個數如表 3。 

3 :測試成員操作服務時間與問題個數 

測試成員

 

測試完成時間

 

可透過其他方式獲
得所須資訊之問題

個數

 

無法自行解決之

 

問題個數

 

測試者

3 分鐘 

測試者

12 分鐘 

測試者

10 分鐘 

測試者

4 分鐘 

測試者

2 分 30 秒 

設計專家

 

4 分 30 秒 

 
 

 

background image

3.透過網站使用者體驗量表瞭解使用者的認同程度,本服務各構面

可靠性均值

4.10、回應性均值 3.70、保證性均值 3.85、體貼性均

3.65、易用性均值 3.88、資訊品質均值 4.20,如表 4。 

使用者的感受來自於使用網站的總體印象,此測量為一般民眾使

用網站服務後施行,對每個題目進行

1–5 點評分,各問項評分參考

李克特五點尺度,衡量政府機關網站之使用者體驗績效,

1 為「非常

不同意」

2 為「不同意」,3 為「普通」,4 為「同意」,5 為「非常同

意」。

3.5 分介於「普通」與「同意」之中間,故以此做為及格分數。 

4 :網站使用者體驗量表 

評量

構面

 

 

項目

 

測試者

1 評分 

測試者

2 評分 

測試者

3 評分 

測試者

4 評分 

測試者

5 評分 

 

 

 

此政府網站向民眾承諾在某一時間

內完成某些事時,他們會做到

(訊息

發布、線上申請的項目在預定時間

內完成等

我操作此政府網站遇到問題時,網

站能協助我解決問題

(提供 Q&A、

線上客服及操作提示等

3  此政府網站能提供正確的導引 

此政府網站會正確紀錄我申請的服

務資訊

 

各測試者均值

 

3.25 

3.75 

4.5 

構面均值

 

4.10 

 

 

 

此政府網站可以明確告知民眾申辦

服務須要的作業的時間

 

此政府網站可以提供立即的回應

(提供查詢功能、線上即時客服等) 

此政府網站的線上或臨櫃客服人員

總是願意協助民眾

 

此政府網站的線上或臨櫃客服人員

不會忙到無法提供服務

 

background image

評量

構面

 

 

項目

 

測試者

1 評分 

測試者

2 評分 

測試者

3 評分 

測試者

4 評分 

測試者

5 評分 

各測試者均值

 

3.5 

2.25 

3.5 

4.25 

構面均值

 

3.70 

 

 

 

9  此政府網站值得信賴的 

10 

我在此政府網站線上或臨櫃,申辦

或操作時覺得安全

 

11 

此政府網站的線上或臨櫃客服人員

的回覆是有禮貌的

 

12 

此政府網站的線上或臨櫃客服人員

具備足夠的知識,回答民眾的問題

 

各測試者均值

 

2.75 

4.25 

4.25 

構面均值

 

3.85 

 

 

 

13 

此政府網站會針對民眾條件提供個

別的服務

(提供老人津貼、勞保明細

表,或提供查詢交通路線

/時段等申

辦服務

14 

承上題,此政府網站提供的資訊或

線上服務已瞭解民眾的需求,並優

先考慮民眾的利益

 

15 

承上題,此政府網站會給予民眾各

別的關懷

 

16 

此政府網站提供民眾方便使用網站

的時間

 

各測試者均值

 

4.5 

3.25 

4.5 

構面均值

 

3.65 

 

 

 

17  我認為我會經常使用此網站 

18  我覺得此網站是簡單的 

19  我認為此網站很容易使用 

20 

我不需要有人幫助就能使用這個網

 

21  我覺得此網站的功能整合得很好 

22  我覺得此網站很一致 

23 

我認為大多數的人可以很快地學會

使用此網站

 

background image

10 

評量

構面

 

 

項目

 

測試者

1 評分 

測試者

2 評分 

測試者

3 評分 

測試者

4 評分 

測試者

5 評分 

24  我覺得此網站使用起來並不麻煩 

25  我有自信能使用此網站 

26 

我不需要學習很多事情,就能使用

此網站

 

各測試者均值

 

4.6 

2.9 

3.9 

3.8 

4.2 

構面均值

 

3.88 

 

 

 

 

27  此網站提供的資訊是正確的 

28  此網站提供的資訊是最新的 

29  此網站提供的資訊是相關的 

30  此網站提供的資訊是容易瞭解的 

各測試者均值

 

4.25 

4.75 

構面均值

 

4.20 

 

(二)關鍵議題 

根據使用者測試的結果

(請參見附件一),整理出 5 項關鍵議題,以

下內容為參考範例。

 

1.搜尋畫面標題缺乏官方機構識別 

當使用者透過

Google 搜尋「OOOOOO」時,搜尋結果頁面顯

示的網站標題是網址格式(

ooooo.edu.tw)

,而非「

OOOOOOOOO」

具有明確機構識別的標題。這種標題呈現方式讓一般人無法確定是

否搜尋到正確的官方網站,可能會懷疑網站的真實性和權威性。

 

background image

11 

 

2 :google 搜尋畫面 

 

2.首頁缺乏有效的報名入口引導 

首頁第一個畫面僅呈現照片搭配單一按鈕的設計,缺乏足夠的

考生相關資訊說明。使用者面對「考生報名」按鈕時,因無法預知

點擊後的頁面內容與功能,產生操作疑慮,導致原本應為網站核心

功能的報名入口失去應有效用,此設計問題使首頁最重要的版面區

域未能發揮預期的引導作用。

 

background image

12 

 

3 :首頁第一個畫面只有一個按鈕、圖片 

 

3.報名資訊存在多重路徑但缺乏統一性 

當使用者於首頁點選「招生專區」後,點擊「招生即時資訊」

能夠在網頁上直接瀏覽到較完整的招生資訊;但點擊「

114 學年度

軍事學校士官二專班聯合招生簡章」時,卻只能透過下載

PDF 檔

案才能獲得完整內容。這種不一致的資訊提供方式造成使用者無法

預期每個連結背後的資訊取得方式,增加了資訊獲取的不確定性。

 

background image

13 

 

4 :招生專區頁面 

 

5 :點入 114 學年度軍事學校士官二專班聯合招生簡章 

background image

14 

 

6 :點入招生即時資訊頁面 

background image

15 

4.資訊缺乏引導順序與閱讀路徑 

使用者進入士官二專班頁面後,面對大量分散的資訊內容,缺

乏明確的閱讀順序指引,不知道應該從哪個區塊開始瀏覽才能最有

效率地獲得完整資訊。頁面內容雖然豐富,但缺乏邏輯性的資訊層

級安排,導致使用者可能遺漏重要資訊,或花費過多時間在次要內

容上,無法建立對士官二專班的系統性認知。

 

 

7 :士官二專班介紹頁面 

background image

16 

5.不同招生管道資訊混在一起 

(1) 兩個完全不同的資訊放在同一頁 

二專班與正期班的招生資訊被整合在同一個頁面中,缺乏明顯

的視覺區隔或標示,使用者需要仔細閱讀每個區塊的內容才能判斷

哪些資訊與自己的需求相關,大幅增加了資訊篩選的時間成本。

 

(2) 圖片與對應資訊內容相隔很遠 

正期班、二專班的

DM 宣傳圖片與其對應的詳細文字介紹在版

面上分開,使用者在看到兩個招生班別的

DM 時,可能不知道這兩

個班的差別而感到困惑,需要向下滾動到文字部分才能獲得想要的

詳細資訊。這種圖文分離的配置增加了使用者理解和比較的認知負

擔,無法在初次接觸時就建立清楚的認知。

 

background image

17 

 

8 :招生即時資訊頁面 

background image

18 

八、建議方案

 

 

OOOOOO 之「招生專區」,根據測試結果分析,歸納出五大關鍵議

題:「搜尋畫面標題缺乏官方機構識別」、「首頁缺乏有效的引導」、「報

名資訊存在多重路徑但缺乏統一性」

「資訊缺乏引導順序與閱讀路徑」

「不同招生管道的資訊混在一起」。整理出五大建議方案,詳細說明如

下:

 

(一)修改網址名稱、新增對網站的說明 

從技術性網址

https://www.ooooo.edu.tw/tw/index.php 改為「中華民

OOOOOO」,新增內容介紹增加使用者對網站的信任感。 

 

9 :網址名稱說明示意圖 

 

background image

19 

(二)建立多層次服務分類說明機制 

1.增設主標題與副標題系統,設置清楚的主標題,如【114 學年度

OOOOOO 招生】,讓使用者立即理解當前頁面主題搭配副標題說

明核心價值主張。

(參考圖 10) 

2.顯示報名解只時間等時效性資訊,創造適度的行動。 

 

10  :主副標明確示意圖 

 

(三)發布招生資訊時有一致的邏輯 

1.所有招生相關文章都必須提供【網頁版內容摘要+PDF 完整版下載】 

網頁版提供核心資訊

(報名條件、重要日期、聯絡方式、附件),PDF

版本提供詳細條文

 

2.相關文章內容標準化,標題有「招生」、「報名」、「簡章」等關鍵

字的文章,都必須包含基本要素:

 

  報名資格條件 

background image

20 

  報名時間與方式 

  錄取標準與名額 

  聯絡資訊與諮詢管道 

  相關連結附件 

background image

21 

(四)建立清晰的資訊引導機制與閱讀路徑  (圖 11 示意) 

1.建立基本認知(頁面上方區塊):  將學校背景、辦學理念、歷史

沿革放在最上方,讓使用者先建立對

OOOOOO 的基本認知與信任

  地理位置說明:  提供學校位置、交通資訊、校園環境介紹,

幫助使用者建立具體的空間概念

  活動紀實展示:  透過校園生活

照片、學生活動影片、重要典禮紀錄等,讓使用者對校園文化與

學習環境有感性認知。

 

2.招生資訊與決策支援(頁面中段區塊)  招生資訊集中呈現:  將

報名條件、考試科目、重要日期、錄取標準等核心資訊整合在此

區塊

  報名流程指引:  清楚說明「如何報名」的具體步驟,包含

線上報名連結、所需文件、繳費方式等。

 

3.行動支援與聯絡資訊(頁面下方區塊):當使用者完成前兩階段的

資訊瀏覽後,進入「有問題想詢問」的需求階段,提供多元聯絡

方式:

  提供電話、email、線上客服、滿足各種諮詢需求  即時支

援強調。

 

background image

22 

 

11  :視線引導示意圖 

 

background image

23 

(五)優化招生資訊的視覺區隔與圖文配置 

1.文字較容易閱讀,能夠快速瀏覽應該先放在網頁上方,詳細 DM

相關資料應該方在下面作為參考,避免使用者需要滑很久

 

2.兩種類似資訊放在一起時需要更簡單的圖片示意,並且圖片和文

字放在一起,兩種資訊的顏色也可做區分。

 

5 :網站服務優化順序 

 

九、結語

 

本易用性測試以評估網站服務流程現況為基礎,分析使用者測試結果,

彙整使用過程之關鍵議題,提出協助服務提供者與服務使用者省工、省時

之建議,依據改善優先順序列點如下:

 

關鍵議題 

建議方案 

優化順序 

易用性面向 

搜尋畫面標題缺乏

官方機構識別 

修改網址名稱、新增對網

站的說明 

滿意度 

首頁缺乏有效的引

導 

優化首頁第一畫面的資訊

引導與功能說明 

引導性、可發現

性 

報名資訊存在多重

路徑但缺乏統一性 

發布招生資訊時有一致的

邏輯 

一致性、可預測

性 

資訊缺乏引導順序

與閱讀路徑 

建立清晰的資訊引導機制

與閱讀路徑 

效率、認知負擔 

不同招生管道的資

訊混在一起 

優化招生資訊的視覺區隔

與圖文配置 

效率、滿意度 

background image

24 

A.修改網址名稱、新增對網站的說明 

B.優化首頁第一畫面的資訊引導與功能說明 

C.發布招生資訊時有一致的邏輯 

D.優化招生資訊的視覺區隔與圖文配置 

E.建立清晰的資訊引導機制與閱讀路徑 

以上建議方案提供

OOOOOO「招生專區」服務未來精進方向與設計

參考,建議後續會同利害關係人

(包含服務提供者、服務使用者、系統開

發廠商等

)一同研擬實際可落實之執行細節,讓政府網站服務品質更臻完

善。

 

background image

25 

附件一:測試紀錄表

 

測試狀況數字與方框底色代表意義如下。

 

1(白底色)表示:順利完成; 

2(黃底色)表示:有一些問題但可自行解決; 

3(紅底色)表示:無法完成,如無法進入下一頁或是選錯。 

 

測試者

1: 

稱 

首頁 

首頁(關閉廣告) 

首頁往下滑 

進入報考資訊分頁 

不小心進入技優加分

連結 

回到報考資訊分頁 

圖 

 

 

 

 

 

 

1.成功進入首

頁,看到

OOOO

許多訊息。順便查

找國軍士官報名

訊息。 

2.沒有直接找到

對應的關鍵字,不

確定要不要按考

生報名,決定再多

看一下網頁。 

1.找到報告資訊而且

有加圖示

icon 的決定

按這個,進去再找看

看。 

2.沒有直接看到國軍

士官二專班資訊,決定

繼續往下滑。 

3.想說可能點這邊,也

有可能看到報名連

結,就點進來了。最後

再返回前一頁找尋真

正的連結。 

1.找到線上報名系統,

點擊右邊的國軍士官二

專班的網路報名,進入

正確的報名系統。 

收藏 ⬇️ 下載