域名注冊 網(wǎng)站制作
您現(xiàn)在的位置：首頁 >> 網(wǎng)站建設(shè) >> 內(nèi)容

WEB標(biāo)準(zhǔn)-標(biāo)準(zhǔn)測試

時(shí)間：2014/11/18 15:58:15 點(diǎn)擊：318

摘要：標(biāo)準(zhǔn)測試內(nèi)容 頁面校驗(yàn)地址 CSS文檔校驗(yàn) XHTML 1.0 標(biāo)準(zhǔn)規(guī)格 測試時(shí)一定要有文件類別宣告還有指定文件編碼 才能順利進(jìn)行測試動(dòng)作，開始打造一個(gè)標(biāo)準(zhǔn)的網(wǎng)站...

標(biāo)準(zhǔn)測試內(nèi)容

頁面校驗(yàn)地址 http://validator.w3.org/

CSS文檔校驗(yàn) http://jigsaw.w3.org/css-validator/

XHTML 1.0 標(biāo)準(zhǔn)規(guī)格 : The Extensible HyperText Markup Language

W3C標(biāo)準(zhǔn)測試網(wǎng)址 http://validator.w3.org/

測試時(shí)一定要有文件類別宣告還有指定文件編碼

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

才能順利進(jìn)行測試動(dòng)作，開始打造一個(gè)標(biāo)準(zhǔn)的網(wǎng)站！

W3C標(biāo)準(zhǔn)測試使用說明

1.XHTML 1.0文件類別宣告的正確寫法 (不可小寫)

過度標(biāo)準(zhǔn)（外語全稱：Transitional）

公共標(biāo)識(shí)符[1] 稱為：“-//W3C//DTD XHTML 1.0 Transitional//EN”。

<!DOCTYPE html

PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

>

框架標(biāo)準(zhǔn)（外語全稱：Frameset）

公共標(biāo)識(shí)符[1] 稱為：“-//W3C//DTD XHTML 1.0 Frameset//EN”。

<!DOCTYPE html

PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"

>

嚴(yán)格標(biāo)準(zhǔn)（外語全稱：Strict） 包含以上須注意的問題,還有其他更嚴(yán)格的標(biāo)準(zhǔn)

公共標(biāo)識(shí)符[1] 稱為：“-//W3C//DTD XHTML 1.0 Strict//EN”。

<!DOCTYPE html

PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

>

2.頭文件問題

所有的網(wǎng)頁頭文件都一律都改為標(biāo)準(zhǔn)形式，寫法如下：

<head>

<meta

http-equiv="content-type"

content="text/html; charset=gb2312" />

<meta http-equiv="content-language" content="zh-cn" />

<meta name="keywords" content="..." />

<meta name="description" content="..."/>

<title>...</title>

</head>

3.不允許使用target="_blank"

在HTML4.01可以使用target="_blank",但XHTML1.0是不被允許的.

我使用了一個(gè)HTML4.0的新屬性：rel，這個(gè)屬性用來說明鏈接和包含此鏈接頁面的關(guān)系，以及鏈接打開的目標(biāo)。

原來這樣寫的代碼： 打開一個(gè)新窗口

現(xiàn)在要寫成這樣：打開一個(gè)新窗口

這是符合strict標(biāo)準(zhǔn)的方法。當(dāng)然還必須配合一個(gè)Javascript才有效。

javascript完整的代碼JS如下：

function 外部鏈接()//萬國碼unicode javascript

{

if (!document.getElementsByTagName) return;

var anchors = document.getElementsByTagName("a");

for (var i=0; i<anchors.length; i++)

{

var anchor = anchors;

if (anchor.getAttribute("href") &&

anchor.getAttribute("rel") == "external")

anchor.target = "_blank";

}

}

window.onload = 外部鏈接;

你可以把它保存成一個(gè).js文件(比如外部鏈接.js)，然后通過外部聯(lián)接方法調(diào)用：

<script type="text/javascript" src="外部鏈接.js"></script>

4.XHTML 1.0要求所有的標(biāo)簽必須關(guān)閉

所有沒有成對(duì)的空標(biāo)簽必須以 />結(jié)尾

和這就是成對(duì)

錯(cuò)誤

<hr>

正確

<hr />

錯(cuò)誤 <input type="text" name="name">

正確 <input type="text" name="name" />

