HTML 编码规范


1. 应用范围
本编程规范适用于需要编写HTML代码的网页程序开发人员。

2. HTML编码规范
HTML并不是一种编程语言,而是一种标记语言,它没有任何真正的编程语言中的循环或是流程控制语句。然而,HTML代码的格式和风格是非常重要的,因为要经常对HTML代码进行维护和修改,因此HTML代码必须有很清晰的逻辑结构和布局,而使其易懂和易于维护。

2.1 标记的书写
HTML语言是不区分大小写的,但一般来说,标记使用大写书写,如<P>, <HTML>, <TABLE>等;标记中的属性一般使用小写,如<A href=”a.html”>, <font size=”5”>等。

2.2 标记的换行规范
一般一个HTML代码都会很长很复杂,因此不要把代码写得很密,这样的可读性非常差,HTML对回车和空格都不敏感,因此可以使用回车和空格,使代码的格式和结构更清晰,这样才能易于维护。很多标记一般来说要占用一行,除了同一标记的关闭标记外,最好不出现两个标记在同一行的情况。如

<TABLE><TR><TD>text</TD></TR></TABLE>

应写成:
<TABLE>
    <TR>
       
<TD>text</TD>
    </TR>
</TABLE>


1  通常情况下,应该换行的标记有:

 <HTML></HTML>
 <BODY></BODY>
 <HEAD></HEAD>
 <FORM></FORM>
 当段落内容比较长时,<P></P>也应各占一行
 各种列表标记
 表格的相关标记
 <BLOCKQUOTE>和</BLOCKQUOTE>
 <PRE>和</PRE>
 <CODE>和</CODE>


2  通常情况下,需要将开始和关闭标记放在一行的标记有:

 <B>和</B>
 <U>和</U>
 <I>和</I>
 各种标题标记,如<H1>…</H1>等
 <A>和</A>


2.3 标记的关闭规范:

1
  HTML文档的正文都应在<BODY></BODY>标记中间,而<BODY>标记则应包含在<HTML>和</HTML>标记之间,如:

<HTML>
<BODY>
…………
</BODY>
</HTML>


2  对于需要关闭标记的标记,如<HTML>, <TITLE>, <BODY>, <TABLE>, <TR>, <TD>, <P>, <TEXTAREA>, <SELECT>, <FONT>, <OPTION>, <DIV>, <SPAN>等标记,都必须有相应的关闭标记出现,否则一方面使程序的可读性差,更重要的是会引起页面格式显示混乱。正确地写法应为:

<BODY>
  
<P>
    
<FONT>……</FONT>
  
</P>
</BODY>


3  不能出现标记交叉的情况,如:

<P><FONT>……</P></FONT>

 

2.4 标记的属性值规范

对于标记中的属性值,最好使用双引号或单引号包围,这样的话不易出错。如:

<INPUT type=text  value=Hello World!  length=20>


本来是希望在文本框中显示“Hello world!”,但是由于没有加上引号,则只会在文本框中显示“Hello”,因此,正确地写法为:

<INPUT type="text"  value="Hello World!"  length="20" >

 

2.5 标记的缩进规范

1 最高一级的父标记采用左对齐顶格方式书写。

2 下一级标记采用左对齐后,缩进2个空格的方式书写。再下一级则以此类推。

3 同一级标记的首字符上下应对齐。

例如:

<P>
<TABLE>
    
<TR>
        
<TD> … … … </TD>
       
<TD> … … … </TD>
   
</TR>
   
<TR>
       
<TD>
           
<TABLE>
              … … … 
           
</TABLE>
       
</TD>
       
<TD> … … </TD>
   
</TR>
</TABLE>


2.6 注释
在任何代码中都应该有做注释的好习惯,在一个复杂的HTML代码中,友好的注释是非常有用的,特别是在有很多嵌套的表格中。HTML中使用<!--… … -->来做注释。如:

<TABLE>
   
<TR>   <!-- ROW 1-->
       
<TD>      <!-- COL 1-->
         …… ……
       
</TD>
        <TD>      <!-- COL 2-->
         …… ……
       
</TD>
   
</TR>
   
<TR>   <!-- ROW 2-->
       
<TD>      <!-- COL 1-->
         …… ……
       
</TD>
        <TD>      <!-- COL 2-->
         …… ……
       
</TD>
   
</TR>
</TABLE>

 

posted @ 2008-06-05 17:25  guangrou  阅读(3596)  评论(3编辑  收藏  举报