一些HTML程式碼的寫作風格建議小結_HTML/Xhtml_網頁製作

省略資源檔案的協定

建議省略掉圖片, 媒體檔, 樣式和腳本URL 中的協議部分(http:, https:), 省略掉協議部分後, 資源文件將繼承頁面URL 的協議. 不但可以防止內容混用的問題,還可以減小頁面的尺寸. 例如: 引用一個JavaScript 檔案可以用下面建議的方式來寫.

為什麼 h4, h5, h6 標籤很少用到?

標題標籤包括 h1 到 h6, 我們常用 h1, h2, h3, 但極少用到 h4, h5 和 h6.

在一個合理語義化, 敢於裸奔(不使用CSS 進行佈局) 的網站裡面, 標題標籤除了語義化, 還帶有一些樣式作用. 但在CSS 普及的今天, 用h1 和h6 其實沒有太大差別, 反正外觀也能隨便套.

作為標題標籤, 有更牛逼的功能, 標題元素意味著頁面上高權值的關鍵字, 所以h1, h2 和h3 被頻繁利用來為關鍵字加權. 而h4, h5 和h6 的權數值並不高, 甚至比不上strong 和em, 所以很少被用到. 估計他們權限層次如下:

h1 > h2 > h3 > strong > em > h4 > h5 > h6

何時使用 thead, tbody 或 tfoot?

我本來認為thead 作為表頭用來放表格標題單元, 如th; 而tbody 是放表格內容, tfoot 是表格說明. 其實我的理解不太正確, 這幾個標籤其實是可有可無的.

因為瀏覽器一般需要整個表格下載完才開始顯示, 在以table 為佈局的時代影響用戶閱讀. 所以這幾個標籤是用來將表格劃分成多個表格部分, 下載完成部分即可顯示. 另外, 也為了列印長表格時的時候表頭和表尾可以在每一頁出現.

省略掉可選的標籤

用過 Dreamwave 的同學應該有印象, 當你建立一個 HTML 檔案, 預設有程式碼如下.

XML/HTML Code複製內容到剪貼簿

1. html>  
2.  head>  
3.  head>  
4.     
5.  身體>  
6.  body>  
7. html>  

我們會將 title, 外部 CSS 和 JavaScript 引用放在 head 區域, 在頁面上展示的內容放在 body 裡面, 但其實 html, head 和 body 都是可省略的標籤.

將這些可選標籤刪除之後, 看起來很怪, 但頁面顯示正常, W3C 檢測也能通過. 我已經在博客上這樣處理了. 但有一點需要注意的, 如果你希望用XHTML 編寫頁面, 那麼請保留html 標籤, 因為你仍需要下面這句程式碼作為聲明.

XML/HTML Code複製內容到剪貼簿

1. html xmlns=xmlns=xmlns=

xmlns

= w3.org/1999/xhtml">  

b タグと i タグ

b タグと i タグは u タグと同じ運命にあり、W3C では「非推奨タグ」に分類されていると考えている人が多いですが、HTML5 の仕様では、この 2 つのタグは依然として推奨されています。このことについては、私も友人と議論しましたが、HTML5 で定義する方法がまったくわかりませんでした。

時間タグ

hr はコンテンツを区切る線であり、CSS で処理できるかどうかに関係なく、hr は役に立たないものだと常々思っていました。記事の文脈が完全に分離されており、無関係になります。

これは、hr が意味的に同じであり、クローラーもそれを理解できる点を除いて、多くのブログ投稿に登場する下の図の境界線と同様に機能します。
なぜタグをボタンとして使用するのですか?

以前のバージョンの IE ではホバー効果が見られないため、input type="button" ではないことは理解できますが、なぜ a タグがタグではなく、href なしでボタンになっているのでしょうか。このアプローチは正しいですよね? まだ考えていませんでしたが、これは条件反射のようでした。

あとがき

Google の HTML/CSS コーディング スタイル ガイドは、短く簡潔に推奨されるコード記述マニュアルです。これは非常に便利ですが、その中にはインデントに 2 つのスペースを使用することを推奨する項目があります。はい、私たちのチームはまだタブを使用しています。

このマニュアルの HTML 提案の多くは HTML5 向けですが、ここでは XHTML スタイルではなく HTML スタイルが使用されており、コードを省略すると実際にコードの可読性が低下します。 .