錯(cuò)誤 <meta ...>

正確 <meta ... />

錯(cuò)誤 <link rel="stylesheet" type="text/css" href="style.css">

正確 <link rel="stylesheet" type="text/css" href="style.css" />

錯(cuò)誤 <img src="bg.gif" border="0" alt="說明文字">

正確 <img src="bg.gif" border="0" alt="說明文字" />

5.所有標(biāo)簽元素名稱都使用小寫

錯(cuò)誤 <HTML> <TITLE> <HEAD> <BODY>

正確 <html> <title> <head> <body>

錯(cuò)誤 <IMG SRC="BG.GIF" BORDER="0" ALT="說明文字">

正確 <img src="bg.gif" border="0" alt="說明文字" />

錯(cuò)誤 <UL><LI></LI></UL>

正確 <ul><li></li></ul>

以上只是舉例,是"所有"標(biāo)簽元素名稱都必須是小寫

6.同一個(gè)id選擇器不可重復(fù)使用

一個(gè)網(wǎng)頁中id="xx"同一個(gè)選擇器不能重復(fù)使用,若需要重復(fù)請(qǐng)用class="xx"

7.標(biāo)簽必須是一對(duì)

[font][/font]

8.正確的標(biāo)簽順序

錯(cuò)誤文字

正確文字

9.JavaScript寫法

Javascript我們通常會(huì)寫為

錯(cuò)誤 <script language="javascript">

W3C標(biāo)準(zhǔn)必須為程式指定類型type=text/javascript,所以要寫為

正確 <script type="text/javascript">

或者 <script language="javascript" type="text/javascript">

載入外部.js獨(dú)立檔案的寫法

正確 <script type="text/javascript" src="script.js"></script>

10.絕對(duì)不可省略雙引號(hào)或單引號(hào)

錯(cuò)誤 style=font-size:9pt

正確 style="font-size:9pt"

錯(cuò)誤 <img src=bg.gif width=140 height=30 alt=text />

正確 <img src="bg.gif" width="140" height="30" alt="text" />

錯(cuò)誤 text

正確 text

11.圖片標(biāo)簽加上文字說明alt="說明"

錯(cuò)誤 <img src="bg.gif" height="50" border="0" />

正確 <img src="bg.gif" height="50" border="0" alt="說明文字" />

12.背景音樂不允許使用 bgsound 標(biāo)簽

我只好用JavaScript解決這個(gè)問題。javascript完整的代碼如下：

<!-- Begin

var MSIE=navigator.userAgent.indexOf("MSIE");

var NETS=navigator.userAgent.indexOf("Netscape");

var OPER=navigator.userAgent.indexOf("Opera");

if((MSIE>-1) || (OPER>-1)) {

document.write("<BGSOUND SRC=背景音樂地址 LOOP=INFINITE>");

} else {

document.write("<EMBED SRC=背景音樂地址 AUTOSTART=TRUE ");

document.write("HIDDEN=true VOLUME=100 LOOP=TRUE>");

}

// end -->

你可以把它保存成一個(gè).js文件(比如bjmusic.js)，然后通過外部聯(lián)接方法調(diào)用：

<script type="text/javascript" src="bjmusic.js"></script>

13. 標(biāo)簽的爭議

<embed>是Netscape的私有標(biāo)簽,W3C 從HTML3.2 HTML 4.01 到 XHTML 1.0 中都沒有這個(gè)標(biāo)簽,所以使用的頁面是不能通過標(biāo)準(zhǔn)測試。

W3C推薦使用 <object> 標(biāo)簽,用<object>插入flash影片的代碼可以寫為:

<object type="application/x-shockwave-flash" data="index.swf" width="400" height="200">

</object>

但這樣的寫法可能IE5/IE6 Win瀏覽器版本會(huì)出現(xiàn)問題。

標(biāo)簽因?yàn)閺V大的受到運(yùn)用,不再標(biāo)準(zhǔn)范圍引起很大的爭議，想要解決這個(gè)問題，只能等IE瀏覽器對(duì)<object>有更好的支持或者W3C愿意收錄標(biāo)簽。

14. 不允許使用框架標(biāo)簽<IFRAME>

這次又要用JavaScript解決問題了。javascript完整的代碼如下：

