2007年12月31日 星期一

Lab Movie Player by AJAX

1. Go to Laszlo and enter (Laszlo in 10 minutes).
2. Study and play around the "scripting" and "video" examples.
3. Use this script to control movie playing.
4. If you push the "pause" button, the movie pauses.
5. If you push the "resume" button, the movie resumes.


2007年12月17日 星期一

Homework 12-10-2007

1. List three ways of creating interactive webpages.

CGI、Java script、Nvu

Lab DOM and JavaScript

程式碼



九九乘法表

Lab Create Img using DOM

1.打開網頁直接顯示圖片



程式碼



3.按下按鈕後顯示圖片



程式碼

2007年12月3日 星期一

lab 19: XSLT Part II

1. Register and Download Xray, an XML, XSLT editor and processor.

2. Given the
Listing 1. An XML document representing the results of a soccer tournament
Listing 2. A basic style sheet for the soccer results

一個存xml,一個存xslt



會有這樣的結果






use the XSLT as in the Listing 2 to transform the XML file as in the Listing 1.

3. View the formatted HTML file.
4. Given the
Listing 1. An XML document representing the results of a soccer tournament
Listing 3. A style sheet that computes team standings

compute the team standings in a table.


將上面兩個一個存xml,第二個存xslt




結果





5. View the formatted HTML file.

lab 20: XSLT Part III

1. Given the RSS of Yam News, write an XSLT file
and use Xray to generate an HTML that contains the titles of items in the RSS.

2. View the formatted HTML file.





lab 18: Lab XML & XSLT

1. Register and Download Xray, an XML, XSLT editor and processor.

