政府網站營運交流平台 - 國家發展委員會
:::
網站版型與內容管理規範圖示
  • 政府網站版型與內容管理規範

  • 資料來源:國家發展委員會
  • 公告日期:104-04-27
  • 全文下載
我要留言
前言圖示
使用者的呈現裝置圖示
網頁組成要素圖示
  • 網頁組成要素

  • 網頁組成要素應具備樣貌ㄧ致性及位置ㄧ致性。樣貌應清楚明確,符合使用者的習慣,並依重要性擺放在相對應的位置。

  • 說明

    網頁組成要素(Site Required Elements)是呈現網頁介面的重要元素,其配置位置會立即反應在使用者的便利性上,其使用的文字與格式也影響操作介面是否好用。

    樣貌ㄧ致性:網頁組成要素樣貌應清楚明確、符合使用者的習慣,不建議各機關自行命名。

    位置ㄧ致性:網頁組成要素應依重要性擺放在相對應的位置。

    圖2 網頁組成要素位置示意圖,定義版面各區塊的位置與約略尺寸,並因應機關網站設計開發與應用服務的多元發展,圖3定義版面的各服務功能區塊的位置,表1歸納出各區塊重要網頁組成要素的項目與名稱。依照網頁版面示意圖及表1的建議設計,可提高政府網站操作介面的ㄧ致性,幫助民眾瀏覽網頁時更易取得網站內容。


    圖2  網頁組成要素位置示意圖


    註:設計版面需考量網頁寬度、高度與相關配置時,請參考本規範以下章節:


    1. 1.2 網頁設計宜考量螢幕解析度。
    2. 1.4 Tab鍵在網頁上的移動應有順序性。
    3. 4.2 首頁應考量使用者瀏覽方便及裝置,不宜產生橫向捲軸。


    圖3  網頁服務功能位置示意圖

    相關參考網站:英國電子化政府入口網 https://www.gov.uk/
    美國白宮 http://www.whitehouse.gov/

    表1  網頁組成要素配置表

    頁面區塊 網頁組成要素 使用文字
    (註:標籤名稱與呈現方式)
    建議說明
    網站名稱與識別標誌 網站名稱與識別標誌 呈現中文/英文全名與識別標誌 按標誌可回到首頁。
    網站實用工具


    網站導覽 中文版:網站導覽
    英文版:Sitemap
    提供全網站架構並提供連結。
      意見信箱 中文版:意見信箱
    英文版:Contact Us
    以表單方式為主要填寫介面。
    常見問答 中文版:常見問答
    英文版:FAQs
    點選可進入常見問答(FAQs)頁面
    語言版本切換按鈕 如:
    English(可連至英文版)
    中文(可連至中文版)
    日本語(可連至日文版)
    語言版本切換按鈕直接以該語言呈現,點選可切換至中文/英文版本網站首頁。
    行動版 中文版:行動版(連至中文版行動版)
    英文版:Mobile(連至英文版行動版)
    依行動版網站規範設計,宜考量符合行動裝置的版面大小,並考量連線速度,提供適合的內容。
    全站搜尋 中文版:全站搜尋
    英文版:Search
    輸入關鍵字按Enter鍵可進入檢索結果,並輔以進階檢索或檢索操作說明。
    回首頁 中文版:回首頁
    英文版:Home
    點選後可回到首頁。
    網站導覽列 網站導覽列   網站的導覽功能列,設計應清楚易懂且具一致性。
    服務 留言版 中文版:留言版/討論區/論壇
    英文版:Message Board / Discussion Forum / Forum
    建議機關提供留言版時,同時制定明確的管理與使用規則,避免公共討論區淪為民眾謾罵空間。
    會員專區 中文版:會員專區
    英文版:Member Login
    可於首頁提供會員輸入帳號密碼的輸入方框,搭配忘記密碼與申請會員的連結。 網站可以Email主動告知會員最新資訊。
    便民服務 中文版:便民服務
    英文版:Online Service
    讓使用者不需下載填寫表單,可於線上申辦完成。 標示各項申辦案件的聯絡窗口、作業流程及相關屬性讓民眾在申辦前即能得到充份資訊。
    雙語詞彙 中文版:雙語詞彙
    英文版:Bilingual Glossary
     
    RSS 中文版:RSS
    英文版:RSS
    點選後進入RSS訂閱單元。
    主要內容區 路徑連結列(麵包屑)   能顯示使用者目前所在的位置,方便其了解目前所在單元及層級。
    網頁標題   有意義的視窗標題可讓使用者更易於搜尋及瞭解網頁內容。
    網頁應用工具選項   如友善列印、轉寄好友、社群分享等。
    主要內文   提供內容是網站的重要服務,政府網站的內容應切合目標使用者的需求,並遵循網站架設的宗旨。
    資料日期 中文版網頁公告日期採民國年格式,即YYY-MM-DD,惟機關基於施政及服務國內外民眾需求,另有其他考量者,如觀光旅遊、招商投資、金融、航空、學術研究、藝術、文化或國際事務等網站,得使用西元年呈現。外語版網頁按照ISO 標準,即YYYY-MM-DD。 針對新聞稿、活動訊息、最新消息、公告文書等動態訊息,提供發布與截止日期。
    頁尾資訊 Fat footer   提供網站架構的捷徑,讓使用者不需要捲回頁面上方,並能對於整個網站主要內容的理解,同時有助於搜尋引擎優化(SEO)。
    政府相關標章   標章圖片保持原圖或等比縮放大小,並設定替代性標籤,且圖片應可連結到相關網址。
    聯絡電話 中文版:(區碼)4碼-4碼,或(區碼)3碼-4碼。如: (02)1234-5678或 (04)123-4567

    英文版:(國碼)區碼-4碼-4碼,或(國碼)區碼-3碼-4碼。如: (+886)2-1234-5678或 (+886)2-123-4567
    建議放置機關或單位總機,而非個人分機。
    聯絡地址 中文版:5碼郵遞區號 +縣市名開頭的地址 英文版:參考內政部及中華郵政所提供之「中文地址英譯」,並提供5碼郵遞區號 可在地址旁邊加上「交通位置圖」字樣,並連結至交通位置說明網頁。
    隱私權保護政策 中文版:隱私權保護政策
    英文版:Privacy Policy
    連結至隱私權保護政策說明頁面。
    網站安全政策 中文版:網站安全政策
    英文版:Security Policy
    連結至網站安全政策說明頁面。
    我的E政府識別標誌 呈現「我的E政府」識別標誌
    中文版的Alt標籤:
    我的E政府
    英文版的Alt 標籤:
    Republic of China (Taiwan) Government Entry Point
    依據各網站設計的色系,製作43 * 46像素的圖片檔(可至本規範網頁下載圖片原始檔),並連結至「我的E政府」網站。

    資料來源:本專案整理

    關閉說明

  • 2.1 網站名稱與識別標誌,建議置於版面左上方
  • 2.2 網站常用服務功能,建議置於版面右上方
  • 2.3 如有版本切換按鈕,建議置於版面右上方
  • 2.4 網站應明確顯示之服務功能,應置於版面適當處
  • 2.5 機關聯絡方式、網站政策及特定標章等宣告資訊,建議置於頁尾
