2012年12月17日星期一

Lab 35 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.

問題 Listing3 有錯誤找很久發現是小於符號被誤判成結束括號之後的問題是小於符號<另一種打法是 <

Lab 36 Syndication with RSS 2.0

問題一開始不知道是把網址打進去後來知道了

what is XML?

可延伸標記式語言（英語：eXtensible Markup Language，簡稱:XML），是一種標記式語言。標記指電腦所能理解的訊息符號，透過此種標記，電腦之間可以處理包含各種訊息的文章等。如何定義這些標記，既可以選擇國際通用的標記式語言，比如HTML，也可以使用像XML這樣由相關人士自由決定的標記式語言，這就是語言的可延伸性。

what is XSLT?

可擴展樣式表轉換語言（Extensible Stylesheet Language Transformations，簡稱XSLT）是一種對XML檔案進行轉化的語言。

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

問題一開始按transform都沒有反應後來發現有個中括號沒改成大於小於符號

2012年12月3日星期一

Lab 31 Programming in DOM

1. Open KompoZer
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 30 Create Image using DOM

1. Open KompoZer
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.

Q:請描述至少一個你做這個lab所遇到的問題，並且你是如何解決這個問題的。

一開始出現的問題是連圖片跟按鈕一起出現

後來發現是程式碼打錯經過修正後就好了

Lab 29 Hand code a form

Before you do this lab, you must understand what is CGI(Common Gateway Interface) and Form.

1. So please search the answer and post your opinion in your blog.
2. Hand code a HTML or use KompoZer 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.

Q:請描述至少一個你做這個lab所遇到的問題，並且你是如何解決這個問題的。

發現用記事本比較好處理用軟體感覺很複雜

Lab 28 Lab Form and Action

修改成POST

POST跟GET的差異

難處在於一開始不知道要幹嘛經助教指點才了解

Homework 11/26/2012

1. 在時速300km/h的高鐵上如何提供上網，2G, 3G, 4G, Wi-Fi可行嗎? 試提出可行之道。

Wi-Fi是屬於定點式的上網模式，最高速度限制有在30km/h所以不在考慮範圍，而3G跟4G上網也只能在時速不到100公里接收不符合需求，2G上網可以容許時速120公里的速度，上網速度相對極慢，況且高鐵時速300公里，以上都不符合需求。

解決方法有WiMAX技術，可容許時速305公里的速度，傳輸資料量也較大，目前還沒有較完善方案，另外也可以在每個車廂獨立設置Wi-Fi基地台，但相對成本會拉高。

2. 在高鐵沿線兩側部建Wi-Fi基地台(Access Point)，能否解決高鐵上網問題，為什麼?

Wi-Fi是屬於定點式上網，並透過認證登入的方式取的網路資源，再高速移動中他無法立刻切換到下一個基地台，無法維持一個正常持續的上網狀態。

2012年11月26日星期一

Lab 27 Mash-Up 2 (Calendars)

建立你的行事曆，並與學校行事曆合併

Google日曆-中原大學服務學習活動行事曆-html版本

進入後按右下角+Google日曆即可訂閱

Q:請描述至少一個你做這個lab所遇到的問題，並且你是如何解決這個問題的。

一開始找不到在哪裡後來發現就在右下角

Lab 26 Mash-Up, Part 1 (Maps)

For housing services, compare the following two websites
1 http://www.housingmaps.com

2 http://yungching.housefun.com.tw/

List the differences in the user interface design and usability. Make comments
by your use experiences.

1. 結合地圖以及利用表單拉選的方式呈現

資訊較多但也比較沒整理雜亂但是可用地圖選擇符合自己的機能需求

2. 利用標籤分類以及搜尋的方式呈現較有整理跟房屋資訊

Lab 25 navigation bar

1. 進入你的部落格，登入，選擇設計
2. 新增小工具
3. 選取
HTML/JavaScript
4. 撰寫或貼上所需連結(範例)

Q:請描述至少一個你做這個lab所遇到的問題，並且你是如何解決這個問題的。

一開始不知道可以一次用很多個連結,後來發現只要空開就可以全部連結放一起

2012年11月12日星期一

Lab 24 使用HTML 4 和HTML 5的影音播放

測試以下HTML 4 和HTML 5的影音播放功能

比較兩者有何差異。

HTML5

今天，大多數視頻都是通過插件（如Flash）所示。然而，不同的瀏覽器可能有不同的插件。

HTML5定義了一個新的元素，它指定了一個標準的方式，在網頁上：<video>元素嵌入視頻/電影。

HTML4

如果瀏覽器不支持Flash，視頻無法播放
iPad和iPhone不支持Flash視頻
如果您的視頻轉換為另一種格式，它仍然不能播放所有的瀏覽器

需要另外嵌入多媒體元素

Lab 23 Making images accessible

1. Study what an ALT tag is.
2. Use KompoZer to edit the following homepage
at http://bloggercamp.blogspot.com/2007/01/2007.html

You can copy and paste the content to your KompoZer.

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.

Homework 11/5/2012

1. 觀看
場域應用與服務設計: "科技人如何做通俗演講" (4分鐘)
撰寫200演講摘要

這篇演講題目就很清楚的說了，科技人如何做一個通俗的演講，演講者在一開始就提到他去一間州立大學教授一們有關溝通的課程，對象是一群工程學系的學生，他說他非常驚嚇，就像艾莉絲夢遊仙境一般，艱深的詞語想法讓他很驚奇，但是要打開這扇交流的門要有很好的溝通。
第二段提到為了改變跟改善這個世界，需要這些工程師跟科技發展，但其他人如果無法與他們溝通那工程師的所做對世界的影響就沒那麼有意義。
第一個方法就是把所研究的東西說明與生活上哪些有關，而不是說你在研究什麼，第二個方法則是運用較通俗的字眼，避免掉一些專業的術語跟詞彙。
他希望可以當作是打開那扇門的鑰匙。

