就是愛分享

Ajax基本上是一種技術,一改過去web前端和後端採用的同步溝通方式,而是使用非同步來溝通。而JavaScript是Ajax技術的一個主要組成部分,在開發Ajax應用程式的過程中,往往需要編寫大量的JavaScript程式碼,同時也會遇到瀏覽器相容性的問題。

因此為了減少JavaScript編碼量,並簡化Ajax應用程式的開發任務,目前出現了許多出色的Ajax開發框架,例如jQuery和Ext JS等。其中jQuery是比較輕量級的框架,而Ext JS則包含了許多精美的UI工具,但是相應的檔案大,載入速度並不理想,而且在低版本的瀏覽器上顯示效果不佳。

另外由於jQuery和Ext JS等都是Web前端的JavaScript框架,基本上後端程式是PHP、.NET、JAVA、Ruby或Python等都沒有影響。

jQuery - write less, do more
jQuery是John Resig在2006/01/14於BarCamp NYC首次發表,在jQuery的官方網站可以看到這句「write less, do more」的口號,同時也進一步簡述了jQuery是一個快速又簡潔的JavaScript程式庫,簡化了在HTML文件裡面尋找DOM物件、處理事件、製作動畫和處理Ajax互動的過程。由於jQuery語法簡潔,有時短短的一行程式,卻可以做很多事情。

網路上有很多先進、前輩們無私分享了jQuery的研究與心得,讓我在專案開發上獲益良多,所以在此也分享ㄧ個.NET專案應用jQuery.Ajax的範例。

通常在會員註冊時,總是希望能夠馬上知道會員帳號是否已經被人取用,因此jQuery.Ajax就可以派上用場了。

假設表單有一個填寫會員帳號的textBox,其ID是txtUserID,資料庫是使用MySQL,資料表的欄位是UserID。首先建立一個預存程序CheckUserID:
DROP PROCEDURE IF EXISTS CheckUserID;
CREATE PROCEDURE CheckUserID( User_ID VARCHAR(10) )
BEGIN
SELECT COUNT(*) FROM member WHERE UserID = User_ID;
END;

在Register.aspx的程式碼如下:



在Register.aspx.cs



在web.config已經有加入SQL連接字串:



以此類推,如果ㄧ次要判斷兩個欄位條件成立,例如我有一個簡訊通知的程式,在傳簡訊之前要馬上知道某個帳號在某個日期是否已經發送過。假設帳號和發送日期的欄位分別為txtUserID和txtPrescriptionOpen,當這兩個欄位其中之ㄧ”失去焦點”之後,分別會去執行以下兩個JQuery.ajax相對應的程式之ㄧ;而資料表message的欄位分別是UserID和Prescription_open。首先也是建立一個預存程序CheckDoubleMessage:
DROP PROCEDURE IF EXISTS CheckDoubleMessage;
CREATE PROCEDURE CheckDoubleMessage( User_ID VARCHAR(10), Prescriptionopen VARCHAR(10))
BEGIN
SELECT COUNT(*) FROM message WHERE UserID = User_ID AND Prescription_open = Prescriptionopen;
END;

在Message.aspx的程式碼如下:




在Message.aspx.cs下



後記:
1.程式中我只加success的處理方式,如果在開發過程中有必要的話也可以加入error的處理方式,一般來說當傳送的參數不正確等情況時就會進入error的。
2.在VS2008開發環境下外掛入jquery-1.4.2.js,IntelliSense會出現錯誤訊息,請也一起下載jquery-1.4.2-vsdoc.js(請下載jquery-1.4.1-vsdoc.js並改名之)到同一個資料夾下,並且再下載安裝VS90SP1-KB958502-x86.exe

參考網址:
http://jquery.com/
學習 jQuery 從入門到精通只要兩小時!