圖片與多媒體圖示
表單圖示
搜尋圖示
  • 搜尋

  • 若機關網站提供大量的文件與資料,應提供搜尋服務。將搜尋引擎套入網站介面時,須考量版面設計及使用者習慣。

  • 說明

    使用者在網站上進行資料的搜尋(Search),ㄧ般而言有兩種模式。一是循網站導覽列逐一點閱網頁,二是透過搜尋機制尋找。便利的搜尋工具可幫助使用者更快找到所需的資料。

    將搜尋引擎套入網站介面時,須考量使用者操作瀏覽的習慣,例如:輸入框的位置是否恰當、搜尋結果頁,並注意是否有進階搜尋的功能。

    搜尋引擎建議優先使用市場既有工具,以節省資源。

    關閉說明

  • 8.1 搜尋結果應方便檢閱
  • 8.2 提供進階搜尋
內容管理圖示
行動版網站圖示
補充說明
附錄一、名詞解釋
附錄二、規範檢核表
附錄三、隱私權保護政策範例
附錄四、網站安全政策範例
附錄五、政府網站資料開放宣告範例
附錄六、網站架構建議
附錄七、外語版網站上稿翻譯審核流程範例
附錄八、行政院及所屬各機關行動化服務發展作業原則
附錄九、平板電腦與智慧型手機的解析度與螢幕尺寸表
附錄十、無障礙網頁相關規範
附錄十一、行政院及所屬各級機關政府資料開放作業原則
附錄十二、政府資料開放資料集管理要項
修訂紀錄