網頁中HTML5與CSS3的應用

才智咖 人氣:2.64W

下面是本站小編為大家搜尋整理的關於網頁中HTML5與CSS3的應用,歡迎參考閱讀,希望對大家有所幫助!想了解更多相關資訊請持續關注我們應屆畢業生培訓網!

網頁中HTML5與CSS3的應用

網頁技術的發展和進步,使得網頁的功能朝著越來越豐富的方向發展,網頁計算機設計技術也在這樣的情況下得以不斷融合。比如HTML5與CSS3兩者之間的融合,為網頁設計打開了全新的局面,有利於提升網頁設計的效益。因此,積極探究HTML5與CSS3的在網頁設計中的應用,顯得尤為必要。

1 HTML的發展,特性和應用

1.1 HTML的發展歷程

HTML英文翻譯全稱為超文字標記語言,是用來描述網頁文件的標記語言。1991年Tim Berners-Le編寫了名稱為HTML標籤的文件,裡面涉及到20多個標記網頁的HTML標籤,他在借用SGML標記格式之後,形成了HTML的標記格式,由此打開了HTML的發展歷史:(1)從IETF到W3C的轉變。實際上HTML的第一個官方版本是有IETF推出的HTML2.0。早在1994年的時候,有瀏覽器就在這樣的超文字語言標準下實現了文件嵌入圖片,並且以img的標籤納入到HTML2.0體系中去。隨後W3C漸漸成為HTML的標準組織,在對於HTML多數的修改之後,終於在1999年的時候推出了HTML4.0。(2)XHTML1,具備XML風格的HTML。繼HTML4.0之後,出現了第一次修訂的版本,那就是XHTML1.0,其關注於其擴充套件方面的效能,因為其對於語法方面的嚴格要求,並沒有在使用方面表現出隨意性,影響到此版本的使用效益。但是此時CSS的不斷崛起,也使得網頁設計者意識到XHTML的應用前景。(3)W3C推出XGTML1.1,XHTML1.1再也無法使用直接輸出,即使此時網頁設計者使用此版本的語言,但是由於主流瀏覽器的不支援,就使得其陷入到被架空的地步。(4)W3C推出了XHTML2,但是由於其在相容方面的問題,難以發揮其效能,接著越來越多的主流瀏覽器開始對於W3C的開發行為提出反對,並且要求在HTML的基礎上實現新的拓展,在沒有達成共識之後,主流瀏覽器自發組織成立了超文字應用技術小組,那就是WHATWG,他們關注於Web Forms2和Web Appsl,並且將其融合在一起,形成了全新的HTML5的規範。

1.2 HTML的特性

從本質上來講,HTML文件製作的過程並不是很複雜,很多時候都可以依靠其強大的功能去進行處理,甚至支援不同資料格式文字的嵌入。具體來講其特性主要體現在以下幾個方面:(1)簡易性,基於超集方式可以使得其升級變得更加靈活和方便;(2)擴充套件性,有著較強的擴充套件性;(3)平臺無關性,對於應用平臺沒有過多的要求。

1.3 HTML的應用

HTML技術體系不斷完善,功能越發強大,在網頁設計過程的應用也越來越頻繁。一般情況下,HTML作為基本標記語言,主要在以下幾個方面發揮效能(1)實現靜態網頁的編寫,多數情況下以為結尾的網址就是在HTML的基礎上誕生的,通常看到的網頁原始碼就是標記語言;(2)實現動態網頁的編寫,主要會以PHP或者ASP等語言方式去呈現網頁的動態效果。

2 CSS的發展、特性和應用

2.1 CSS的發展歷程

1994年哈坤利提出構建CSS的提議,當時正在設計一款瀏覽器的伯特・波斯與其實現合作,開展了CSS的設計工作。在當時CSS作為第一個含有層疊意識的語言,給予讀者和作者更多的自由行,以實現設計效益的提升。隨後他們在1994年芝加哥的一次會議上展示了CSS,隨後兩人就組織成立了技術小組,終於在1996年完成了CSS,次年12月份第一本公開版本被出版。1997年初,W3C內組織了專管CSS的工作組,並且在1998年推出了第二個版本CSS2.1。CSS3現在還處於開發中,CSS 3在包含了所有CSS 2所支援的基礎上更有所改進。

2.2 CSS的特性與應用

CSS中文翻譯為層疊樣式表單,其可以很方便的運用到網頁外觀控制上去。具體來講,其特性主要體現在以下幾個方面:(1)可以同時實現多個網頁樣式的更新;(2)使得網頁的表示層和結構層處於分離的狀態,不至於受到彼此的影響;(3)使得網頁檔案的大小得到了縮減;(4)對於提升網頁載入速度來講,有著積極作用。因此,CSS樣式表被大量運用到網頁設計實踐工作中去。

3 HTML與CSS在網頁設計中的應用

從理論上來講,HTML和CSS3有著自己的優勢和特點,關注的方向也存在差異性,運用的領域也展現出很多的不同之處。但是隨著近幾年網頁設計理念的革新,網頁設計的範圍被延展,移動終端的不斷出現,越來越多的設計人員開始意識到其兩者的融合,可以在促進網頁設計工作質量提升方面發揮著巨大的作用。當HTML5與CSS3在網頁設計方面的融合效益被展現出來之後,就有越來越多的網頁設計人員開始參與到探索和嘗試中去,遵循兩者之間的不同之處,充分發揮各自的優勢,解決當前各種困難,已經成為當前網頁設計人員的公司。筆者結合自身從事網頁設計的工作經驗,認為兩者之間的融合運用可以在以下幾個方面發揮積極效能。

3.1 在移動上網平臺中的設計運用

從當前網頁設計的工作來看,HTML5與CSS3是使用率比較高的技術模式,尤其在移動網頁設計,網頁表單製作的過程中發揮著越來越重要的作用。我們知道,傳統的移動上網裝置由於配置方面的問題,其網頁瀏覽的功能往往受到侷限,或者不能看視訊,或者不能獲得高清的效果,為了解決這樣的問題很多網站都在建立移動網際網路版本,往往消耗大量的人力和物力。但是如果在此網格設計的過程跟蹤,充分利用HTML5與CSS3的話,不僅僅可以實現跨平臺操作,還能夠使得使用者獲得最佳的使用者體驗。以網頁介面大量圖片插入為例,傳統模式下不僅僅會使得網頁執行速度受到制約,還會使得客戶的.體驗度不斷降低。此時利用HTML5和CSS3技術,設計出有效的網頁表單互動設計模型,如此一來就可以避免網頁執行速度緩慢的問題。

3.2 在跨瀏覽器調整方面的設計應用

不得不承認的是在HTML5和CSS3技術幫助下,的確可以使得設計者獲得更多的設計工具和方法,但是難以實現在跨瀏覽器的調整,如果出現特殊版本的因特網搜尋引擎的話,就需要對於附加設定和幫助進行識別。為了能夠解決這樣的難題,可以嘗試以HTML5SHIM的開放的JAVASCRIPT檔案對於網路搜尋引擎進行識別。當然此項功能不能僅僅依靠搜尋引擎本身。另外還可以對於頁面結構進行調整和編輯,在網頁可編輯的區域,利用Ajax實現更新內容的儲存,並且將其納入到資料庫中去,以便在任何時候都可以對於對應的資料資訊進行訪問。當然HTML5與CSS3的功能的確強大,但是還難以進行跨瀏覽器的操作,但是這將是未來兩者實現更好融合的切入點,也是網頁設計的發展趨勢。

綜上所述,HTML5與CSS3的發展和進步,是無數網頁設計人員艱苦奮鬥的結果,其在提升網頁設計效果,增強其使用者體驗度方面發揮著越來越重要的作用。尤其在當前各種語言技術相互融合,彼此之間的交叉不斷出現,統一的標準和規範,可供擴充套件的介面,都為實現技術的融合和發展營造了良好的外在環境。人們需要看到的是HTML5與CSS3之間的關係也是不容忽視的,兩者之間存在的各種異同點都會為兩者的融合效益發揮打下基礎。作為網頁設計人員應該樹立發展的理念,正確認識這兩者之間的關係,不斷將兩者運用到網頁設計的工作中去,以發揮兩者的融合效應。

TAGS:HTML5 網頁 CSS3