Skip to content

Instantly share code, notes, and snippets.

@3panda
Last active March 10, 2018 16:34
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save 3panda/be7b76adc1b27e93f48a to your computer and use it in GitHub Desktop.
Save 3panda/be7b76adc1b27e93f48a to your computer and use it in GitHub Desktop.

HTMLについての私のくだらない長話(永遠に作りかけ)

はじめに

まず初めに、これはくだらない長話です。 文才のない私が自分の考えを殴り書きに近い形で書き出しているに過ぎません。 ご了承ください。

内容

「HTML」をフォーカスしています。 と言っても難し事とかは省いていますし、解説も簡略しますので必要と感じたら調べてくださいませ。 また、多少謝りもあると思いますが、目をつぶってください。 酷いものは直しますので各種SNSでお伝えくださいませmm

かれこれ十年近く「マークアップエンジニア」を名乗ってHTMLを書く仕事をしてきたものです。 当然ですがCSSも書きますし、JavaScriptもやります。

「コーダー」?「マークアップエンジニア」? 「フロントエンドエンジニア」

上の最後で書いた通り、JavaScriptも書くので場合によっては「フロントエンドエンジニア」とも名乗るのですが どちらでも良いですし、今回はHTMLにフォーカスを合わせるので「マークアップエンジニア」で行きたいと思います。 「コーダー」については個人的に「嫌いな呼び名」です。後半これに触れるかもしれません(ないかも)

HTMLとの出会い

もう十二年ほどになるでしょうか。もともと映像関連の仕事を志した私がそれを諦め、新たにWebの世界を知り足を踏み入れたのは Tabaleレイアウトが全盛期の頃でした。 その頃のHTMLは、「Web上に表示する」ためだけの「コード」として扱われていました。 Webが誕生した当初の目的であった「適するに内容を意味付けする」と言う事は忘れられていました。 いや、そもそも知らずに使っていた人が大半であったかと思います。 多分に漏れず私もその一人です。

本当に「HTML」と対自したのは「Web標準」を広まった頃ではないかと思います。 そして「Web標準」による「HTML」を正しく記述する事への重要性は「BLOG」の登場や、「Web Accessibility」、「結果論としてのSEO効果」などいろいろな要因で広まりました。

「HTML」と「CSS」を書く事がこれまでよりも高度となり、「Webデザイナの仕事の一部」であった「マークアップ」は分業されるケースも増え私は「マークアップ」の方にやりがいを見出し、以後「マークアップエンジニア」と名乗るようになります。

私の理想のHTML

ユーザーが「CSS」や「画像」の表示が行われない状況で「HTML」のみなった場合にも、そのコンテンツを読み取れる。 音声ブラウザなど音声でコンテンツを読み上げる場合も、正しくコンテンツの内容が伝わる文章構造で記述する。 それが理想のHTMLであり、本来のHTMLのあるべき姿と考えていました。

もちろんJavaScriptについても、なんらかの事情で無効になったり、ユーザー自身で無効にしている場合にも、コンテンツが伝わる最低限の形にブラウザが読み取れる状態にしておく事を含みます。

昨今「JavaScriptの無効状態などありえない」と言われるかもしれませんが、それが100%で無い以上配慮する必要はあると私は考えます。

また、そうする事で一つのHTMLを多様な場面で利用する事を可能にするとも考えます。

「HTML」というドキュメントが多様なデバイスでもその「コンテンツ」を表示するためには「HTML」そのものが「その意味」を「形」にしている必要があり、それが本来の「HTML」のあるべき姿と「極個人的である意味偏った意見」でしたが私はそう考えていました。

それが「WAI-ARIA」だったりの規格なのかもしれませんが、このあたりもまた割愛します。

時の流れで考えまたにも多少の変化もありました。でも根幹は今でもそう考えています。

HTMLの進化と想像した未来

HTMLはXHTML(1.0)となりXMLに近づき、よりマークアップ言語として見栄えの部分とコンテンツの部分を分離されていくのだと以前の私は信じて疑いませんでした。

しかし、当時のHTML4.01やXHTML1.0(拡張子は.htmlだけど)で作られたWebコンテンツはdiv要素の山でした。 デザインは流行で日々大きく変わり、時には奇抜なものを求めらえ、それに応えるべく格闘する日々は続きました。

CSSは普及したとは言っても、今よりも発展途上であり、最先端のモダンブラウザ(FireFoxとかChromeとかね)に合わせつつも、レガシーなシェア上位のブラウザ(IE6ね)に対応すると責務があるため、 ソースコードはdiv要素の入れ子が避けられ無い状況でした。 そして、不毛にもなんとかそれぞのdiv要素に意味を持たせようと躍起になって奮闘した事を覚えています。(これは間違い)