function ifr(url,w,h){document.write('<iframe id="ifr" name="ifr" width="'+w+'" height="'+h+'" border="0" frameborder="0" scrolling="no" src="'+url+'"></iframe>');}

把它保存成一個(gè).js文件(比如ifr.js)，然后通過外部聯(lián)接方法調(diào)用：

<script type="text/javascript" src="ifr.js"></script>

在你需要插入框架的地方寫以下代碼即可：

<script type="text/javascript">ifr('需插入的網(wǎng)頁地址','567','485');</script>

函數(shù)ifr()使用說明：ifr('這里寫地址','這里寫寬度','這里寫長度',)

15.google廣告問題

google廣告的代碼是不符合W3C標(biāo)準(zhǔn)的，我只好又把它轉(zhuǎn)成JS調(diào)用，但GOOGLE政策里是寫著不允許修改代碼的，

關(guān)于這點(diǎn)我正在寫信給GOOGLE詢問中，應(yīng)該很快會(huì)有答案。

我的JS文件(google.js)代碼如下：

document.writeln("<script type=\"text\/javascript\"><!--");

document.writeln("google_ad_client = \"pub-0538745384335317\";");

document.writeln("google_ad_width = 125;");

document.writeln("google_ad_height = 125;");

document.writeln("google_ad_format = \"125x125_as\";");

document.writeln("google_ad_type = \"text_image\";");

document.writeln("\/\/2007-06-29: www.ybj86.cn");

document.writeln("google_ad_channel = \"4751988107\";");

document.writeln("google_color_border = \"1a1a1a\";");

document.writeln("google_color_bg = \"1a1a1a\";");

document.writeln("google_color_link = \"d0eb6a\";");

document.writeln("google_color_text = \"ffffff\";");

document.writeln("google_color_url = \"8ad459\";");

document.writeln("google_ui_features = \"rc:6\";");

document.writeln("\/\/-->");

document.writeln("<\/script>");

document.writeln("<script type=\"text\/javascript\"");

document.writeln(" src=\"http:\/\/pagead2.googlesyndication.com\/pagead\/show_ads.js\">");

document.writeln("<\/script>")

各位朋友可以按照自己的情況修改，網(wǎng)上也有把HTML代碼轉(zhuǎn)為JS代碼的地方。

最后在需要掛廣告的地方放入代碼 <script type="text/javascript" src="google.js"></script>

其他需注意的地方：

16.注解文字不可包含--符號(hào)

錯(cuò)誤 <!-- OEC--SPACE -->

正確 <!-- OECSPACE -->

17.正確使用CSS樣式表

一定要放在<head></head>之間

<link rel="stylesheet" type="text/css" href="style.css" />

<style type="text/css">

<!--

body{font-size:9pt;}

-->

</style>

錯(cuò)誤 <style>

正確 <style type="text/css">

18.使用表格常犯的錯(cuò)誤

我們在做表格通常會(huì)指定寬與高,例如:

內(nèi)容

這樣做是沒有辦法通過,W3C建議使用CSS來控制標(biāo)簽元素的高度

.table{

height:55px;

}

TEXT

但是若使用太多表格,在CSS一一指定不同高,也不是好方法

其實(shí)很簡單將高度height屬性指定在儲(chǔ)存格就可以了通過測試

TEXT

但這不是w3c希望的標(biāo)準(zhǔn),建議能夠使用div代替不必要的table

19.非標(biāo)簽一部分的符號(hào)以編碼表示

表單內(nèi)包含以下符號(hào)也必須用編碼表示

< 以 &lt; 表示

> 以 &gt; 表示

& 以 &amp; 表示

程式中的連結(jié) & 也要改用 &amp;

錯(cuò)誤 <a href="foo.cgi?chapter=1&ion=2">

正確 <a href="foo.cgi?chapter=1&amp;ion=2">

20.所有屬性都必須有值

XHTML1.0規(guī)定所有屬性都必須有值,若沒有就必須重復(fù)屬性作為值

錯(cuò)誤 <input type="radio" value="v1" checked name="s1" />

正確 <input type="radio" value="v1" checked="" name="s1" />

錯(cuò)誤 <option selected>S1</option>

正確 <option selected="selected">S1</option>

轉(zhuǎn)載請(qǐng)保留原文地址: http://headlineschannel.com/show-348.html

責(zé)編：王麗　作者：不詳　來源：網(wǎng)絡(luò)