HTML5は閉じタグが要らない(ものもあるよ)

たのしいホームページ作りは未だ続行中。

XAMPP Installers and Downloads for Apache Friends
Xamppを入れて静的サイトジェネレーターを使おうと準備したましたけれど、ジェネレーターのほかにブラウザが必要。まあ、ブラウザはあります。ジェネレーターによっては導入するのにsudoのコマンドが必要と言われて急にやる気を失ってしまいました。かなり早い段階で挫折。

黒い画面を使わずに静的サイトジェネレータを使う方法(脱黒SSG)について話してきました – atskimura-memo
いまさらDreamweaverもなかろうと、ほかの方法を探しました。

やりたいのは20ページほどの小規模なサイトを作ること。写真は計10枚ほど、テキストのほかはあまり管理するものがなくリストタグでサイト内の一覧リンクを付けようと考えました。ついてはそのサイト内リンクをどうにか外部ファイルに置いて一括でかんたんに管理したいのです。たったこれだけのことに思い悩んでいます。

たどり着いた結論は、道具を使うことを諦めること。つまり、ジェネレーターも外部読み込みも使わないことにしました。

私は日曜大工が好きなのでよく木を削ります。削るときは小刀とノコギリ加工しています。木を削るときはその加工方法に迷いはありません。しかしパソコンの作業はどの道具をいかに使うかでいつも迷います。きっと木を切るほどにはパソコン作業に慣れていないのです。

webデザインは製造業と言うよりむしろサービス業だと言う人がいます。たしかに作ることと同時に誰のためにどう作るか考える作業が要求されます。木でなにか作るときは、たいていの場合自分用に作るので他人のことを考えません。日曜大工は好きにできます。どう作れば良いのかよく分かっています。反面、あんまり得意ではない「サイト作り」では、おなじ作ることなのに落としどころが分からなくて、道具をどれにするか色々あって迷ってしまいます。迷って結局作らないことが多いのです。

解決作は意外な場所から降りてきました。

仕様をみることなく、存在だけ知っていたHTML5が解決してくれました。結局エディタを使いますが、それはタダのテキストエディタです。タグの補助入力機能なんてないメモ帳のきましくらいのものを愛用しています。

HTML5がどうして解決作になるのか。

たとえば< P >ってタグは頭に付ければ良くて、以前のように閉じタグ< /P >を必要としません。極端な話、あたまの< HTML >を外しても動作しました。それがすべてのブラウザに対応しているのか、スマートフォンでみたときどうなるかは分かりませんが、SEO対策など気にしないのであれば、メタタグのディスクリブションやキーワードはなくて平気。

相当簡単な文章構造となります。

HTML5 で省略できるタグ – Qiita

こうなると、俄然楽しくなってきます。

シンプルなテキスト・HTMLエディタ Crescent Eve (フリーソフト)
HTMLを補助するエディタを導入しようかとも考えましたけれど、HTML5の仕様がそんなに簡単にいろいろ省略できるならばいままでのエディタでも十分書くことが出来ます。

動作をつかさどるjavascriptとCSSを外部化して整理しておくと、あと本体のタグはレイアウト用のdivタグとナビのリストタグくらいで、かなり簡単なものとなります。実際、改修をはじめた自転車のサイトの一部をコピーしてHTML5の仕様で書き直したら、最低限必要な行数が全部で20行くらいになりました。

手打ちの場合閉じタグが要らなくなったことは最高に楽です。