說明

注意

此設計指南是針對 Windows 7 所建立,但尚未針對較新版本的 Windows 更新。 大部分的指導方針仍適用主體,但簡報和範例不會反映 我們目前的設計指導方針

使用 [說明] 作為次要機制,協助使用者完成並進一步瞭解主要機制為 UI 本身的工作。 套用這些指導方針,讓內容真正有用且容易找到。

說明系統是由不同類型的內容所組成,其設計目的是在使用者無法完成工作時協助使用者、想要更詳細地瞭解概念,或需要比 UI 中可用的更多技術詳細資料。

在本文中,我們將說明稱為 UI 的次要複本。 UI 是主要,因為這是使用者第一次嘗試解決問題的位置。 只有在無法使用 UI 完成工作時,他們才會諮詢說明系統。

Windows 說明及支援頁面的螢幕擷取畫面

Windows 說明及支援首頁可從 [開始] 功能表取得。

注意:與樣式和語調相關的指導方針會在個別的文章中呈現。

這是正確的使用者介面嗎?

若要決定使用時機,請考量下列問題:

  • 您的目標使用者有多動機? 他們更積極探索程式的功能,並成為中級或甚至進階使用者,他們更願意藉由諮詢說明主題來研究其問題的解答。
  • 您是否使用說明來修正不正確的 UI? 您的 UI 越好,使用者會尋求其他協助越少。 如果您的程式非常清楚、實用的主要 UI (,例如無術語的錯誤訊息、撰寫良好的精靈,以及明確的對話方塊) ,您可能完全不需要次要說明系統。
  • 您的程式是否相對簡單? 若是如此,請考慮將所有必要的協助內容併入主要 UI 介面中。 使用者更可能尋求執行複雜工作之程式中的其他協助。
  • 您的應用程式是否適用于開發人員、IT 專業人員或其他軟體專家? 這些使用者通常會預期程式設計語言慣例的參考說明,以及功能主控的深入概念說明。

設計概念

如果您決定在程式中納入說明,請將它整合到整體設計中。 說明介面應該是簡單、有效率且相關的;它應該可讓使用者輕鬆取得協助,然後返回其工作。 以使用者的時間考慮您的說明系統:先預期他們在程式中遇到問題的位置,然後直接將基本協助併入您的 UI,並建立清楚且一致的進入點,以解決這些問題。

Windows 協助是根據這些原則所設計。 以下是 Windows 說明使用者體驗的一些設計變更:

  • 從主要 UI 取得 [說明] 的更多可探索進入點 (特別是來自 UI 介面的新 [說明] 連結,例如對話方塊、錯誤訊息和精靈) 。 說明連結會直接帶您前往 [說明] 中的相關主題。
  • [說明] 按鈕圖示可在大部分主控台中樞頁面的右上角,以及殼層資料夾使用。
  • 使用者可以選擇在線上時,從 Windows Online 說明及支援取得最新的說明內容。
  • 說明主題現在是以工作為基礎,而不是以功能為主,讓使用者可以快速且有效率地完成其工作。
  • 說明主題現在主要是以已知的熱門使用者案例為基礎。
  • 使用真實世界語言,說明主題具有更寬鬆且非正式的 語調
  • 說明主題是專為有效掃描而設計,因為使用者很少閱讀內容文字。

說明的類比

若要更深入地思考如何設計說明系統,請考慮從日常的類比。 您在不熟悉的城市中遺失。 您該怎麼辦? 許多會像這樣回應:

  • 取得導向;尋找地標、街道標誌 (名稱和指標) 。
  • 尋找地圖。
  • 最後,作為最後一個方法,請要求路線或撥打朋友。

城市「介面」的設計會影響您需要的協助。 標示完善的街道、明確指示 (醫院、機場、旅館和辦公室) 的指標,以及清楚的地標,例如醒目地理特徵或建築物,可協助您找到路線。

