Lab 20: accessibility checker

1. Using A-Checker, Check the following 2 sites for accessibility.

• http://bloggercamp.blogspot.com/2007/01/2007.html

• the page you fix with ALT tags

2. Do you see any improvements on accessibility after you apply ALT tags?
Ans:
known減少3個
likely減少0個
potential減少9個

Lab 18: Webpage Accessibility

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

1. You can copy and paste the content to your Nvu.

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

原始碼

HTML標籤
3. Save your editings and preview your webpage using Firefox

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

Lab 19: Installing Mozilla/Firefox Accessibility Extension

Lab 17: 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?


"h"為字體大小語法Lists
4. Copy and paste the Headings example at http://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?

"li"為清單語法

Lab 16: HTML

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.

Homework 3-21-2008

1. Do Lab 15.

2. Check into the government-sponsored web accessibility website.

At 94年度座談及研習會資料-> 無障礙網路空間建置理念與實務(Pdf檔 / 488Kb), download the
presentation materials. What is web accessibility?

Ans:

• 無障礙網頁是服務「所有的使用者」，對於廣大身障者更是不可或缺的。
• 要將網站調整為 "讓有殘障的人能通行無阻(無障礙)" (to make web content accessible to people with disabilities) ，或是在各種不佳的環境下(例如光線昏暗、環境吵雜、單手操作等) 也能使用。
• 講究平權國家的進步指標。
• 這並不是要網站內容開發者避免使用圖檔、影片、Flash 等，而是在使用這些多媒體內容時，要在網頁上適當標示資訊以讓更多使用者可以明瞭。
• 因此，對網站內容開發人員而言，比較直接的感受，就是要花比製作一般網頁更多的心思去 "體貼" 使用者。（但是養成習慣就好了，只是順手作一些設定而已；就像最後離開辦公室的人要記得關燈關門關冷氣）
• 行政院研考會已於91年6月，參考 W3C 協會的 WAI 組織的無障礙網頁內容標準相關規範，訂定我國的「無障礙網頁開發規範」，其中「十四條規範」簡列如下：
  
  【十四條規範】
  　　規範一：對於聽覺及視覺的內容要提供相等的替代文字內容
  　　規範二：不要單獨靠色彩來提供特殊資訊
  　　規範三：適當地使用標記語言和樣式表單
  　　規範四：闡明自然語言的使用
  　　規範五：建立編排良好的表格
  　　規範六：確保網頁能在新科技下良好地呈現
  　　規範七：確保使用者能處理時間敏感內容的改變
  　　規範八：確保嵌入式使用者介面具有直接可及性
  　　規範九：設計裝置獨立網頁
  　　規範十：使用過渡的解決方案
  　　規範十一：使用國際與國內官方訂定的技術和規範
  　　規範十二：提供內容導引資訊
  　　規範十三：提供清楚的瀏覽網站機制
  　　規範十四：確保簡單清楚的網頁內容
• 目前有如下四種等級（並各舉一個大家較為熟悉的規範）：
• 第一優先等級(A)
  【例】圖片與替代文字 對 img 標籤提供 alt 屬性
  　　　
• 新增等級(A+)
  【例】網站應提供網站地圖，清楚呈現出整個網站的層次架構。
  【例】不要求一定得使用滑鼠（視障者無法使用滑鼠）
• 第二優先等級(AA)
  【例】避免使用marquee 跑馬燈、gif 動畫、開新視窗
• 第三優先等級(AAA)
  【例】表格標籤 須提供表格摘要說明 (summary 屬性)
  【例】使用 Lang 屬性，明確指出網頁文字所使用的自然語言，
  　　　讓語音系統可以正確辨識，例如中文為 "zh-TW"
  參考資料: http://cc.shu.edu.tw/~www/week_qa/qa/q_20060522_accessibility.htm

Lab 15: Accessibility by 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.


3. 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

www.ocac.gov.tw

5個

www.epa.gov.tw

6個


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

台北縣政府 4個

高雄市政府 4個


台中市政府 4個

Lab 14: Tongwen

At Firefox installed with Greasemonkey, install the Simplified-to-Traditional character conversion tool Lab Tongwen.

Lab 13: Clean Language

1. Save the JavaScript file of Clean Language to your desktop. Make changes to the script with self-defined bad words. To do this, save the JavaScript on your desk top. Use Notepad editor to make changes. Install the modified script as Greasemonkey.

2. Use Google to search webpages that contains some bad words.

3. Try whether the filtering take effects.

我設定 "today" 為bad words 搜尋會以*****表示

"Lab 12: Greasemonkey"

1.Install Greasemonkey 0.7. Check the lower right corner of your Firefox and you should find a monkey at the right. Note that you must run the



