論web標準的網頁制作和符合web標準的網站UI_CSS教程

Web標準的web UI——來源、謬誤與個人理解

序

我從2004年末開始接觸web標準，2005年5月正式采取完全的web標準方式的網頁制作，2005年8月，第一個符合web標準的網站UI開發工作完成。直至今日，經歷了無數的艱辛，也有過許多的困惑。所幸，我的瑞典籍的Project Leader是一個很有經驗的人，他告訴了我很多關于web標準國內并不了解的東西，我這幾年技術方面的成長離不開他的支持和引導，感謝Andreas Liljefilt！在這里，我把它們告訴大家，也希望能有更多的人來討論。

Chaper 1 什么是web標準？Div css的謬誤。

提到web標準，就不得不先說一說國內業界非常流行的一個詞——Div css。這個詞在國內簡直是一個潮流，不僅互聯網上一直在提，大量的教程中使用這個詞，就連一些出版的書籍也是用了這個概念。然而，甚少人知道的是，這個概念本身是錯誤的。有好事的朋友不妨去google搜索一下（先調整到英文界面，這樣可以強制讓它搜索google.com而不是google.cn），"div css"這樣一個要害字是根本找不到任何一個英文網頁，全部都是中文的。沒錯，其實所謂的div css就是一個中國特有的理解和概念。我甚至不知道這個詞是誰先提出來的，然而，它對web標準中xhtml/css的網頁構建方法的理解幾乎是完全錯誤的。

回歸正題，web標準究竟是什么？Web標準是w3c組織規定的各種web上所使用的語言的標準和規范的集合。

我們目前究竟接觸到了web標準的多少？打開 w3c的官方網站，我們在左側可以看到如下列表：

引用:
# Accessibility
# Amaya
# CC/PP
# Compound Document Formats
(CDF)
# CSS
# CSS
Validator
# Databinding
# DOM
# Efficient XML
Interchange
# eGovernment
# GRDDL
# Health Care and Life
Sciences
# HTML
# HTML Tidy
# HTML Validator
# HTTP
# Incubator
# InkML
# Internationalization
# Jigsaw
# Libwww
# MathML
# Mobile Web Initiative
(W3C-MWI)
# Multimodal
Interaction
# OWL
# Patent Policy
# PICS
# PNG
# POWDER
# Privacy and P3P
# RDF
# Rich Web Clients
# Rules
# Security
# Semantic Web
# Service Modeling Language
(SML)
# SMIL
# SOAP/XMLP
# SPARQL
# Style
# SVG
# Timed Text
# URI/URL
# Validators
# Voice
# Ubiquitous Web
Applications
# WAI
# Web API
# Web Application
Formats
# Web Architecture
(TAG)
# WebCGM
# Web Services
# WS-Addressing
# WS-CDL
# WSDL
# WS-Policy
# XForms
# XHTML
# XHTML2
# XLink
# XML
# XML Base
# XML Encryption
# XML Key Management
# XML Processing
# XML Query
# XML Schema
# XML Signature
# XPath
# XPointer
# XSL and XSLT

全看下來后是不是覺得很暈？沒錯，這個就是web標準目前的全部技術規范。web標準包含了這么多的內容，而我們目前所說的div css只是其中xhtml/css實現方式的不完整的一部分而已。

* 為什么是xhtml/css？

其他的部分，我不想說的太多，第一是因為我也沒辦法全都弄懂，第二是其中有一大半瀏覽器支持不完全甚至根本就不支持。XML是web標準中對網頁實現的最終目標。也就是web頁面數據化和語義化，然而由于瀏覽器的支持不完善和兼容問題，目前優秀、兼容性強的純xml網站只是停留在幻想里而已。因此，現在主流的網頁實現方式就是xhtml/css。首先，xhtml與html大部分兼容，并且可以讓目前大多數的瀏覽器直接閱讀。css主流的幾大瀏覽器也支持的非常完善。再加上ECMAScript(不說Javascript的原因是Javascript的概念中包含了很多與標準不同的瀏覽器私有定義)，已經足夠實現web UI布局的大部分需要了。