網際網路除了商業用途與學術用途之外，還有協助政府服務，社會服務，社會運動等功能，甚至可以作為政治動員。請論述網際網路在社會服務，社會運動的可能性，如果可能，請舉例說明。
紅十字會 http://www.icrc.org/eng/ 一些國家紅會可能會承擔一些國際人道法或運動職責並未直接界定的人道工作。在很多國家，國家紅會通過提供應急醫療服務而與該國衛生系統關係密切。
伊甸基金會 http://www.eden.org.tw/ 伊甸爭取弱勢族群權益，增進社會大眾對身心障礙同胞的正確認知，並倡導更合理的社會福利政策與爭取社會福利預算
創世基金會 http://www.genesis.org.tw/ 安養植物人、幫助成千上萬個植物人家庭，並宣導機車安全教育
2013年1月7日 星期一
2012年12月17日 星期一
Lab 36 Syndication with RSS 2.0
Lab 35 XML (2)
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.
Q:請描述至少一個你做這個lab所遇到的問題，並且你是如何解決這個問題的。
因為是外系生，所以不知道錯誤在哪，經過助教的指導之後，才知錯誤在哪。
Lab 34 XML
1. Register and Download Xray, an XML, XSLT editor and processor.
(安裝X-Ray需要權限)
(助教碎碎念:若無法順利安裝在點我)
2. Before you do this lab,all the first you must know is
what is XML?
what is XSLT?
please write down your answer.(least 200 words)
XML:可擴展置標語言（Extensible Markup Language，簡稱XML），又稱可擴展標記語言，是一種置標語言。置標指電腦所能理解的信息符號，通過此種標記，電腦之間可以處理包含各種信息的文章等。如何定義這些標記，既可以選擇國際通用的標記語言，比如HTML，也可以使用像XML這樣由相關人士自由決定的標記語言，這就是語言的可擴展性。XML是從標準通用置標語言（SGML）中簡化修改出來的。它主要用到的有可擴展置標語言、可擴展樣式語言（XSL）、XBRL和XPath等。
XSLT:其實XSLT只是將XML理轉換成其他格式而已，我們透過ＸＳＬＴ處理器可以將XML文件照者Template-Driven的轉換Script程式碼來產生轉換結果XML他可以轉換成樹狀結構，其是XSLT就是把一個XML的樹 使用XSLT轉換成tree的，在修改一下node 最後產生另一棵樹。其實XML配合XSLT我們就能支援在HTML上顯示文件了
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 <.
4. View the formatted HTML file.
Q:請描述至少一個你做這個lab所遇到的問題，並且你是如何解決這個問題的。
XRAY無法下載，所以使用助教給的連結做出lab。
(安裝X-Ray需要權限)
(助教碎碎念:若無法順利安裝在點我)
2. Before you do this lab,all the first you must know is
what is XML?
what is XSLT?
please write down your answer.(least 200 words)
XML:可擴展置標語言（Extensible Markup Language，簡稱XML），又稱可擴展標記語言，是一種置標語言。置標指電腦所能理解的信息符號，通過此種標記，電腦之間可以處理包含各種信息的文章等。如何定義這些標記，既可以選擇國際通用的標記語言，比如HTML，也可以使用像XML這樣由相關人士自由決定的標記語言，這就是語言的可擴展性。XML是從標準通用置標語言（SGML）中簡化修改出來的。它主要用到的有可擴展置標語言、可擴展樣式語言（XSL）、XBRL和XPath等。
XSLT:其實XSLT只是將XML理轉換成其他格式而已，我們透過ＸＳＬＴ處理器可以將XML文件照者Template-Driven的轉換Script程式碼來產生轉換結果XML他可以轉換成樹狀結構，其是XSLT就是把一個XML的樹 使用XSLT轉換成tree的，在修改一下node 最後產生另一棵樹。其實XML配合XSLT我們就能支援在HTML上顯示文件了
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 <.
4. View the formatted HTML file.
Q:請描述至少一個你做這個lab所遇到的問題，並且你是如何解決這個問題的。
XRAY無法下載，所以使用助教給的連結做出lab。
2012年12月16日 星期日
Lab 33 Speed Test
測試中原大學與中央大學對外頻寬速度。
Tool: Speedtest
cycu proxy: proxy.cycu.edu.tw:3128
ncu proxy.csie.ncu.edu.tw:3128
no proxy
Tool: Speedtest
cycu proxy: proxy.cycu.edu.tw:3128
ncu proxy.csie.ncu.edu.tw:3128
no proxy
這是沒有proxy的
這是有proxy的
這是中央的~可是中央不給用
Lab 32 Programming in DOM (II)
1. Open KompoZer
2. Based on the code as in
2. Based on the code as in
http://www.scottandrew.com/weblog/articles/dom_4 ,
write a code so that when you push a button, you generate the table of 9*9 products. (九九乘法表)
Hint: The javascript code should be enclosed by script tags.
write a code so that when you push a button, you generate the table of 9*9 products. (九九乘法表)
Hint: The javascript code should be enclosed by script tags.
Q:請描述至少一個你做這個lab所遇到的問題，並且你是如何解決這個問題的。
我的按鈕名稱無法用"九九乘法表"，因為會顯示亂碼，所以我只好打"click me"，用英文之後就不會亂碼了。
2012年12月8日 星期六
Lab 31 Programming in DOM
1. Open KompoZer
2. Based on the code as in
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.
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所遇到的問題，並且你是如何解決這個問題的。
程式碼都沒錯，可是圖片跑不出來，已經試過很多次了。
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.
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.
Lab 28 Lab Form and Action
- Dynamic pages, content generated by server-side programs.
- CGI, Common Gateway Interface, for sending requests to server-side programs.
static page
Ex:
http://www.google.com/
dynamic page
Ex:
http://www.cna.com.tw/
URL that sends a request by CGI
Ex:
http://maps.google.com/maps?q=24.9586,+121.2411
Purpose of lab:
Learn 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 KompoZer HTML editor.
3. Open a new empty HTML file.
4. Paste the search box into this new file.
5. Use KompoZer 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?
8. Set method as "post"
9. Run your HTML by Firefox. What do you get?
改成get
改成get之後搜尋cycu可以搜尋得到
改成post
改成post之後搜尋cycu'，就搜尋不到了
2012年11月26日 星期一
Lab 27 Mash-Up 2 (Calendars)
建立你的行事曆，並與學校行事曆合併
Q:請描述至少一個你做這個lab所遇到的問題，並且你是如何解決這個問題的。
Google日曆-中原大學服務學習活動行事曆-html版本
進入後按右下角+Google日曆即可訂閱Q:請描述至少一個你做這個lab所遇到的問題，並且你是如何解決這個問題的。
Lab 26 Mash-Up, Part 1 (Maps)
真實案例
96年度全人關懷獎 -崔媽媽科技服務工作團隊
For housing services, compare the following two websites
http://www.housingmaps.com
http://yungching.housefun.com.tw/
List the differences in the user interface design and usability. Make comments
by your use experiences.
比較: 美感，直覺性，流暢，預期反應
housingmaps
美感:較不鮮豔，但看起來簡單整齊。
直覺性:想點什麼就點什麼
流暢:很簡單就能找到我們需求的
預期反應:想像的可能會跟實際看到的不一樣
永慶房仲網
美感:鮮豔裡帶著一點雜亂
直覺性:介面比較亂，需要思考一下才知道如何尋找我要的東西。
流暢:提供了很多選擇，幫助我們更方便找到我們想要的
預期反應:想像的與實際上看到的一樣。
Q:請描述至少一個你做這個lab所遇到的問題，並且你是如何解決這個問題的。
我點那兩個網站裡面的連結，點進去都找不到網址。無法解決
96年度全人關懷獎 -崔媽媽科技服務工作團隊
For housing services, compare the following two websites
http://www.housingmaps.com
http://yungching.housefun.com.tw/
List the differences in the user interface design and usability. Make comments
by your use experiences.
比較: 美感，直覺性，流暢，預期反應
housingmaps
美感:較不鮮豔，但看起來簡單整齊。
直覺性:想點什麼就點什麼
流暢:很簡單就能找到我們需求的
預期反應:想像的可能會跟實際看到的不一樣
永慶房仲網
美感:鮮豔裡帶著一點雜亂
直覺性:介面比較亂，需要思考一下才知道如何尋找我要的東西。
流暢:提供了很多選擇，幫助我們更方便找到我們想要的
預期反應:想像的與實際上看到的一樣。
Q:請描述至少一個你做這個lab所遇到的問題，並且你是如何解決這個問題的。
我點那兩個網站裡面的連結，點進去都找不到網址。無法解決
2012年11月12日 星期一
Lab 24 使用HTML 4 和HTML 5的影音播放
HTML4 video需要用flash來播放
HTML5的目的在於讓網路開發者能夠擺脫對於各種第三方外掛程式的依賴，加入了許多新的語言標記和格式支援，許多必須加上外掛後才能夠達到的功能，未來只要利用HTML5這個開放標準就可以達成，例如HTML5將支援視訊標記，讓瀏覽器不需依靠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.
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.
2012年11月5日 星期一
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.
Date: 11/5/2012 20:25 PM
URL: http://tw.yahoo.com/
Date: 11/5/2012 20:26 PM
URL: http://www.facebook.com/login.php
Date: 11/5/2012 20:29 PM
URL: http://tw.msn.com/?rd=1&ucc=TW&dcc=TW&opt=0
Report the summary of all the errors and warnings for each site.
yahoo奇摩
List of Accessibility Issues Summary
| FAE Rule | Violations | Message | Class |
|---|---|---|---|
| Warn | 1 | The words contained in each h1 element should match a subset of the words contained in the title element. Words (%1) in h1 elements should also be in the title element. | Title |
| Fail | 1 | Each heading element (h1..h6) must have text content. | Headings |
| Check | 1 | Heading content should be concise (usually 65 or fewer characters in length). | Headings |
| Warn | 1 | Avoid using images that are smaller than 16 pixels by 16 pixels as links. | Links |
| Fail | 1 | Every frame element must have a title attribute with content that describes the purpose of the frame. | Frames |
| Warn | 1 | If the content of the alt attribute is not empty it should contain at least 7 characters and less than 90 characters. The text should provide people who cannot see the image orientation to the content and purpose of the image in the website. | Images |
| Warn | 2 | Each map, ul or ol element that precedes the last h1 element and appears to be a navigation bar should be immediately preceded by a heading element, preferably an h2. | Menu and Navigation Bars |
| Warn | 4 | Every onClick event handler should be on a focusable element. | Events |
| Warn | 8 | The content of the headings of the same level within the same section should be unique. | Headings |
| Fail | 19 | Each img element should have alt text. | Images |
| Fail | 22 | Heading elements that follow the last h1 should be properly nested. | Headings |
| Warn | 35 | Ensure that links that point to the same HREF use the same link text. | Links |
| Warn | 53 | Ensure that links that point to different HREFs use different link text. | Links |
| Warn | 105 | Avoid using text links that are shorter than four 4 characters in length. | Links |
Date: 11/5/2012 20:25 PM
URL: http://tw.yahoo.com/
FACEBOOK
List of Accessibility Issues Summary
| FAE Rule | Violations | Message | Class |
|---|---|---|---|
| Fail | 1 | The page should contain at least one and no more than two h1 elements. | Headings |
| Fail | 1 | Each heading element (h1..h6) must have text content. | Headings |
| Check | 1 | Heading content should be concise (usually 65 or fewer characters in length). | Headings |
| Check | 1 | Most web pages should contain at least one navigation bar. | Menu and Navigation Bars |
| Fail | 1 | The i element must not be used to italicize text content, instead use heading (h1-h6) elements for heading text or the em element for emphasizing words, phrases or sentences. | Text Styling |
| Fail | 1 | The u element must not be used to underline text content, instead use heading (h1-h6) elements for heading text or the em or strong element for emphasizing words, phrases or sentences. | Text Styling |
| Warn | 1 | The character encoding was not specified. | W3C Specifications |
| Fail | 2 | Heading elements that follow the last h1 should be properly nested. | Headings |
| Warn | 2 | The content of the headings of the same level within the same section should be unique. | Headings |
| Warn | 7 | Avoid using text links that are shorter than four 4 characters in length. | Links |
| Fail | 10 | Each page must have a lang attribute on its html element whose value or initial subtag is a valid two-character language code. | Language Changes |
Date: 11/5/2012 20:26 PM
URL: http://www.facebook.com/login.php
MSN
List of Accessibility Issues Summary
| FAE Rule | Violations | Message | Class |
|---|---|---|---|
| Check | 1 | Most web pages should contain at least one navigation bar. | Menu and Navigation Bars |
| Fail | 1 | The page should contain at least one and no more than two h1 elements. | Headings |
| Fail | 16 | Every frame element must have a title attribute with content that describes the purpose of the frame. | Frames |
| Fail | 35 | Heading elements that follow the last h1 should be properly nested. | Headings |
| Warn | 1 | Avoid using images that are smaller than 16 pixels by 16 pixels as links. | Links |
| Warn | 3 | Every img element that is less than 8 pixels high or 8 pixels wide OR has an empty alt attribute value should be removed and CSS techniques should be used for styling content. | Images |
| Warn | 4 | Each subheading element (h2..h6) should have text content exclusive of the alt text of any img elements it contains. | Headings |
| Warn | 13 | Hidden or empty frames should not be used. | Frames |
| Warn | 22 | If a link includes an img element and text content, and the words in the alt attribute content of the img element match the words in the text content of the link, then the alt attribute content should be set to be empty. | Links |
| Warn | 29 | If the content of the alt attribute is not empty it should contain at least 7 characters and less than 90 characters. The text should provide people who cannot see the image orientation to the content and purpose of the image in the website. | Images |
| Warn | 71 | Avoid using text links that are shorter than four 4 characters in length. | Links |
| Warn | 72 | Ensure that links that point to different HREFs use different link text. | Links |
| Warn | 158 | Ensure that links that point to the same HREF use the same link text. | Links |
Date: 11/5/2012 20:29 PM
URL: http://tw.msn.com/?rd=1&ucc=TW&dcc=TW&opt=0
訂閱：
文章 (Atom)