4. Install Web Developer Toolbar to examine cookies.

Homework 3-14-2008

1. 參考 PageRank-Google 決定搜尋排名的關鍵技術
以及Google.com 網站的官方解釋，簡要說明PageRank原理。

ANS:
PageRank的原理主要是建立了[反向連結]的技術.讓"被"連結數越多的網頁.以10的對數分級
並以"優質"吸引"優質"的概念成功串連起龐大的資料庫.PageRank 仰賴網路獨一無二的民主 特 性，使用其大量連結結構做為個別網頁值的指示器。重要、高品質的網站會得到較高的
PageRank 值，每次 Google 執行搜尋時就會記住這個值。Google 將 PageRank 與精密的文字
符合技術合併在一起，找出既重要且與您搜尋相關的網頁。

2. Essay Writing on Google Docs

參考鳳凰城動物園遊記，撰寫一篇你自己的春日遊記。如果是多人出遊，請嘗試合寫的方式。(Teamwork editing)

ANS:春遊

3. 閱讀課本電子商務系統第一章，並做成三頁摘要。

ps. 這次我們要使用Google Docs來書寫，請參考Google Docs。

春遊

就在前幾天，春雷就這樣響了，於是媽媽說要帶我跟弟弟去宜蘭玩，新建的雪山隧道真的是超快速的耶!花不到兩個小時就到宜蘭的，跟以前的北宜公路比起來真的是快很多耶!以前還要走超可怕的九彎十八拐，坐車坐到我頭都暈了才到宜蘭，現在的交通真的是超方便的!到了宜蘭天氣超好，大概是春天到了吧!到了冬山河公園，居然下起毛毛雨，我們一家人都傻眼了，雨越來越大，我們就先找個地方落腳先填飽肚子再說，可是吃完飯雨還是很大所以哪裡都不能去，春天出遊就是有這個壞處，因為春雨綿綿呀!所以我們就提早了去住在頭城的外婆家，其實外婆家附近的風景也很棒，而且還吃到外婆煮的一手好菜!雖然沒有玩到什麼，不過還是很開心說。

Lab 10 Keep track of blogs

Use Technorati to measure the authority of blogs and show how many links the following blogs have.


Scobleizer http://scobleizer.wordpress.com/
Techcrunch http://www.techcrunch.com/
Engadget http://www.engadget.com/
Reflection http://www.chieftain.idv.tw
Java http://javaatcycu.blogspot.com
我的...

Lab 11: Web Pageranking

Lab Google PageRank

在Firefox上安裝 PageRank , 然後使用 PageRank 量測以下網站的 PageRank (0~10分)

紐約時報 http://www.nytimes.com


CNN http://www.cnn.com/


台灣雅虎 http://tw.yahoo.com

蕃薯藤 http://www.yam.com

PCHome 購物 http://shopping.pchome.com.tw/

Monday 購物 http://www.monday.com.tw/


接著，以PageRank量測你常用的三個網站。

頑皮豹的舞世界

Marco的地盤

楚狂人

Lab 9 Online teamwork editing

1. Go to Google Docs. Google Docs lets you write Word documents through an online web service.
2. Start writing.
3. Publish the Word document.
4. What's the URL of your document.


http://docs.google.com/Doc?id=d39rhkc_05pqp7thd


5. Add the Google Docs to your personal portal. At the portal page, you should be able to see the active documents.





6. Save your document as .doc and .pdf, the two common formats for documents.

Homework 3-7-2008

1. 請閱讀數篇其他同學的部落格(上次作業第一題)，選擇其中三位同學在她(他)的部落格上，針對其散文給予評語或建議。

2. 2篇回應 2贊同 ,回應使我對我的興趣更有動力
3.社會媒體可以立即做出回應並更改,不必由單一管道接受資訊.而且可以引用別處的文章.自由的po出你喜歡的東西.不用經過篩選.甚至只是討好觀眾的垃圾新聞. 舊有的媒體空間已容不下更多人的意見.往往又流於個人主觀.Web2.0則讓大家有了一個充分發表高論的地盤.近幾年部落格如雨後春筍般出現.說明了每個人可望為自己建立一個屬於自己的媒體 4 . 利用RSS功能可以省下不少瀏覽的時間 .因為RSS可已經由feed把最新更新的網 站內容通知你.不用在一個一個慢慢找了

Lab 7: RSS

1. Enter Google Reader

2. Try the following

* iapblog.blogspot.com
* New York Times
* http://yourblog.blogspot.com/feeds/comments/default




3. What is the RSS feed that Google Reader takes in? List the URL of these RSS feeds.