2. Capture the packets at your Ethernet interface card.
3. Enter a login required website that you often go to, such as web mail. Don't use the real account or password.
4. Try to catch the packet that contains the password.
2009年6月19日 星期五
Lab 45 : Packet Sniffer
1. Install Protocol Analyzer Ethereal at http://www.wireshark.org/
2. Capture the packets at your Ethernet interface card.
3. Enter a login required website that you often go to, such as web mail. Don't use the real account or password.
4. Try to catch the packet that contains the password.
2. Capture the packets at your Ethernet interface card.
3. Enter a login required website that you often go to, such as web mail. Don't use the real account or password.
4. Try to catch the packet that contains the password.
Lab 44 : Web Traffic Stress Test
1. Download Stress Test
2. Take a look at the user manual.
3. Test a static page.
Try combinations of stress levels and stress multipliers to simulate 10 users and 100 users.
4. Test a dynamic page.
Try combinations of stress levels and stress multipliers to simulate 10 users and 100 users.
5. Compare the response time of both pages and explain why.
10 users
100 users
2. Take a look at the user manual.
3. Test a static page.
Try combinations of stress levels and stress multipliers to simulate 10 users and 100 users.
4. Test a dynamic page.
Try combinations of stress levels and stress multipliers to simulate 10 users and 100 users.
5. Compare the response time of both pages and explain why.
10 users
100 users
2009年6月12日 星期五
Lab 43 : Drag and Drop
1. Go to Laszlo and enter (Laszlo in 10 minutes).
2. Study and play around the "drag-and-drop" example.
3. Use this method to control movie playing as in the previous lab.
4. If you drag and drop the photo to the "play" area, the movie plays.
5. If you drap and drop the photo to the "pause" area, the movie pauses.
圖片在play時撥放
拖曳圖片
移到pause會暫停
2. Study and play around the "drag-and-drop" example.
3. Use this method to control movie playing as in the previous lab.
4. If you drag and drop the photo to the "play" area, the movie plays.
5. If you drap and drop the photo to the "pause" area, the movie pauses.
圖片在play時撥放
拖曳圖片
移到pause會暫停
Lab 42 : Movie Player
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.
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.
Lab 41 : Speed Test
測試中原大學與中央大學對外頻寬速度。
Tool: Speedtest
中原大學 cycu proxy: proxy.cycu.edu.tw:3128
中央大學 ncu proxy: proxy.csie.ncu.edu.tw:3128
Tool: Speedtest
中原大學 cycu proxy: proxy.cycu.edu.tw:3128
中央大學 ncu proxy: proxy.csie.ncu.edu.tw:3128
2009年6月6日 星期六
2009年6月5日 星期五
Lab 39 : Google Analytics
1. Enter Google Analytics
2. Put the code provided by Google Analytics in your own blog.
2। Check the results to see the daily traffic chart, the recent visitors by locations.
2. Put the code provided by Google Analytics in your own blog.
2। Check the results to see the daily traffic chart, the recent visitors by locations.
2009年5月15日 星期五
Lab 35 : DOM
[Lab]
1. Open NVu
2. Based on the code as in http://www.scottandrew.com/weblog/articles/dom_4 ,
write a code to generate the table of 9*9 products. (九九乘法表)
Hint: The javascript code should be enclosed by script tags।
1. Open NVu
2. Based on the code as in http://www.scottandrew.com/weblog/articles/dom_4 ,
write a code to generate the table of 9*9 products. (九九乘法表)
Hint: The javascript code should be enclosed by script tags।
Lab 34 : Create Image using DOM
1. Open Nvu
2. Hand code a javascript that loads an image from Internet based on
the DOM model.
3. Take a look at the sample code that shows how window.onload to load the image.
4. Use a button to load the image. Try how onclick works।
2. Hand code a javascript that loads an image from Internet based on
the DOM model.
3. Take a look at the sample code that shows how window.onload to load the image.
4. Use a button to load the image. Try how onclick works।
2009年5月8日 星期五
Lab 33 : XML (2)
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
use the XSLT as in the Listing 2 to transform the XML file as in the Listing 1.
(archive)
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.
5। View the formatted HTML file.
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
use the XSLT as in the Listing 2 to transform the XML file as in the Listing 1.
(archive)
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.
5। View the formatted HTML file.
Lab 32 : XML
Lab 31 : Hand code a form
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।
http://maps.google.com/maps?q=24.9586,+121.24114
Use Form CGI that includes action, input, and submit.
Try a few different coordinates।
Lab 30 : Form and Action
"logic will get you from A to B - imagination will take you anywhere"
How to use Form to invoke a remote service through CGI.
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"
(See Hint if it does not work.)
7. Save your file on your computer. Run your HTML by Firefox. What do you get?
未修改前直接點選搜尋
加入method="get"後直接點選搜尋就登入了我的個人iGoogle
8. Set method as "post"
9। Run your HTML by Firefox. What do you get?
Method Not Allowed
How to use Form to invoke a remote service through CGI.
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"
(See Hint if it does not work.)
7. Save your file on your computer. Run your HTML by Firefox. What do you get?
未修改前直接點選搜尋
加入method="get"後直接點選搜尋就登入了我的個人iGoogle
8. Set method as "post"
9। Run your HTML by Firefox. What do you get?
Method Not Allowed
2009年5月1日 星期五
Homework 8
1. 嘗試闖關以下這個遊戲
Place That State Game
2. 建立你的行事曆，並與學校行事曆合併
Place That State Game
2. 建立你的行事曆，並與學校行事曆合併
Google日曆-中原大學行事曆-html版本<http://www.google.com/calendar/embed?src=sth4g0ns7lj48crs0gsm3ekuns%4...>
Lab 29 : Mash-up 4
Lab 28 : Mash-up 3
Maps of the Swine Flu Outbreak - Part 1
Maps of the Swine Flu Outbreak - Part 2
Maps of the Swine Flu Outbreak - Part 3
這些應用的特點是什麼?
ps. More applications of Google Maps
他們都結合了網路地圖來告知流感疫情爆發的地點，並且也用標示加以說明。我們也可從標示密集的程度來看哪些城市哪些國家是相當危急的，而避免到這些地區出遊或辦公。而且不僅有世界衛生組織所公佈的疫情地圖，還包含了一些網友所提供，此外還有相關的新聞連結，可讓點閱者握到更多更新的資訊。
Maps of the Swine Flu Outbreak - Part 2
Maps of the Swine Flu Outbreak - Part 3
這些應用的特點是什麼?
ps. More applications of Google Maps
他們都結合了網路地圖來告知流感疫情爆發的地點，並且也用標示加以說明。我們也可從標示密集的程度來看哪些城市哪些國家是相當危急的，而避免到這些地區出遊或辦公。而且不僅有世界衛生組織所公佈的疫情地圖，還包含了一些網友所提供，此外還有相關的新聞連結，可讓點閱者握到更多更新的資訊。
Lab 27 : Mash-up 2
For housing services, compare the three websites
http://www.housingmaps.com
http://www.urmap.com.tw/asp/kijiji/
http://www.7house.com.tw
List the differences in the user interface design and usability. Make comments
by your use experiences.
比較: 美感，直覺性，流暢，預期反應
以美感來說，我認為kijiji最好，畫面看起來很乾淨。再來就是7house，雖然不至於畫面很亂，但充斥著太多廣告，感覺就好像點進YAHOO的入口網，覺得有點煩。而housingmaps色彩很單調，標記都長的一樣，擠在一起讓人覺得很亂。
以直覺性來說，housingmaps比較好，它沒有比較細部的分類，只要點選城市和要租或要買，就列出該類所有的房子。再來是7house，直接輸入地區、用途、坪數、價格等等，就能找到相關條件的房字。而kijiji則是分類的細，要找到相關分類下搜尋才比較好找到。
以流暢來說，我很喜歡kijiji的方式，不僅有地區街道的地圖可以比較，還做了許多樣的分類，可以找租屋還可以找打工，不僅容易找也滿足不同的需求。再來是7house，它只要把相關條件選擇好了就可列出相關搜尋結果，比起housingmaps能選擇分類的條件少還優。
最後綜合各個條件優劣，預期反應是kijiji勝於housingmaps勝於7house，我想一般人找房子總想知道附近有哪些設施去做比較，所以7house沒有設這種介面基本上就輸很多了。
http://www.housingmaps.com
http://www.urmap.com.tw/asp/kijiji/
http://www.7house.com.tw
List the differences in the user interface design and usability. Make comments
by your use experiences.
比較: 美感，直覺性，流暢，預期反應
以美感來說，我認為kijiji最好，畫面看起來很乾淨。再來就是7house，雖然不至於畫面很亂，但充斥著太多廣告，感覺就好像點進YAHOO的入口網，覺得有點煩。而housingmaps色彩很單調，標記都長的一樣，擠在一起讓人覺得很亂。
以直覺性來說，housingmaps比較好，它沒有比較細部的分類，只要點選城市和要租或要買，就列出該類所有的房子。再來是7house，直接輸入地區、用途、坪數、價格等等，就能找到相關條件的房字。而kijiji則是分類的細，要找到相關分類下搜尋才比較好找到。
以流暢來說，我很喜歡kijiji的方式，不僅有地區街道的地圖可以比較，還做了許多樣的分類，可以找租屋還可以找打工，不僅容易找也滿足不同的需求。再來是7house，它只要把相關條件選擇好了就可列出相關搜尋結果，比起housingmaps能選擇分類的條件少還優。
最後綜合各個條件優劣，預期反應是kijiji勝於housingmaps勝於7house，我想一般人找房子總想知道附近有哪些設施去做比較，所以7house沒有設這種介面基本上就輸很多了。
Lab 26 : Mash-up 1
1. Upload a sample ppt to Google Docs.
2. Publish the uploaded ppt.
3. Embed the online ppt to your blog.
The reason to do so is that the readers don't have to have ppt to view your presentation. For example, some users work with Linux or Unix, and others work with MacOS. They will appreciate you for doing so.
2. Publish the uploaded ppt.
3. Embed the online ppt to your blog.
The reason to do so is that the readers don't have to have ppt to view your presentation. For example, some users work with Linux or Unix, and others work with MacOS. They will appreciate you for doing so.
2009年4月17日 星期五
Lab 25 : 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.
經修改的地方
修改後
2। Fix the failures you found.
經修改的地方
修改後
Lab 24 : Access Keys
1. Use Firefox Accessibility Extension to identify the access keys defined in http://www.epa.gov.tw
2. Use GreaseMonkey to detect the access keys defined in http://www.epa.gov.tw
Hint: AccessBar: displays defined accesskeys in a fixed-position bar along the bottom of the window.
3। Are the two results in the above the same?
兩個結果相同。
2. Use GreaseMonkey to detect the access keys defined in http://www.epa.gov.tw
Hint: AccessBar: displays defined accesskeys in a fixed-position bar along the bottom of the window.
3। Are the two results in the above the same?
兩個結果相同。
Lab 23 : 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।
(1)Yahoo首頁: 46 errors, 24 warnings
(2)中原大學首頁: 4 errors, 0 warnings
(3)伊莉討論區: 81 errors, 42 warnings
Report the summary of all the errors and warnings for each site।
(1)Yahoo首頁: 46 errors, 24 warnings
(2)中原大學首頁: 4 errors, 0 warnings
(3)伊莉討論區: 81 errors, 42 warnings
訂閱：
文章 (Atom)
