畫廊在HTML5中應該包含哪些元素？

Question

當我在HTML5中製作圖片庫時，是否應該有任何像section或article這樣的半縮寫標記，或者它只是一個div？

Answer 1

如果有意義，則可以使用section;如果有意義，則可以使用aside。 否則使用div。

畫廊沒有語義標籤，例如audio或video，因此您可能需要 想要使用div。

這是直到Web Components被釋放:)

Answer 2

如果使用的是HTML5，然後使用語義標籤建議，應該前進的方向，而不是使用div的。

事實上，一個畫廊甚至可以很好地映射到語義標籤。對於例如一個部分可以包含文章列表，即單個圖像。 aside可以提供有關特定圖像的更多信息等。

一個很好的文章，顯示如何使用figure和figcaption是在這裏：http://html5doctor.com/the-figure-figcaption-elements/

Answer 3

這取決於圖像庫的情況下。

如果圖庫與主要內容相關，則在主要內容中將其作爲section是有意義的。

article標記應該在其內部的內容有意義時使用，例如，個人博客帖子。使用article標籤標記的內容在內容需要聯合（例如RSS提要）時也會產生很大的意義。要解釋這個最後一點，W3C explains：

當專門用於聯合內容重新分配的內容時，該文章元素的用途與Atom中的entry元素相似。

div標記用於元素的通用分組。如果任何其他標籤不適合用於該目的，則應該使用它，並且爲了樣式或腳本目的需要分組。根據W3C's recommendation：

強烈建議作者將div元素作爲最後手段的元素來查看，因爲當沒有其他元素適合時。使用更合適的元素而不是div元素可以爲讀者提供更好的可訪問性，並使作者更易於維護。

要回到你的問題，如果圖像庫與您的內容（例如在博客中的圖片庫），我會article整個博客文章，並有section的圖片庫。有人可能會爭辯說，如果畫廊沒有標題，它不應該是section，所以應該標記爲div。然而，W3C提供了一個非常好的方式來思考其網站上的各個部分（對不起，不能發佈超過2個鏈接，重複數少於10個！）：

一般規則是，section元素只有在元素的內容將在文檔的大綱中明確列出時才適用。

如果你仔細想一想，在文章的大綱（例如博客文章）中列出圖庫是非常有意義的。如果文章具有特定的簡介文本，即使這可能會列在文章的大綱中。在概念上將概要視爲文章的一種內容表格，列出其各個部分。

就像我之前說過的，它真的取決於上下文。

編輯：

關於畫廊本身的圖像，是有意義的有他們內部figure，通過Romin的建議。要回答你的評論：

thanx，但我不認爲是在這裏，因爲他們說它「可以從文檔的主流中移走而不影響文檔的含義。」因此，它是爲裏面的文字圖片，如果我從庫中刪除圖像，會影響它的意思

真的建議什麼W3C是：

元素（figure）因此可用於標註插圖，圖表，照片，代碼清單等，這些內容是從文檔的主要內容引用的，但是可以在不影響文檔流程的情況下將其從主要內容移開，例如到頁面一側，專用頁面或附錄。

換句話說，要問的問題是，是否該圖片庫可以從主內容（即博客文章的內容或文字）移動，而不影響文檔的流動。本質上，圖像畫廊實際上可以遠離文檔的主要內容，說出一個側欄，而其位置/順序的改變不會影響內容的解釋方式。如果其立場確實有影響，那麼figure在該特定情況下不適用。總之，如果內容（圖片庫）對於文檔很重要，但是它在內容流中的位置不是（即它可以在沒有太大影響的情況下移動），則使用figure。如果其位置很重要，請使用其他標籤。如果它不重要，請改用aside。