政府網站營運交流平台 - 國家發展委員會
:::

6.7快速導入模式之 Web2.0 網站配置

更新日期:103-10-22

本文閱讀

於政府網站中以標準圖示配置於醒目位置與固定樣貌,以顧及使用者之方便性和能見度,提高政府網站版型的一致性與使用的方便性。

針對快速導入模式中,有關各項Web 2.0網站連結的版面配置要點說明如下:

上一章節
6.6規劃 Web2.0 網站的版型
下一章節
6.8Web2.0 網站主頁與必要網頁元素對照
6.7.1 運用Widget外掛網路元件

透過外掛元件或小程式Widget的功能,將在其他Web 2.0網站中的資訊或內容,以嵌入程式碼的方式與官方網站的版面整合一起,例如Facebook、RSS、Twitter、Plurk等都有提供嵌入版面的功能。

6.7.2 直接連結Web 2.0網址

直接放置內容或資料在Web 2.0網站,在官方網站上顯示清楚的URL網址或圖示,讓使用者可以方便點選到各種不同的Web 2.0網站,例如YouTube、Plurk、Facebook等。

6.7.3 配置位置

依政府網站版型與內容管理規範之網站網頁組成要素規範,網頁組成要素因應機關網站設計開發與應用服務的多元發展,建議以網頁單欄式設計。Web 2.0網站標誌與連結,建議放置於政府機關官網之右上方網站實用工具的位置以利使用者瀏覽連結。

Web 2.0網站連結在官網網頁元素配置示意圖
圖14  Web 2.0網站連結在官網網頁元素配置示意圖

6.7.4 Web 2.0識別標誌和名稱

Web 2.0網站識別標誌和名稱,可以直式或橫式排列連結,需考量與官網網頁版面的協調性。以文字標明名稱並做連結時,文字下方應標示底線;圖示的替代文字,應設定為該網站的名稱,例如Facebook、Twitter、Plurk、Blog、YouTube等。

文字格式應配合主網頁的一致風格,套用相同的字型、大小、顏色等樣式。

表15  Web 2.0網站識別標誌和名稱排列範例

呈現方式 範例 圖示替代文字
直式圖示+文字 Facebook Facebook
橫式圖文+文字 Facebook Facebook
名稱圖示 Facebook Facebook
6.7.5 圖示區塊大小名稱

Web 2.0識別標誌之製作,依上述所選擇的呈現方式,可設計按鈕小圖示,或完整Web 2.0網站名稱圖示,檔案格式可為gif或jpg。圖示色系可參考Web 2.0網站Logo及配合主網頁的整體版型顏色設計,以免影響美觀。

本區塊的寬度,可配合官網網頁左中或右中的寬度,或介於150~220像素。高度則配合主網頁版面設計。

6.7.6 嵌入碼區塊

如嵌入YouTube影片或Plurk,應將寬度設定在不超過右中方原主網頁的寬度,或不超過150~220像素。框架色系則以配合官網主網頁設計。

6.7.7 連結方式

Web 2.0網站的連結方式,建議以另開新視窗的方式連結,以免與主網頁架構混淆。

6.7.8 Web 2.0網站10項必要網頁元素規範

Web 2.0網站各有其規範的版型樣式、網頁組成要素,以及操作方式,所以無法如官網網頁可以完全自行配置所有的網頁元素和版面樣式,只能利用其所提供的版型樣式做微調變換風格,並且利用Web 2.0網站提供的內容欄位,清楚說明網頁的目的與特點,以便與官網網頁相互配合。

綜合Web 2.0網站的內容管理特點,以下網頁組成元素是官網在應用Web 2.0網站時,必須提供的基本內容資訊。

表16  Web 2.0網站必要網頁元素設定規範

單元功能 說明
1. 網站名稱 網站的標頭,通常配置於標誌旁邊
2. 簡介 說明網站的目的和機關簡介,可依據機關需求補充隱私權政策與版權說明
3. 標誌Logo 網站主題的Logo標誌
4. 地址資訊 機關的聯絡資訊
5. Email 業務窗口或版主的電子郵件
6. 網址 提供官網網址,以便使用者可快速連結
7. 帳號名稱 通常為登入網站的主要代碼,皆置於網頁的明顯位置,帳號名稱的命名,建議可反映網站主題或類似意義以便讓使用者加深印象
8. 版型背景 背景主題應選擇與官網互相搭配的色系
9. 隱私權 若需多數使用者參與,建議開放較多權限;例如資訊和內容服務的分享對象,可設有所有人皆可使用
10. 發布分享 定期的發布可讀性高、有趣的內容,促使參與率的穩定與提升
  1. 網站名稱

    網站名稱命名方式應與官網或主題活動相呼應,字數不宜太長,常用Web 2.0網站皆提供支援中文網站名稱。

  2. 簡介

    簡介大都配置於Web 2.0網站首頁左中或標題下方,應儘量簡單明暸說明網站之功能及目的,或補充隱私權政策及版權說明等,但不宜太過冗長。

  3. 標誌Logo

    標誌圖示是Web 2.0網站網頁最易識別與他站不同之處,也是使用者進入網站之第一印象,所以應製作清晣時尚的圖示,Web 2.0網站網頁的圖示常配置於標頭或網站名稱旁邊,一般以正方形呈現,圖檔約150~400像素即可。圖示不需包含機關名稱,文字部分應在簡介、聯絡資訊或網站名稱等處敘明。

  4. 地址資訊

    包括機關地址或電話傳真等基本資訊,Web 2.0網站所提供此部分組成元素可能分散在不同功能項下,或並非每個工具網站都提供,可利用簡介項補充此資訊。

  5. Email

    Email為Web 2.0網站主要之聯絡方式,應提供正確業務窗口之電子郵件,以免遺漏重要訊息或意見。

  6. 網址

    在此處可提供官網之網址及連結,可讓使用者隨時連結官網主頁。

  7. 帳號名稱

    Web 2.0網站常將申請的帳號名稱視為網站的一部分,將其配置於頁面的明顯位置,所以如果在申請帳號時,取一個與網站主題類似或相對應的帳號名稱,可讓使用者加深印象。通常帳號需以英文命名,且不可為已申請過的重複名稱。所以最好在申請前預先設定幾組帳號名稱,以做備用。

  8. 版型背景

    常用的Web 2.0網站,主要應用於社交網路的資訊或多媒體之分享,設計上偏重於分享功能之易用性,因此較難呈現版面的多樣化和獨特性,所以在網頁呈現上,還是以網站所提供的背景色系或主題更換為配置要素,少數工具網站提供自訂功能,可自行上傳主題和背景。在選擇網頁版面色系或主題時,應儘量配合官網網頁的風格,選用較為接近的色系設計。

  9. 隱私權

    Web 2.0網站皆有提供隱私權的設定,但屬一般性的規範,較常做為各單元使用權限設定或意見管理等,對於個別的特殊隱私權說明,並無法在此規範,建議可於簡介項中補充說明。

  10. 發布分享

    互動交流是Web 2.0最主要的功用,也是與目標對象最直接的互動方式。定期的發布與分享訊息,才能使參與者不斷的互動。不同的Web 2.0網站有不一樣的字數限制,建議每一則訊息的發布應簡短有趣,如此才可得到很多的回應。若為部落格文章,則可分段撰寫,必要時,也可運用影音多媒體使內容更生動活潑。

【參考表單】:附錄一、表7 基本資訊設定檢核表

回目錄頁