您尋求協助做為最後一個手段。 這表示城市「介面」的設計不佳且令人困惑而失敗。 您比較有可能在具有建議實用性的特定標籤位置尋求協助。 例如,您更可能要求在標示為「方向」或「資訊」的位置尋求協助,而不是像城市大會這樣的一般地點,即使只有城市大會的任何人可以為您提供指示。

當您尋求協助時,機會是您感到挫折,而只是想要進入預定的目的地。 您可能沒有在情緒中花時間流覽城市,或瞭解其歷程記錄。 此外,您的動機取決於工作的重要性。 如果您嘗試尋找旅館房間,將會執行任何作業。 不過,如果您的目標是要找出次要重要性的地方,最有可能就是在稍微努力之後放棄。

在真實空間中尋找您方式的所有層面,都會對應到使用者通常會在程式的虛擬空間中找到其方式。 除了主要 UI 之外尋求協助,其本質不一定;透過設計良好的 UI 和智慧型「街道標誌」,將使用者導向所需的答案,以盡最大努力減輕這類體驗。

設計 UI 以便不需要說明

嘗試在第一個地方建立不必要的說明,方法是:

  • 輕鬆探索和執行一般工作。
  • 提供清楚 的主要指示
  • 提供清楚、簡潔的控制項標籤,這些標籤是目標和工作導向。
  • 視需要提供補充指示和說明。
  • 使用受限於有效選項的控制項、提供適當的預設值、處理所有輸入格式,以及防止錯誤,來預期可避免的問題。
  • 撰寫錯誤訊息,以提供清楚的解決方案或動作,讓使用者採取。
  • 避免造成混淆的 UI 設計,例如流程不佳的工作,或使用因無明顯原因而停用的控制項。
  • 在開發週期初期使用寫入器和編輯器,在整個程式中建立高品質且一致的 UI 文字

使用者不需要移至其他位置,即可瞭解如何使用 UI。 直接將基本資訊新增至主要 UI,而不是強制使用者離開其即時內容,並加入 [說明] 窗格。 如果重要資訊只存在於 [說明] 主題中,則使用者可能不會看到它。 如需選擇性且更說明的資訊,請使用主要 UI 的 [說明] 連結,以取得補充協助的相關說明主題。

考慮使用者動機

對於大部分的使用者而言,速度和效率是良好計畫最重要的優點之一。 使用者想要完成工作。 一般而言,他們不想要自行瞭解程式和技術;他們的耐心只會延伸,因為該程式提供自己的興趣,並解決手邊的問題。

設計說明系統以符合使用者的動機。 例如,假設有一位使用者已在一家聖地上啟動 Kiosk。 如果她無法快速瞭解如何執行工作,可能只是放棄並離開。 她不太可能花時間使用說明。 或者,高度動機的使用者對於研究說明系統以取得答案所花費的時間具有更高的承受度。 例如,必須平衡書籍的商務使用者可能願意查閱說明內容,以充分利用該新的會計應用程式。

撰寫要掃描的內容

撰寫說明主題,瞭解他們將會掃描是否有特定資訊,而不是讀取單字。 簡潔地撰寫、快速進入點,並提供使用者可採取動作的資訊。

  • 使用一致格式的編號步驟撰寫「操作說明」主題,讓使用者辨識他們正在取得程式性協助。
  • 例如,使用資料表來呈現 UI 選項或語言語法,撰寫容易掃描的參考主題。
  • 撰寫以子標題邏輯方式組織的概念性主題,讓使用者可以略過較不感興趣的整個區段。

在所有說明內容中,掃描項目符號清單比標準段落文字區塊更容易;不過,請謹慎地使用專案符號清單,而不是作為未組織材質的 Crutch。

建立重要內容

假設沒有說明系統可以預期每位使用者可能擁有的每個問題,請將大部分內容放在回答目標使用者最上層案例中的熱門問題。 例如,有效的搜尋以及如何建立網路連線能力 (與其他工作) 可能是高度搜尋的主題。 此外,請專注于您最上層使用者案例內的工作,而不是完整記錄功能或技術。

提示: 技術支援是說明內容的良好來源。 協助維護通常會記錄使用者嘗試 (的特定程式或工作,並失敗) 完成的特定程式或工作。

不需要為 UI 中的每個功能提供協助。 嘗試建立所有專案的 [說明] 通常沒有説明的結果。 如果 UI 設計良好,則大部分的 [說明] 主題都不會非常實用;它們只會重新整理明顯。

如果有一個以上的方式可以執行工作,在大部分情況下,您可以只記錄使用者最常使用的方式。 例外狀況包括協助工具考慮 (記錄滑鼠動作的鍵盤對等專案,例如) ,以及平臺考慮 (平板電腦表單規格的記錄,例如,或命令列可以取代圖形化使用者介面) 的伺服器環境。

請記住,使用者通常不會考慮他們遇到的問題,與您所遇到的詞彙完全相同。 例如,使用者可能會發現將自己視為「帳戶」很奇怪。請務必設計您的搜尋和編制索引功能,然後考慮可能術語變化和同義字。

不過,在主要 UI 與說明系統之間,如果字詞不相同,則應該非常類似。 當使用者的說明系統語言與畫面上看到的內容非常緊密相互關聯時,使用者可能會混淆。

當您從主要 UI 連結到說明主題時,請務必撰寫吸引人的說明連結文字。 清楚且特定的語言可啟發信賴度。 使用者通常會認為一般說明連結 (按鈕,其中含有「說明」或「深入瞭解」一詞,) 不會造成正確的資訊,而不需要大量投入時間。

如果您只執行五件事...

  1. 設計您的 UI,讓使用者不需要 [說明]。
  2. 將內容放在目標使用者的熱門案例中,讓您的說明很有説明。
  3. 呈現說明內容,以便輕鬆掃描。
  4. 瞭解您不需要為 UI 中的每個功能提供協助。
  5. 讓說明進入點成為可探索且吸引人的專案點。

使用模式

不同類型的內容提供不同的用途。

內容類型 範例
程式說明
提供執行工作的步驟。
程式性說明應著重于「如何」資訊,而不是「內容」或「原因」。
[刪除暫存檔] 說明頁面的螢幕擷取畫面
在此範例中,說明主題說明如何使用磁片清理公用程式的功能,並提供循序遵循的步驟。
概念說明
提供背景資訊、功能概觀或處理常式。
概念說明應該提供完成工作所需的「內容」或「原因」資訊。
[桌面 (概觀) ] 說明頁面的螢幕擷取畫面
在此範例中,說明主題會定義桌面是什麼,並提供其包含內容的其他詳細資料,以及使用者與其互動的原因。
參考說明
做為線上參考書。
您可以使用參考說明來記錄程式設計語言或程式設計介面。
[標記法慣例] 說明頁面的螢幕擷取畫面
在此範例中,說明主題會列出用於此特定語言或應用程式的印刷樣式慣例,並提供容易掃描表格中的資訊。

指導方針