2. 你覺得以後上台作簡報，會做些什麼樣改變？

之前就有人大概講過要如何作簡報，我覺得簡報內容要精簡，如果東西都打在上面那聽者自己看就好你只不過是在唸上面的東西，相對的也不能夠過於精簡，聽者無法記得你所講的所有東西，簡報如果只是個標題那大可不需要，簡報希望是能夠用圖片、數據、圖表列表。另用在講話時盡量用生活用語跟實際上的例子做為連結，最好能夠有類似案例作說明或比喻，畢竟聽故事比枯燥的解說有趣多了。

2012年11月5日星期一

Lab 21 Making web pages accessible

google.com
2. Fix the failures you found.

Accessibility Extension

List of Accessibility Issues Summary

beta Rule	Violations	Message	Class
Check	1	Title should indicate both name of the site and topic of the page.	Title
Warn	2	Each nested table, map with area, ol or ul element that appears to be a navigation bar or menu should be immediately preceded by a header element (h2..h6 -or- role=heading).	Menu and Navigation Bars
Check	4	Avoid placing small links close together.	Links
Check	6	Set font sizes using relative measurements (not px, pt, in, cm, mm).	Text Sizing
Fail	10	Contrast ratio is below the minimal acceptable level (3:1)	Colour Contrast
Warn	19	Contrast ratio is below the optimal acceptable level (7:1)	Colour Contrast

Date: 11/5/2012 20:34 PM
URL: http://www.google.com/webhp?hl=zh-TW&tab=ww

對比度低於最小水平3:1 改得非常有難度

Lab 22 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.

Youtube

Facebook

Yahoo

Lab 20 More on HTML

Table

List

2012年10月29日星期一

Homework 10/22/2012

1. 使用部落格重新設計系網頁，規格要求如下

以高中生和家長為對象，撰寫畢業出路500字介紹
以校友為閱聽對象，撰寫一則你所認識的畢業學長姐動態

畢業出路
校友動態

2012年10月22日星期一

Lab 19 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

Lab 18 Google Accessibility

1. Google Search Keys Numbers the results in a Google search page and you can type the corresponding number to follow the link.

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

Lab 17 HTML

Preparation

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

HTML Images

Homework 10/15/2012

1. 有A, B, C 三個網頁，A引用了B, C，B引用了C，C也引用了B, A
計算A,B,C 三個網頁的PageRank，三者PageRank排序為何?

決定PAGERANK值的三大指標為:
a. 反向連結數
b. 反向連結數是否來自PAGERANK值高的頁面
c. 反向連結來源頁面的外向鏈結數

題目只能得知反向連結數所以PageRank C>B>A

2. 使用部落格重新設計系網頁，規格要求如下

搜尋功能
網頁至少包含以下類別公告，師資，課程，系學會，校友動態，畢業出路，每個類別至少五頁
每個網頁必須有導覽列，可跳至公告，師資，課程，畢業出路，系學會，校友動態，畢業出路
首頁必須提供影音專區，放置一部影片(參考校網頁)
首頁必須提供流覽人次與近三十日劉覽趨勢(參考認識老師)

中原大學電子系

2012年10月15日星期一

Lab 16 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.

Lab 15 Greasemonkey

1. Install Greasemonkey 0.9.1 . Check the lower right corner of your Firefox and you should find a monkey at the right.

2. Cookie Monster - Show cookie contents: Shows the contents of the current page cookie. Just mouse over the "Cookie" text on the bottom left. Check what cookies http://www.nytimes.com writes to you. Does our class blog use cookie or not? Does Google use cookie?

3. You can turn off Greasemonkey by clicking on the monkey face at the URL bar of Firefox. Click again to activate Greasemonkey.

Lab 14 Using Google PageRank

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

CNN http://www.cnn.com/ 8/10
台灣雅虎 http://tw.yahoo.com 8/10
蕃薯藤 http://www.yam.com 7/10
PCHome 購物 http://shopping.pchome.com.tw/ 5/10

face book https://www.face book.com/ 9/10
youtube http://www.youtube.com/ 9/10
巴哈姆特 http://www.gamer.com.tw/ 6/10

Homework 10/8/2012

1. 在中原大學校園與附近環境，AR可能有哪些應用？請列舉十項。

(1) 在學生餐廳店家招牌提供餐點介紹、清單，甚至發展成點餐系統。

(2) 在各教學大樓的電梯鏡子或是廁所鏡子提供當日氣象狀況、即時新聞。

(3) 校園導覽，在各個校內建築物附上介紹。

(4) 在各行政單位的入口顯示負責處理的業務內容以及辦理位置。

(5) 校門口的公車路線資訊與公車時刻表。

(6) 音樂廳、中正樓以及其他表演場所的近期展演內容時間。

(7) 圖書館的書目相關查詢。

(8) 附近夜市的學生特約商店導覽，美食地圖。

(9) 教室外顯示上課的課程時間以及授課教師。

(10)活動中心各社團的簡介及近期活動。

訂閱：文章 (Atom)

2012年12月17日 星期一

2012年12月3日 星期一

2012年11月26日 星期一

2012年11月12日 星期一

2012年11月5日 星期一

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

Accessibility Extension

List of Accessibility Issues Summary

2012年10月29日 星期一

2012年10月22日 星期一

2012年10月15日 星期一

2012年10月8日 星期一