閱讀全文...
就是愛分享
客戶的這台Aspire 8930G有2顆320G的硬碟,所以將原來的系統碟拆下來保留不動,利用另一顆硬碟來做Vista和XP的多重開機。

  1. 利用SPFDISK分割為2個磁區。
  2. 將Vista還原光碟(有3片DVD)安裝到第一個磁區(C:)。
  3. 再利用SPFDISK將第2個磁區設定為開機磁區。
  4. 安裝Windows XP到第2個磁區。
  5. 安裝XP的驅動程式。
  6. 最後利用SPFDISK製作多重開機。
說明:
  1. 利用SPFDISK分割磁區,可以分割2個磁區分別給不同的作業系統,或者也可以再多分割1個以上的邏輯磁區做為資料碟。
  2. Acer的還原光碟會進行磁區分割並還原至C磁碟,但不會產生隱藏磁區,所以還原後開機時無法以Alt+F10呼叫還原程式,更不用說想備份還原光碟。
  3. 因此可以將整個C磁碟以Ghost將整個磁碟備份下來存成image檔,如此就可以將原來的系統碟重新磁區分割製作多重開機了,而當想回復到出廠預設的環境就不用花800元送回維修中心重灌。
  4. 接下來安裝XP時,因為Aspire 8930G是Intel(R) ICH9M-E/M SATA AHCI Controller,所以一開始要先按F6去進行SATA驅動程式的安裝,而此時就必須要有一台軟式磁碟機(USB介面)將剛才的SATA驅動程式安裝進來,否則XP會找不到硬碟而出現藍底白字的畫面。
    要不然就要到BIOS將AHCI模式改成IDE模式囉,不過如此一來,以後進入XP之前都要先設定IDE模式了!!
  5. 如果沒有軟式磁碟機的話,可以利用nLite(http://www.nliteos.com/download.html)將下載的SATA驅動程式整合到XP安裝程式並製作新的安裝光碟,當安裝XP時不用按F6就會自動安裝此SATA驅動程式了。
  6. 再來就是安裝XP的驅動程式,以下連接可找到大部分的驅動程式:http://komku.blogspot.com/2008/11/acer-aspire-8930-windows-xp-drivers.html
    其中如果讀卡機有問題,可以試試下載下列連接點來安裝看看:http://www.downv.com/Windows/install-Z01-cardreader-XP-Vista-v351whql-rar-10180701.htm

閱讀全文...
標籤: 0 意見 | | edit post
就是愛分享
Q:
如何用GMAIL來發信?
A:
假設GMAIL的帳號是account,密碼是password




Q:
如何用超連接傳送變數?
A:
如在任一頁中建超連接:< a href=Edit.aspx?fbid=23>點擊< /a>
在Edit.aspx頁中取值:String str=Request.QueryString["fbid"];


Q:
承上題,當從電子信箱點擊帳號開通信件的網址時,出現「剖析器錯誤訊息 無法辨認的屬性 'type'。」錯誤訊息。
A:
將IIS中ASP.NET版本的組態設定從1.1改成2.0即可。


Q:
如何在SQL語法處理變數?
A:
(a).SQL修改『某紀錄』語法
Update 1a set name = ‘jack’, chi = 90 where id_no=’90001’
(b).當有變數時的SQL修改語法(C#)
”Update 1a set name = '" + textBoxName.Text + "', chi = " + Int32.Parse(textBoxChi.Text) + " where id_no=' " + textBoxNo.Text + "'";

注意:什麼時候要用單引號『’』,什麼時候不用加呢?
字串:字串前後要加上 ‘ 單引號
Values('" & txt_5_PrjCode.Text & "')”

數值:數值前後要不用加,但是所引用的textbox.text要先用Int32.Parse轉換成數值格式
Values(" & Int32.Parse (txt_5_Period.Text) & "')”

日期:字串前後要加上 ‘ 單引號,所引用的textbox.text要先用DateTime.Parse轉換成日期格式
Values('" & DateTime.Parse(txt_5_BeginDay.Text) & "')”


Q:
網頁之間如何傳接值?
A:
1. 使用QueryString變量
QueryString是一種非常簡單的傳值方式,他可以將傳送的值顯示在瀏覽器的地址欄中。如果是傳遞一個或多個安全性要求不高或是結構簡單的數值時,可以使用這個方法。但是對於傳遞數組或對象的話,就不能用這個方法了。下面是一個例子:

a.aspx的C#代碼
private void Button1_Click(object sender, System.EventArgs e)
{
string s_url;
s_url = "b.aspx?name=" + Label1.Text;
Response.Redirect(s_url);
}

b.aspx中C#代碼
private void Page_Load(object sender, EventArgs e)
{
Label2.Text = Request.QueryString["name"];
}

2. 使用Application 對象變量
Application對象的作用範圍是整個全局,也就是說對所有用戶都有效。其常用的方法用Lock和UnLock。

a.aspx的C#代碼
private void Button1_Click(object sender, System.EventArgs e)
{
Application["name"] = Label1.Text;
Server.Transfer("b.aspx");
}

b.aspx中C#代碼
private void Page_Load(object sender, EventArgs e)
{
string name;
Application.Lock();
name = Application["name"].ToString();
Application.UnLock();
}

3. 使用Session變量
想必這個肯定是大家使用中最常見的用法了,其操作與Application類似,作用於用戶個人,所以,過量的存儲會導致服務器內存資源的耗盡。

a.aspx的C#代碼
private void Button1_Click(object sender, System.EventArgs e)
{
Session["name"] = Label.Text;
}

b.aspx中C#代碼
private void Page_Load(object sender, EventArgs e)
{
string name;
name = Session["name"].ToString();
}

4. 使用Cookie對象變量
這個也是大家常使用的方法,與Session一樣,但Cookie是存放在客戶端,而session是存放在服務器端。而且Cookie的使用要配合ASP.NET內置對象Request來使用。

a.aspx的C#代碼
private void Button1_Click(object sender, System.EventArgs e)
{
HttpCookie cookie_name = new HttpCookie("name");
cookie_name.Value = Label1.Text;
Response.AppendCookie(cookie_name);
Server.Transfer("b.aspx");
}

b.aspx中C#代碼
private void Page_Load(object sender, EventArgs e)
{
string name;
name = Request.Cookies["name"].Value.ToString();
}

5. 使用Server.Transfer方法
這個才可以說是面象對象開發所使用的方法,其使用Server.Transfer方法把流程從當前頁面引導到另一個頁面中,新的頁面使用前一個頁面的應答流,所以這個方法是完全面象對象的,簡潔有效。

a.aspx的C#代碼
public string Name
{
get{ return Label1.Text;}
}
private void Button1_Click(object sender, System.EventArgs e)
{
Server.Transfer("b.aspx");
}

b.aspx中C#代碼
private void Page_Load(object sender, EventArgs e)
{
a newWeb; //實例a窗體
newWeb = (source)Context.Handler;
string name;
name = newWeb.Name;
}


Q:
在.NET 3.0下Web Form如何與Dynamic實體網站結合?
A:
必須先建立Dynamic實體網站,然後再將做好的Web Form程式從「我的電腦」拖拉到Visual Studio的「方案總管」,唯專案名稱要ㄧ樣,同時Web.config的SQL連接字串設定要注意,不要覆蓋到Dynamic實體網站的Web.config,例如:



另外注意當SQL的資料表、某資料表的欄位,或者其他有新增、刪除等異動時,只要從"實體資料模型"中按右鍵執行"從資料庫更新模型"即可!

閱讀全文...
就是愛分享
微軟正黑體是Vista之後版本的字型,或者若已經安裝了Office 2007或Visual Studio 2008等微軟軟體的話也會有正黑體。因此Windows XP的使用者,或者沒有安裝提供微軟正黑體的軟體,勢必繼續忍受細明體的"醜"。

當在設計網頁時,為了美化版面,會在CSS設定一些預設字型,微軟正黑體就是首選,然後才是為了以防萬一的新細明體或細明體。因此若沒有微軟正黑體的使用者,將看不到視覺設計師的用心良苦,以下就提供微軟正黑體的下載點:

微軟正黑體下載點

下載後,安裝即可馬上感受到微軟新的改變。不過,對於某些液晶顯示器等的使用者,會發現這個字體卻變得模糊不清,越看越不舒服,其實這要到控制台去設定Clear Type Tuning,提高文字的清晰度。如果控制台沒有Clear Type Tuning工具的話,可以到這個地方下載:

Clear Type Tuning工具

下載完安裝後會直接進入設定步驟,也可以由「開始→設定→控制台→ClearType Tuning」進入,勾選 Introduction 標籤中的「Turn On ClearType」後,點選「Start Wizard」一步一步依序點選最喜歡的顯示字體即可。



安裝以後,工具會協助調整 ClearType 顯示以達到最佳效果,讓使用者更輕鬆舒暢的閱讀螢幕上的文字。另外,安裝後,系統控制面板中會增加一項 ClearType Tuning 配置面板。如果用不習慣亦可從新增移除將之移除。

閱讀全文...
標籤: 0 意見 | | edit post
就是愛分享


一個Ajax互動過程是從一個被稱為XMLHttpRequest的JavaScript物件開始的,再透過JavaScript使用者端腳本,以非同步互動的方式來執行HTTP請求,並對伺服器回應的XML資料進行解析,然後轉換為HTML格式並輔以CSS來呈現在使用者端瀏覽器中。Spry組件(widget):這是一些預設的常用使用者介面元件,可以使用CSS來自訂這些組件,然後將其新增到網頁中。使用Dreamweaver CS4就可以將多個Spry組件新增到頁面中,而這些組件包括XML驅動的清單和表格、折疊式組件、索引標籤式介面,以及具有驗證功能的表單元素。
在Ajax互動過程中,主要包含以下這幾個處理步驟:
  1. 使用者透過使用者端瀏覽器在網頁上執行某個操作,例如單擊按鈕、移動滑鼠或從鍵盤上按下某個按鍵等。
  2. 由於使用者的操作,網頁上發生相對應的DHTML事件。
  3. 透過回應這個DHTML事件,執行相對應的使用者端JavaScript函數,在執行過程中建立一個XMLHttpRequest物件實體,並註冊一個回呼函數,再透過使用XMLHttpRequest物件,以非同步的方式向伺服器端發送HTTP請求,此時可以透過Web頁面繼續與使用者的介面互動,而避免瀏覽器暫停並等待伺服器的回應。
  4. 當伺服器端收到XMLHttpRequest物件的請求時,便可透過ASP、JSP、PHP、ASP.NET等伺服器端技術,對使用者端請求的參數進行解析,然後執行適當的應用邏輯並將回應序列化到XML資料中。
  5. Web伺服器會以標準的XML格式,將回應的資料傳遞給Ajax。
  6. 當伺服器之回應到達使用者端時,JavaScript的回呼函數會被呼叫,並對XML資料進行解析和處理,再透過CSS和DOM實現頁面的局部更新。
  7. 使用者將透過使用者端瀏覽器看到頁面更新。

流行的Ajax框架
JavaScript是Ajax技術的一個主要組成部分,在開發Ajax應用程式的過程中,往往需要編寫大量的JavaScript程式碼。為了減少JavaScript編碼量,並簡化Ajax應用程式的開發任務,目前出現了許多出色的Ajax開發框架。

1.Dojo框架
Dojo是麻省理工學院(Massachusetts institute of Technology,MIT)許可下的一個開發原始碼專案,由Alex Russell和Dylan Schiemann等人在2004年發起,其設計目標是解決DHTML開發中長期困擾人們的一些問題。Dojo是一個JavaScript使用者介面開發工具包,使得編寫JavaScript程式碼更容易,構建大型介面更快速,部署動態的使用者介面更方便。Dojo的基礎是一個小型的函式庫檔案,該檔案包括了Ajax、事件處理、頁面特效及語言工具等。在這個基礎上,在Dojo核心中還新增了一些高品質的工具,例如拖放工具、Ajax擴展表單工具、I/O工具、Json-RPC、國際化及回呼方法等。
可以從http://www.dojotoolkit.org/下載

2.Prototype框架
Prototype是一個基礎性的Ajax開發框架,其檔案尺寸小,但功能很實用,適合用於開發中小型Web應用程式。Prototype提供了跨瀏覽器的相容性支援,對一些JavaScript內建物件進行了擴展,還新增了許多自訂物件,Ajax支援功能也是自訂物件中實現的。
可以從http://www.prototypejs.org/下載

3.script.aculo.us框架
script.aculo.us也是麻省理工學院許可下的一個開發原始碼專案,構建於Prototype框架之上的JavaScript函式庫。script.aculo.us框架的設計目標是幫助開發人員快速建立可展示和操作頁面的各種特效。該框架擁有強大的動畫功能,並且支援各種DOM操作和拖放操作,也提供了一些控制項和小元件,例如自動完成、滑動方塊和原地編輯等。

由於script.aculo.us是一個基於Prototype的框架,因此,使用script.aculo.us框架之前,必須先導入Prototype框架的JavaScript函式庫,然後再導入script.aculo.us的JavaScript函式庫。
可以從http://script.aculo.us/downloads/下載

4.Spry框架
Spry框架是Adobe公司開發,該框架實際上是一個JavaScript和CSS函式庫,可用來建構向網站存取者提供更豐富體驗的Ajax網頁。使用Spry框架就可以顯示XML資料,並建立用來顯示動態資料的互動式頁面元素,而無需更新整個頁面。只要有了Spry框架,就可以使用HTML、CSS和極少量的JavaScript程式碼,把XML資料合併到HTML文件中,也可以建立組件(例如折疊組件和選單欄位)或者在各種頁面元素中新增不同種類的效果。

Spry在設計上與其他的Ajax框架不同,Spry框架的標籤非常簡單,便於那些具有HTML、CSS和JavaScript基礎知識的使用者使用,而且也可以為設計人員和開發人員使用,因為實際上它有99%的部份都是HTML。更為可喜的是,在Dreamweaver CS3之後就提供了對Spry框架的支援。透過Dreamweaver CS3/CS4,就可以使用Spry框架進行動態使用者介面的視覺化設計、開發和部署。

Spry框架主要是透過以下這三種方式來提供對Ajax技術的支援。
  • Spry資料:Spry資料集是透過JavaScript建立的一個物件。只需要在網頁中編寫幾行程式碼,就可以建立一個Spry資料集物件並從指定的資料來源(例如XML文件、HTML表格及JSON物件等)非同步載入資料,然後在網頁上透過Spry區域來顯示資料。
  • Spry組件(widget):這是一些預設的常用使用者介面元件,可以使用CSS來自訂這些組件,然後將其新增到網頁中。使用Dreamweaver CS4就可以將多個Spry組件新增到頁面中,而這些組件包括XML驅動的清單和表格、折疊式組件、索引標籤式介面,以及具有驗證功能的表單元素。
  • Spry效果:這是一種提高網站外觀吸引力的簡單方法,這種效果幾乎可以套用於HTML頁面上的所有元素。透過新增Spry效果就可以放大、縮小、漸隱和反白顯示元素,並在一段時間內已可視方式更改頁面元素,以及執行更多的操作。

5.ASP.NET Ajax框架
ASP.NET Ajax框架是由Microsoft公司所開發,其主要設計目標是對現有的ASP.NET伺服器端模型進行擴展,讓它可以產生實現豐富使用者端的JavaScript程式碼,並透過對ASP.NET增加使用者端程式設計模型來簡化使用者端程式設計。
可以從http://www.asp.net/ajax/downloads/下載。

閱讀全文...
標籤: 0 意見 | | edit post
就是愛分享
當開發ASP.NET專案要配合資料庫,除非是自行架設網站,否則在選擇虛擬主機時,一般都是預設Access。如果要使用MSSQL的話,以智邦為例,就必須選擇MSSQL虛擬主機服務,不過如此一來,就將從年費4,000元飆到12,000元。

因此就考慮改使用MySQL資料庫,後來查了一下有幾家支援MySQL,有的還支援Ajax等功能。如果考量價錢的話,可以選擇國外的主機代管商。

一般Visual Studio是微軟公司為.NET程式設計師所提供的IDE軟體,其還隨附SQL Server Express資料庫伺服器。因此要使用MySQL資料庫的話,可以到MySQL官方網站(http://dev.mysql.com/downloads/)下載MySQL Community Server和MySQL Connector/Net,其步驟如下:

1.安裝MySQL Community Server
目前最新版本是mysql-5-1.47-win32.msi,而安裝時因考慮到以後中文資料輸入的問題,所以一開始先設定「Custom」安裝,然後在「Please select the default character set.」步驟的「Manual Selected Default Character Set/Collation」中從預設的「Latin1」改為「utf8」。



如果之前安裝沒有設定到的話,可以到My.ini設定如下:
[mysql]
default-character-set=utf8

# The default character set that will be used when a new schema or table is
# created and no character set is defined
default-character-set=utf8

2.安裝Connector/Net
下載Connector/Net組件,將mysql-connector-net-6.2.3.zip解壓縮後,執行mysql.data.msi程式即可。

3.Visual Studio連接MySQL
開啟「檢視/伺服器總管」,在「資料連接」上按一下滑鼠右鍵執行「加入資料連接…」,然後執行「變更資料來源」為「MySQL Database」。
Server name:localhost
User name:root
Password:XXX
Database name:test

4. C#程式碼
using MySql.Data.MySqlClient;

SqlClient相關語法前面加上My
MySqlDataAdapter

//SqlCommand
MySqlCommand

//連線字串設定如下
string conString = ConfigurationManager.ConnectionStrings["MyConnection"].ConnectionString;
MySqlConnection conn = new MySqlConnection(conString);

在Web.config檔要有以下內容:



範例:登入檢查帳號是否存在與權限判斷



如果要運用到MySQL的預存程序,例如查詢某個帳號是否已經存在資料庫的話,首先在MySQL執行下列語法:
DROP PROCEDURE IF EXISTS CheckUserName;
CREATE PROCEDURE CheckUserName( User_Name VARCHAR(50) )
BEGIN
SELECT COUNT(*) FROM member WHERE Username = User_Name;
END;

C#程式碼



使用jquery用戶端檢查帳號是否已經有人註冊



參考:[MySQL] 如何接收 Store Procedure 的傳回值

閱讀全文...
就是愛分享
自從蘋果執行長Steve Jobs表示Flash會耗用大量CPU資源,因此iPad不支援Flash,而支援HTML5後,Flash與HTML5的效能就成了大家關注的焦點。

事實經過分別在Mac與Windows系統上,測試Safari、Chrome、 Firefox、IE等主要瀏覽器透過Flash Player與HTML5播放YouTube影片時,各自的CPU負載之測試後的結果是:如果沒有硬體加速的話,Flash的CPU負載的確不低;但是在Windows系統上,支援使用顯示卡硬體加速的Flash Player 10.1可大幅降低CPU負載,表現比HTML5還好。

而今年的Google I/O大會上,重點就放在HTML5技術的應用:Google I/O大會報導

話說到HTML5,在10年前,負責制定WWW網頁格式標準的W3C協會(World Wide Web Consortium)以為4.0版就可以滿足未來各種網頁內容的需求,再也不需要修改HTML格式標準,頂多進行細部規格的調整。但是隨著網路應用程式的發達,W3C協會發現,有越來越多的網站應用程式需求已超出HTML格式所能支援的範疇,甚至使用者需為特定功能額外安裝擴充元件,例如YouTube 採用了Flash格式來播放影音內容。

為了讓HTML語法更容易用來開發各種應用程式,W3C協會從2004年開始制定新的網頁格式標準,也就是HTML 5。在這個新版本中,W3C的制定工作小組大幅增修了多項網頁元素和控制器,於2008年釋出第一個HTML 5草案版本,預定2010年完成功能制定,不再增加新的語法元素,發布2年後若無嚴重問題,2012年再由W3C協會正式發布。

HTML 5旨在提高HTML的交互行,支持當前多樣的,複雜的Web內容。同時,它也會解決HTML 4 Web應用功能上的欠缺,例如:
  1. 一些幫助我們描述內容的新標籤
  2. 改進的Web Forms 2.0,為開發提供許多新選項和新功能,以更簡單更有效地處理表單的輸入與發佈。
  3. 為Web開發提供API,,如音頻和 視頻標籤可以讓開發者不借助第三方工具直接播放 Web 視頻和音頻。
  4. 標籤將允許直接在上面用腳本繪圖:




  5. 用戶可以編輯網頁的部分內容並實現同網頁的交互,,contenteditable屬性允許你設定網頁的哪一部分可以編輯。
不過,在HTML 5也移除了部分原本在HTML 4中的語法,例如Font、Center,開發者必須改用CSS指令來進行這類字體或排版功能的效果。

至於提到CSS,其最重要的目標是將文件的內容與它的顯示分隔開來。在CSS出現前,幾乎所有的HTML文件內都包含文件顯示的信息,比如字體的顏色、背景應該是怎樣的、如何排列、邊緣、連線等等都必須一一在HTML文件內列出,有時重複列出。CSS使作者可以將這些信息中的大部分隔離出來,簡化HTML文件,這些信 息被放在一個輔助的,用CSS語言寫的文件中。HTML文件中只包含結構和內容的信息,CSS文件中只包含樣式的信息。

CSS 3語法中終於直接支援圓角、漸層、陰影等效果,不過很多效果在不同瀏覽器的語法與產生的效果卻不同。

HTML & CSS3 Readiness這份圖表可以很容易看出一些關鍵,它把 HTML5 與 CSS3 從 2008 年到 2010 年各個主流瀏覽器的支援情形以扇形區色塊圖的方式呈現,每個瀏覽器及渲染引擎都有自己的色系。
  1. 目前支援度最高的新特性為 Drag and Drop / @font-face / contenteditable 。
  2. 目前支援度最佳的瀏覽器為 Chrome 與 Safari。
  3. 目前支援度最差的瀏覽器為 IE 系列。




綜合來說,微軟還提供了一個網頁:Internet Explorer 9 Platform Demos讓我們體驗Web的未來趨勢。雖然這是微軟為了測試IE9所設計的網頁,但利用Firefox 3.6, Opera 10.1去看,也是玩的很愉快。畢竟Firefox, Opera瀏覽器跟隨HTML/CSS標準的起步,比IE9要早太多了。

對於一般人來說,可以在該網頁上看看未來的Web應用軟體的UI設計趨勢;對於網頁開發者,可以透過檢視網頁原始碼的功能,把那些新功能全都學起來。

由於各家瀏覽器全面支援還需一段時間,因此HTML 5的影響力得等到2011年後才會充分發酵。

http://www.w3.org/TR/html5/
http://www.w3.org/Style/CSS/

閱讀全文...
標籤: 0 意見 | | edit post