進入點

  • 連結至特定相關說明主題。 請勿連結至說明首頁、目錄、搜尋結果清單,或只連結到其他頁面的頁面。 避免連結至結構化為常見問題大型清單的頁面,因為它會強制使用者搜尋符合所按一下連結的頁面。 請勿連結至與手邊工作無關且有説明的特定說明主題。 永不連結至空白頁面。

  • 請勿將 [說明] 連結放在每個視窗或頁面上,以便保持一致性。 在一個位置提供說明連結並不表示您必須在任何地方提供這些連結。

  • 使用對話方塊、錯誤訊息、精靈和屬性工作表的說明連結。 如果 [說明] 連結套用至特定控制項,請將它放在其下方,靠左對齊。 如果 [說明] 連結套用至整個視窗,請將它放在視窗內容區域的左下角。

    具有群組方塊的屬性工作表螢幕擷取畫面

    在此範例中,第二個 [說明] 連結會套用至一組控制項。

    屬性工作表和說明連結的螢幕擷取畫面

    在此範例中,說明連結會套用至整個視窗。

  • 盡可能使用說明連結,而不是說明的一般文字參考。

    正確:

    如何修復磁片錯誤?

    不正確:

    如需修復磁片錯誤的詳細資訊,請參閱說明和支援。

  • 使用 [說明] 按鈕搭配控制台專案中樞頁面的 [說明] 圖示。 將它放在右上角。 這些按鈕沒有標籤,但有可讀取說明的工具提示。

    具有說明按鈕的控制台專案的螢幕擷取畫面

    具有 [說明] 按鈕的控制台專案。

  • F1 說明是選擇性的。 使用者已習慣藉由按下 F1 鍵,在標準鍵盤上找到與 UI 立即內容相關的說明資訊。 例如,您可以包含 F1 說明,例如,可用性研究顯示您的使用者預期會找到它,或者您的程式 UI 很複雜,足以受益于內容相關的協助。

  • 具有功能表列的程式可以有 [說明] 功能表類別。 如需說明功能表指導方針,請參閱 功能表

    從功能表列存取說明的螢幕擷取畫面

    在此範例中,Windows Paint 配件有 [說明] 功能表類別。

  • 針對鍵盤協助工具,請提供 [說明] 按鈕和連結的定位停駐點。

  • 說明按鈕和連結行為應該如下所示:[說明] 窗格隨即開啟,並顯示專用的 [說明] 主題;叫用 [說明] 窗格的 UI 應該保持開啟狀態,以保留內容相關的體驗。

  • 請勿使用下列過時的說明進入點樣式:「深入瞭解」或「深入瞭解...」標題列上的連結、一般說明按鈕和內容相關的 [說明] 按鈕。 雖然他們過去已使用過,但可用性研究已判斷使用者通常會忽略它們。 請改用特定說明主題的連結。 如需撰寫良好說明連結的指導方針,請參閱 說明連結

    不正確:

    對話方塊的螢幕擷取畫面,其中包含 [深入瞭解] 連結

    請勿使用「深入瞭解」或「深入瞭解...」連結。

    不正確:

    認可按鈕旁的說明按鈕螢幕擷取畫面

    請勿使用一般 [說明] 按鈕。

    不正確:

    標題列上問號圖示的螢幕擷取畫面

    請勿在標題列上使用內容相關的 [說明] 按鈕。

Content

  • 請勿建立明顯的內容。 在主要 UI 中重複內容的說明主題不會增加值。
  • 請勿建立使用者無法以某種方式採取行動的內容。
    • 例外: 某些概念性內容提供重要的背景資訊,而不需要導向使用者動作。
  • 避免發生問題的模糊解決方式。 例如,「連絡您的系統管理員」或「重新安裝應用程式」通常會讓使用者感到挫折。
    • 例外: 如果這是唯一的實際解決方案,建議連絡系統管理員,而系統管理員預期會連絡問題。
  • 避免處理高度不太可能使用者案例的內容。 針對您預期的一般使用方式開發主要說明內容;請注意預期使用量的重要例外狀況,但將此內容視為較低優先順序。
  • 收集使用者的意見反應,以瞭解說明主題有何説明。 允許使用者為個別主題評分。 對檔進行 可用性研究 ,以確定內容的品質和可探索性問題。
    • 提示: 使用者意見反應也是產生更多以工作為基礎的內容的絕佳方式,著重于使用者實際使用程式執行的工作,而不是以功能為基礎的內容,只著重于技術的描述。
  • 提供多種方式來存取您的內容。 目錄、索引和 搜尋 機制是改善可探索性最常見的三種方法。
  • 如果有多個方法可執行工作,在大部分情況下,您可以只記錄不常見使用者所使用的最常見方式。

圖示

  • 僅針對 [總管] 視窗和控制台專案的中樞頁面使用 [說明] 圖示。 請勿搭配說明連結使用說明圖示。

正確:

具有問號圖示的視窗螢幕擷取畫面

在此範例中,Windows 檔案總管視窗會使用 [說明] 圖示來提供 [說明] 的存取權。

不正確:

左面板中有說明圖示的視窗螢幕擷取畫面

在此範例中,左下角的 [說明] 圖示不正確地與 [說明] 連結搭配使用。

Text

說明連結

  • 視需要提供說明主題內容的特定資訊,並視需要使用最相關的精簡文字。 使用者通常會忽略一般說明連結。 請確定連結的結果是可預測的使用者,不應因為結果而感到意外。

    • 例外: 您可以使用「更多資訊」來補充直接在 UI 中的指示,特別是如果在 [說明] 連結中提供特定資訊會導致不必要的重複,或使連結更不吸引人。

    不正確:

    強式密碼至少有六個混合大小寫字母、數位和符號。 什麼是強式密碼?

    正確:

    強式密碼至少有六個混合大小寫字母、數位和符號。 詳細資訊

    在不正確的範例中,說明連結是重複的。 它會詢問真正已回答的問題。

  • 可能的話,片語說明會根據說明內容所回答的主要問題連結文字。 請勿使用「深入瞭解」、「深入瞭解」或「取得協助」片語。

    不正確:

    深入瞭解新增例外狀況

    正確:

    允許例外狀況的風險為何?

    如何?新增例外狀況嗎?

    在正確的範例中,連結會以說明主題所回答的主要問題來片語。

  • 如果最相關的資訊可以簡潔地摘要,請將摘要直接放在 UI 中,而不是使用 [說明] 連結。 不過,您可以使用 [說明] 連結來提供補充資訊。

    不正確:

    連結至什麼是強式密碼的螢幕擷取畫面?

    正確:

    關於密碼的補充文字螢幕擷取畫面

    較佳:

    含有詳細資訊連結的文字螢幕擷取畫面

    正確的範例會簡潔地摘要說明說明資訊,大幅改善使用者閱讀它的可能性。 更好的範例會提供說明連結,以取得此複雜主題的詳細資訊。

  • 片語說明連結可清楚指出協助。 說明連結不應該像動作連結一樣閱讀。

  • 針對連結文字使用整個說明連結,而不只是關鍵字。

    正確:

    允許例外狀況的風險為何?

    不正確:

    允許例外狀況的風險為何?

    在正確的範例中,整個說明連結句子會用於連結文字。

    • 例外: 外部網站的說明連結應該只使用網站或頁面的名稱做為連結。 任何引進網站名稱的文字都不需要包含在連結本身中。
  • 說明連結不需要完全符合說明主題標題,但兩者之間應該有強式且明顯的連線。 基於這個理由,請以配對方式設計連結和標題。

    正確:

    如何改善此功能的效能? (連結文字)

    設定這項功能以獲得最佳效能 (主題標題)

    不正確:

    如何改善此功能的效能? (連結文字)

    此功能的完整概觀 (主題標題)

    在不正確的範例中,說明主題標題在 [說明] 連結文字的範圍中有很大的差異,而且可能會造成錯誤。

  • 如果 [說明] 內容在線上,請在連結文字中清除該內容。 這麼做有助於讓連結的結果可預測。

    正確:

    如需其他格式和工具,請移至 Microsoft 網站。

    不正確:

    哪裡可以找到其他格式和工具?

  • 使用完整的句子。

  • 請勿使用結束標點符號,但問號除外。

  • 請勿針對 [說明] 連結或命令使用省略號。

說明內容

  • 使用粗體格式化 UI 元素,使其更容易識別。 這特別適用于程式說明主題,讓使用者能夠掃描程式並快速查看相關的 UI 元素。
  • 使用斜體格式化標題。 這適用于受益于簡短文字說明的表格、藝術、螢幕擷取畫面和其他圖形元素。
  • 直接以 [說明] 來參考 [說明]。 一般而言,除非您實際上參考網站上的內容,否則請勿使用線上說明片語。