デザパタを読んで、HTMLのパターン化を思いついた

日常

プログラミング言語に定石となるパターンがあり、それを抽出できるのであれば、HTMLでも出来るんじゃね？と思った。そう思ってしばらく考えているうちに、デザインパターンと呼ぶには単純すぎるくらいのパターンで、自分の作っているサイトのほぼ全ての構造が作れることに気がついた。

ContainerにはHeader、Contents、Footerの3つのブロック要素(divタグ)があり、ContentsのみがContainerを内包することが可能。Header、Footerは状況に応じて省略可能。それぞれid class="要素名 + 役割名(Container、Header、Contents、Footer)"とする。例えば、ブログのページを構成する場合は

  • BlogContainer
    • BlogHeader
    • BlogContents
      • NavigatorContainer
        • NavigatorContents
      • SidebarContainer
        • SidebarHeader
        • SidebarContents
      • PostsContainer
        • PostsHeader
        • PostsContents
          • (複数の)PostContainer
            • PostHeader
            • PostContents
            • PostFooter
    • BlogFooter

のような構造になる。あとは、こいつらをスタイルシートからレイアウトしてやればOK。