2010年4月20日 星期二

Lab 20: Making web pages accessible

1. Use Firefox Accessibility Extension to identify the accessibility failures and warnings in http://google.com
2. Fix the failures you found.

(修改前)


(修改後)

2010年4月19日 星期一

Lab 19: Firefox Accessibility Extension

Use Firefox Accessibility Extension to check the accessibility of three sites that you visit most.
Report the summary of all the errors and warnings for each site.




Lab 18: Making images accessible

1. Use KompoZer or Notepad to edit the following homepage
at http://bloggercamp.blogspot.com/2007/01/2007.html

You can copy and paste the content to your KompoZer.

2. Take a look at the HTML 標籤, HTML 原始碼

3. Save your editings and preview your webpage using Firefox

4. Make the webpage accessible by
adding ALT text to the images.

5. Go to the Firefox Add-ons site for Firefox Accessibility Extension

6. Click the "Install now" button on the add-ons website

7. Check whether you can see the ALT text for the images by selecting the "Show Text Equivalent" function.



Lab 18: Making images accessible


1. Use KompoZer or Notepad to edit the following homepage
at http://bloggercamp.blogspot.com/2007/01/2007.html

You can copy and paste the content to your KompoZer.

2. Take a look at the HTML 標籤, HTML 原始碼

3. Save your editings and preview your webpage using Firefox

4. Make the webpage accessible by
adding ALT text to the images.

5. Go to the Firefox Add-ons site for Firefox Accessibility Extension

6. Click the "Install now" button on the add-ons website

7. Check whether you can see the ALT text for the images by selecting the "Show Text Equivalent" function.

2010年4月18日 星期日

Homework 4-12-2010

1. 依據 What is web accessibility,試針對三種不同障別舉出三種無障礙設計方式,並請探討跨障別設計是否可行?(也就是所謂的通用設計)

「 無障礙網頁」, 就是遵循無障礙網站設計之規範,提供網頁導盲磚、鍵盤快速鍵(Access Key)、網站導覽(Site Navigator)等無障礙網頁之設計,為使對滑鼠操作有障礙之人士,亦可快速瀏覽網站之任何資訊。
網際網路的無障礙空間,十四條規範:
規範一:對於聽覺及視覺的內容要提供相等的替代文字內容
規範二:不要單獨靠色彩來提供特殊資訊
規範三:適當地使用標記語言和樣式表單
規範四:闡明自然語言的使用
規範五:建立編排良好的表格
規範六:確保網頁能在新科技下良好地呈現
規範七:確保使用者能處理時間敏感內容的改變
規範八:確保嵌入式使用者介面具有直接可及性
規範九:設計裝置獨立網頁
規範十:使用過渡的解決方案
規範十一:使用國際與國內官方訂定的技術和規範
規範十二:提供內容導引資訊
規範十三:提供清楚的瀏覽網站機制
規範十四:確保簡單清楚的網頁內容

智障

網頁的配置和結構力求單純
聽障

訂出良好的描述規則來設計各種多媒體資訊的替代文字說明
視障

鍵盤快速鍵(Access Key) 網頁導盲磚係以文字意象表示無障礙網頁導引功能,一般以三個“ : ”表示網頁導盲磚,如 “ ::: ”。主要是提供在不使用或不能使用滑鼠操作網頁的環境,也能快速操作網頁。

2. 依據 Tutorial,HTML 3.2 與 HTML 4.0 最大差別在哪裡?

HTML 轉譯延伸模組會轉譯 HTML 格式的報表。轉譯延伸模組可以產生下列類型的 HTML:HTML 3.2、HTML 4.0 或 MHTML。轉譯延伸模組也可產生完整的 HTML 頁面,或內嵌在其他 HTML 頁面中的 HTML 片段。所有 HTML 均以 UTF-8 編碼產生。
HTML 轉譯延伸模組是在瀏覽器中檢視之報表的預設轉譯延伸模組。預設 HTML 類型是 HTML 4.0。
• 若要使用 HTML 4.0,請在報表管理員、SharePoint Web 組件或報表 URL 中開啟報表。
• 若要使用 HTML 3.2,必須在報表 URL 上參考它 (例如
HTML 4.0 報表符合 HTML 4.0 和階層式樣式表層級 2 (CSS2) 規格,但有部分例外。HTML 3.2 報表符合 HTML 3.2 規格,但可能包括部分樣式以改善外觀。HTML 轉譯延伸模組支援彙總 HTML 文件 (MHTML) 標準的 MIME 封裝。這個轉譯延伸模組會以 MIME 結構,將影像、文件或其他二進位檔等資源內嵌在單一檔案的報表 HTML 中。報表中的編碼資源會增加報表的大小,但內嵌資源對於無權存取儲存在報表伺服器或另一個位置之資源的用戶端而言,是非常有用的。MHTML 報表對於在電子郵件訊息中內嵌也是非常有用的,因為所有的資源皆包括在報表中。
3. 依據永恆的數位分身的說法,試舉出一個實例或反例。

永恆的數位分身:
它存在於網路世界,網路上有很多不同的用戶帳),像是你的專屬分身。

實例: 在BBS或任何需要登錄會員
進行發文或交友……之類的。
反例: 像很多網站用分身,進行輿論的謾罵
對了!
最近在非死不可的網站,也有人看小小彬不爽
而進行抵制,只是個小孩,何必呢?
你說對吧! 我住新竹還沒去吃過他家羊肉爐耶 有人要揪團嗎?

2010年4月12日 星期一

Lab 17: AccessBar

AccessBar: displays defined accesskeys in a fixed-position bar along the bottom of the window. Added 2005-04-01 (not a joke). Find how many access keys have been defined at
www.ocac.gov.tw www.epa.gov.tw










Continued from the above, use google to find 3 more government sites in Taiwan that enable access keys.







Lab 16: Accessibility in GreaseMonkey

1. Google Search Keys Numbers the results in a Google search page and you can type the corresponding number to follow the link. Updated: 2005-04-26. more







2.Google Access Keys Enables navigation through Google search results.


Lab 15: more on HTML


Headings
1. Copy and paste the Headings example at
http://www.w3schools.com/html/html_primary.asp
2. Enter http://www.w3schools.com/html/tryit.asp?filename=tryhtml_basic

3. What kind of effects can you see?
=> 標題由h1到h6,而其字體大小由h1到h6逐漸變小





Lists
4. Copy and paste the Headings example athttp://www.w3schools.com/html/html_lists.asp
5. Enter http://www.w3schools.com/html/tryit.asp?filename=tryhtml_basic
6. What kind of effects can you see?

Lab 14: HTML






Preparation

1. Using Microsoft Notepad, Copy and paste the HTML example at Introduction to HTML
2. Save the file as myfile.html
3. Open the file using Firefox.

New editor
4. Enter http://www.w3schools.com/html/tryit.asp?filename=tryhtml_basic
5. Copy and paste the HTML example at Introduction to HTML
6. Verify your results on the screen.

桌上型主機



Intel Core 2 Quad Q9300處理器2.5G
640GB SATA2 3Gb/s HDD
2GB DDR2 800 SDRAM可擴充至8GB
16X DVD SuperMulti燒錄機/ 讀卡機
ATI HD4650 1GB獨立顯示卡
正版Windows Vista Home Premium
High-Definition Audio,支援7.1聲道
中文版防毒軟體一年

華碩筆記型電腦K40IP



螢幕:14" 鏡面寬螢幕 (LED)

CPU:Pentium Dual T3300 (2.0GHz)

記憶體:2GB DDRII 800 On board(Max.4G)

硬碟:500G(SATA)

顯示:NV202M 512MB

光碟機:DVD Super Multi (DL)

網路裝置:802.11n /Gigabit LAN

作業系統:64 Bits Windows 7 Home Premium

ACER筆記型電腦




CPU:Intel Pentium 雙核心 T4400(2.2GHz)
硬碟:320GB 5400K SATA
螢幕:14W鏡面8毫秒
記憶體:1*2G DDR3 1066
顯示卡:NV G105M 實體512M
光碟機:DVD-Super Multi DL (SATA)
無線裝置:802.11bg/Draft-N / BT 2.1
其他:五合一/ 30畫素 / 6CELL
指紋辨識/ 杜比第三代/

Sony VAIO筆記型電腦




VPCF116FW 筆記型電腦,高解析度 16.4 吋寬螢幕液晶顯示器,為您的筆電開啟寬廣視野。圓柱型螢幕轉軸的優雅輪廓曲線設計,展現漂亮的外觀質感與功能性。透過 HDMI 連接線,連接高解析度顯示器,立即享受高畫質影像與聲音。極致效能與娛樂,高階配備讓您可隨處觀賞的行動高解析度家庭劇院,享受家庭劇院、視訊通訊、內容製作以及刺激遊戲的娛樂樂趣,一指操控按鍵,立即滿足您的影音需求。
螢幕:16.4吋
CPU:Intel i7-720QM

硬碟:500GB
記憶體:4GB DDR3 1066
顯示:NVIDIA GeForce GT 330M 1GB

光碟機:Blu-ray Disc 藍光Combo光碟機

無線:802.11a/b/g/n,藍牙標準 Ver. 2.1+ED
作業系統:Windows7 Home Premium 64bit