2. Given the the XML file and XSLT file ,
use Xray to do the transformation of the XML into HTML.
You have to replace [ with <.

3. View the formatted HTML file.


Homework 11-26-2007

1. Problem 1 & Problem 3 of Textbook on Page 55.

試解釋WEB技術演進是要解決什麼樣的問題?

相較以往在Server上產生HTML並回傳至瀏覽器,任何畫面皆利用瀏覽器本身或附加的功能來產生。形同於借用了Client Side CPU的運算資源,減少Server成本。使用者感受到的互動性與回應速度皆有大幅的提升。
由於Server並不是每次都回傳複雜龐大的HTML,而是利用XML或JSON傳輸資料的部分,使用的頻寬也相對變小。
Server Side除了使用傳統XML Web Service,更可以採用REST,讓Client的應用程式可以更快速掌握資料的新增修改刪除(CRUD)並簡化呼叫的服務URL。
能夠快速Mashup其他的Web應用程式資源,又能擁有高速的執行效能。

3.程序(PROCESS)害執行緒(THREAD)對網站性能有什麼不同的影響?
Program: 一群程式碼的集合,用以解決特定的問題。以物件導向的觀念來類比,相當於Class。 Process:由Program所產生的執行個體,一個Program可以同時執行多次,產生多個Process。以物件導向的觀念來類比,相當於 Object。每一個Process又由以下兩個東西組成 一個Memory Space。相當於Object的variable,不同Process的Memory Space也不同,彼此看不到對方的Memory Space。
程序(Process)
用在Web系統演進的第二時期,當使用者增多時,由於耗費過多系統資源會導致網站速度明顯下降。
執行緒(Thread)
用在Web系統演進的第三時期,取代了程序,而使用常駐的服務(Service\Daemon),此程式會一直留在系統內,除非關機,否則會一直做服務。當人多時Thread就會變多;人少時,Thread就會減少,故不會耗費系統資源而導致網站速度下降。


2. What does a CGI output contain in the HTTP header? Hint: Such as Content-type

計數器、和近來頗盛行的網頁遊戲如travian

3. If you want to upload an mp3 file, should you use the GET or POST method? Why?

Get是從輸入網址端的服務器上獲得資料。Post則用來對伺服器發布資料。上傳檔案室對伺服器發送數據資料,應該用post。

Lab 17: Form and Action, Part II

Hand code a HTML or use Nvu to edit an HTML so that the webpage can send a request to Google like
http://maps.google.com/maps?q=24.9586,+121.24114

Use Form CGI that includes action, input, and submit.
Try a few different coordinates.

1.插入按鍵



2.插入文字欄位



3.輸入表單連結




4.最後按下儲存




5.開啟剛剛儲存的網頁



6.輸入經緯度就可以出現地圖


2007年11月26日 星期一

Lab 16: Form and Action

1. Copy the search box of this search page,
inlcuding radio buttons, text input, and submit button.
2. Open your Nvu HTML editor.
3. Open a new empty HTML file.
4. Paste the search box into this new file.

5. Use Nvu to add a Form to this search box. Do not hand code the HTML. Just fill the blank in the Form dialog.

6. In the form dialog, set Action="http://google.com/search" and name of Form as "f" and method as "get"





7. Run your HTML by Firefox. What do you get?



8. Set method as "post"




9. Run your HTML by Firefox. What do you get?

Homework 10-1-2007

根據無障礙網頁設計原則

1. 為什麼不要開出新視窗?

開出一個新的視窗會造成瀏覽上的不便,在開出一個新的視窗後,原先使用得上一頁按鈕就沒有原來所瀏覽的那一個網頁,再開出新視窗時,如果開得不多到還沒什麼關係,要是不斷的跳出新視窗,就會造成工作列上的視窗多到不知道哪個才是你所需要的,造成瀏覽上的不便。

2. 為什麼要使用貼切的網頁標頭? 而不是留白?
若是有恰當的網頁標題,在使用螢幕朗讀軟體時,就能夠正確的了解到現在正開啟的網頁主旨,而不需要再慢慢的瀏覽內容,每一個網頁標題就代表一個重點,當你不知道現在正開啟的網頁主要內容,或是你開啟了過多的網頁,導致你忘記每一個不同視窗他們的內容時,只需要看網頁標題你就能夠迅速的選擇你所需要的內容。

3. 定義快速鍵有什麼好處?

快捷件可以使得一切只需要更簡單的一個按鈕就可以解決原本很複雜的事情,因為他在以已經設定的情形下,你只需要按一兩個按鍵就能夠讓電腦知道你要做的事情,假設你常常需要使用上一頁,原本需要用滑鼠去按,但是有了快捷建,你只需要使用Alt+left的方向鍵就可以達成。無形為瀏覽網頁的便利性又增加不少。

Lab 15 Webpage Accessibility

Use Nvu to edit the following homepage
at http://www.epa.gov.tw

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

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.

2007年11月12日 星期一

Lab 14: Accessibility by GreaseMonkey

1.


3.





4.






Lab 13: Clean Language

原本的網頁




使用clean language後

Homework 10-29-2007

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

簡體




繁體




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


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

web accessibility翻成中文就是無障礙網頁,可以方便身心障礙者更容易的閱讀網頁,他們可以藉著各種適合他們的工具更方便更快速瀏覽網頁。

3. According to Section 2.1 of Textbook, some websites are powered by databases in the back end and some are not. What are the purposes of using databases?

使用紙張紀錄所有的資料,使用者查詢需要檢索所有相關的文件紙張,非常不方便而且效率極低,使用資料庫之後,大量的資料全部儲存在的磁碟中,同時迅速電腦查詢資料的速度遠快於慢慢的查找資料,更改資料時也不必逐一更改。而且所需要的人力較少節省人工書寫資料的工作。

Lab 12: Greasemonkey







2007年10月29日 星期一

Lab Technorati

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



yours http://s9526134.blogspot.com/

Homework: 10-23-2007

1. Lab Google PageRank

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

紐約時報 http://www.nytimes.com/ 9分
CNN http://www.cnn.com/ 9分
台灣雅虎 http://tw.yahoo.com/ 6分
蕃薯藤 http://www.yam.com/ 6分
PCHome 購物 http://shopping.pchome.com.tw/ 6分
Monday 購物 http://www.monday.com.tw/ 4分

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

Yahoo拍賣 http://tw.bid.yahoo.com/ 6分
無名小站 http://www.wretch.cc/ 6分
中華職棒 http://www.cpbl.com.tw/ 4分

參考資料:
PageRank 介紹
PageRank 的論文
Google 廣告獲利模式

2. Essay Writing on Google Docs

參考鳳凰城動物園遊記,撰寫一篇你自己的秋日遊記。
這次我們要使用Google Docs來書寫,請參考Google Docs
芒花

2007年10月22日 星期一

評分格式: 智慧型精障者路徑導引與走失偵測系統之行動運算

你覺得這篇論文創新性如何? 普通

你覺得這篇論文嚴謹度如何?是否合乎科學實證的精神? 普通

你覺得簡報內容呈現如何?是不是清晰簡明? 不好

你覺得這篇論文對社會貢獻如何? 好

你覺得這篇論文對學術貢獻如何? 普通

請自由表達你對此篇論文的意見或建議。

這個系統雖然可以讓輔導者比較容易追蹤,但是我覺得在其系統上的開發還可以有更多的應用,例如在精障者不同的反應時,可以自動診斷可能發生何種行為的可能性,進而更容易讓輔導員掌握。

評分格式: 『實境導航,有障無礙』 無線行動化的社區智慧型空間- 認知障礙者路徑指引系統

你覺得這篇論文創新性如何? 好

你覺得這篇論文嚴謹度如何?是否合乎科學實證的精神? 普通

你覺得簡報內容呈現如何?是不是清晰簡明? 好

你覺得這篇論文對社會貢獻如何? 好

你覺得這篇論文對學術貢獻如何? 普通

請自由表達你對此篇論文的意見或建議。

我認為這個機制在使用上還不是完全成熟,很多的問題像是無線網路在台灣的普及與否,就直接影響到這個系統在使用上的便利性。因為這個系統是專位室內而設計的,但是在前往工作時,一定必須會經過室外,這樣的機制在室外這麼多外在影響的情況下,如何能夠利用QR Code 和GPRS等等的網路和衛星定位來結合,也影響到這個系統在認知障礙的人身上他們的使用。

Homework 10-8-2007







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

2. 關於你的散文作品,你得到多少篇回應? 這些回應對你有幫助嗎?
1篇。我覺得他說的對我有很大的影響,時間的應用真的很重要。

3. Use IE to view original XML of Yam's RSS feed. What are the fields of the RSS 2.0?
You may read the lecture notes to give you some of the ideas.



RSS就像是訂閱的電子報,而部落格上的RSS同樣提供訂閱的功能,所以可以透過訂閱部落格上RSS的方式,只要有發表新文章,就會自動發出訊息,讓使用者更容易的查看新的資料。