また少なからず「Web Accessibility」を意識しますので、コンテンツの順番なども意識していました。 デザインの見せ方とコンテンツの記述順は異なる場合もあり、CSS駆使してなんとか対応していたのをよく覚えています。

これらの、多少不毛と言えるこのやり方は、後にHTMLが厳密化しCSSもさらに普及した時に報われると信じていたからです。

しかし、現実は異なりました。

現実的(で有用的)なHTML としてHTML5の登場

XHTML2.0の廃案、HTML5の登場。XHTML2.0については割愛しますが、上記で述べたような当時の私が理想していた姿と言って良いかしれません。もちろんその全てを理解しているわけではありませんがそんなところです。 HTML5は今更ですが、それまでのHTML4.01とXHTML1.0の後継であり想像した未来とは異なる物でした。

どうしてそうなったのか? なぜHTML5なのか? すごく誤解を恐れずに言葉足らずで説明するのであれば

「すでにHTML4.01またはXHTML1.0で作られているコンテンツが山のようにあり、それを無視する規格は受け入れられ無い」

というブラウザベンダ側の訴えをW3Cが受け入れたと言う事だと思います。

これは私にとっても「納得せざるえ無い」事でもありました。

当時の世の中の Webアプリケーション(Gmailなど)の普及と数の多さとそのソースを考えれば「HTML」を「私の考える正しい姿」を目指す事は現実的ではなく「現状のソース寛容する」事が現実的だったのでした。

その現実を配慮して登場したのがHTML5でした。

HTML5はよりアプリケーションの作成に有効になる要素の追加やルールの改定が含まれていました。 またHTML5には「より正しいHTML」をマークアップするための要素やルールも含まれていていました。 「セクショニング」や「アウトライン」と言うアリゴリズムがまさにそれにあたります。

これは私にとっては歓迎すべき内容でした。 これにより、「コンテンツの上」では不要なdiv要素は「意味を持た無いもの」と解釈されるわけですから、共存が可能となるわけです。 先ほど述べたような「不毛」とも言える事を「意味の押し付け?」は不要となりました。

しかし、世間のHTMLの関心はそんなマークアップの部分ではありませんでした。 もっぱら関心が高まったのは「HTML5に広義」として含まれた「CSS3」や「JavaScript」そして「関連するAPI(audioやらvideoやらcanvas..)」でした。 仕方が無いと言えば仕方がありません。 わかり易くキャッチな言葉は浸透しやすいものです、最もわかり易い例は「Flashの代替え」では無いでしょうか。

これは正しくもあり、間違いでもありました。 この後に「マークアップエンジニア」や「フロントエンドエンジニア」を名乗る人には大きな苦難の初まりでした。

もちろん、これチャンスであったのも事実です。 インタラクティブコンテンツの開発がFlash使わずにできる事は素晴らしい事です。 このあたりも本題に逸れるので割愛します...

そして同時にHTMLを「正しくマークアップすると言う意識」も全てとは言いませんが、「インタラクティブなコンテンツの実現」や、「アプリケーションの開発を目的であり文書では無い」とする大義の元に蔑ろにされているケースが増えているように考えます。

これからのHTML

突然ですが、Apple TV(2015/09/10段階)で表示するコンテンツの開発が公開されました。 皆様はご存知でしょうか?

これに使われているテンプレートの言語はTVMLと言います。 Templateの解説読むとXMLとHTMLによく似た要素の混じったマークアップ言語です。

個人的な見解ですが、後々には今は無いCSSににた物(互換性のあるStyleSheet)が規格に盛り込まれ、最終的にはHTML5とCSSがそのまま使えるようになるのでは無いかと考えています。

デバイスは多様化をさらに進めていきます。

これは今までのようにOSやそのバージョンによるブラウザの違い、モニターサイズの違いだけでは無く、そもそものデバイスの違いにいよいよなっていきます。 すでにApple TVに限らず、すでに普及の始まっているウェアラブル端末でWeb上のコンテンツにアクセスする事が現実になり始めています。Apple TV同じAppleでは発売されているApple Watchもそれに該当します。

さて、この先にWebの進化を考える時に現在の「HTML」の記述の方法で対応出来るのか?どうなのか? 今一度、「HTML」に関わる仕事をしている人は考えなければならない時が迫っていると思います。

この時に、私の理想としたHTMLが広まり当たり前となる日が来るのか、やはり理想論に過ぎ無いのかを これからも見届けようと思います。

長文で酷い文章にお付き合いくださいましてありがとうございました。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment