web制作者のまさひこさん(@mnemoniqs)と話してて、｢セマンティックというものを普通の制作者や、欲を言えばクライアントにも意識させるにはSEO に有利というアメがどうしても必要なのか｣という話題になりました。

「全部divで良いじゃん」

HTMLを正しく書く

「全部divで良いじゃん」というのはよく言われるジョークですけど、あながちジョークと言いきれない部分があります。コーディングしている人が、それが何のために置かれているエレメントなのかを理解せずにコードを書いた場合、自ずとそうなってしまうからです。これは時間がなかった時のわかっているはずの制作者についても例外ではありません。

さて、そういうなあなあなHTMLコーディングをしてしまう場合に「それではダメだよ」「もっとキレイに書いて欲しいからしっかり考えて」と考えてもらうにはどうしたらいいのでしょうか。

言ってしまえば全てのタグがdivでいいどころか、どうせCSSで整えるならiとかaddressとかでもいいんですもんね。

理由① SEOのため

「SEOに強い」一番通じやすい

さてこの時、あまり言いたくないですけど一番効果があるように感じるのは「ちゃんと機械に意味が伝わるようにコードを書いていればSEOに強くなります」という話。これからHTMLを覚える人も良く知らない経営者も「それなら実際に役に立つだろう」と考えられるからです。

検索順位を上げる為に論理的なマークアップをするというのは、不純な動機な気もしますけどこれは仕方ないというか…むしろそうあるべきですよね。

実際機械から見ても自分の記事が「特にリンゴの育て方について詳細に、メインと枝葉の話を分け、体系立てて書かれている」という認識をされているなら、そうでない記事より「リンゴ 育て方」で上位に来るのは当然のはずですし、それは人にとっても役に立つでしょう。

Googleのアルゴリズムも利用者にとって便利であるべきで、求めている情報にたどりつくために発達していっているのですから、コードを書く側もそれに沿っているほうがいいはずです。

理由② 未来のため

先々のことを考えて対応の必要がある

そうは言うものの、まだ実際にそこまでには到達していないアルゴリズムの為にそれをする意味があるのか、問われればそれは場合によるとしか言えません。ですが、近年のアルゴリズムの強化は早く、仮にそのサイトが最低2年の間リニューアルされないとすれば、かなり遅れて対応する事になるかもしれません。

そしてリニューアル自体ももとのコードをすっかり無視して作られる場合ばかりではないと思いますし、流用するなら最初からしっかり出来ていた方がいいですよね。その際にしっかりマークアップされ直すのなら気にしなくてもいいんでしょうけど…。

第一、正しくマークアップするよりSEOに強い方法があったとしても、そんなものはこのご時世短期的にしか役に立ちません。バッドノウハウで対応するのはSEOのみならず単に保守性の面でも良くないですね。

また、2ヶ月程度しか公開されないキャンペーンページなんかもある程度はマークアップの正確さも無視されがちでしょう。本当にそのページがwebにその間しか存在しないのであれば、まあ確かに何とも言えないかもですねｗ(それにしても、常日頃正しく書くという習慣は持っていた方が良いでしょうが)

理由③ 普遍性のため

互換性、メンテナンス性の高さはルールによって保たれる

web制作者は一人で制作するのではなく複数人で制作したリ、作ったものを他の人に渡したりします。その場合、コードは同じルールに基づいている方が引き継ぎ易いですよね。

一部の人間、または企業内のみで通っているルールは方言の様なもので、他では通用しません。

こうした、別の場所で制作している人間の間で通じる可能性のあるスタンダードな概念として、セマンティックwebという考え方が存在している(全ての制作者が行きつくべき概念としての存在意義もある、という意味です。その為にあるという話ではないです。コーディングルールもこの考え方を踏まえた上で作るべきで、地域やコミュニティの違う集団の中でも、皆がセマンティックというものを意識として持っていれば、マークアップも似通っていく、共通化されていくはずだと考えています)のです。現状、たくさんの制作者がこれ以外のルールに基づいて制作を行うという事はまあ、あり得ないでしょう。私が知らないだけかもしれないですけど…。

理由④ ブラウザーやコンテンツリーダーの対応のため

現状一部のコンテンツリーダーがarticleタグでマークアップされたエリアを判断するように、新しいタグの定義や利用シーンに沿い、ソフトやハード側がそれらのタグを認識していく可能性が高いです。

例えば、section要素等のセクショニング・コンテンツ毎にコンテンツを区切って表示するスライドアプリ。

例えば、blockquote要素やq要素内の文章を声色を変えて読み上げる読み上げブラウザー。

例えば、時間のない人のためにasideを飛ばして表示するリーダー。

例えば、time要素内の時間を元にたくさんのソースから情報を仕分けるデータベース。

今現在でもブラウザーのデフォルトスタイルシートが見出しや段落の見た目を整えていたように、今後そういった機能はどんどん発展していくと考えられます。

それぞれのコンテンツがどういう意図で置かれているかを考えればあるべき使われ方を想像する事も出来るでしょうし、それは確実に世の中にとって、制作者にとって便利に活用されるでしょう。

web制作者は誰に仕えているのか？

利益や効率に譲らない領域を持つこと

恐らく上記の4つは通常考えられるセマンティックなコードを書く目的です。この章は、私の妄想ですｗ

会社で働いているとき、上司には「いつまでにこれを作ってくれ、これは気にしなくていい」という指示をされたとき。我々はときに企業で、ときにクライアントの要望で、相手のビジネスや取り組みを成功させる為に報酬をもらいながら、制作に取り組みます。

その際、依頼者が「こうして欲しい」という要望を出しているのに「それはあなたのビジネスに(ひいてはwebに)あまりよい影響を与えないので止めた方がいい、こうするべきだ」と提言する場合があります。

技術者が王の命令に忠実で、絶対に逆らわない従者であれば指示は絶対、例え理不尽であったり間違っているとわかっていても従うでしょう。

が、技術者は王がコントロールしたい世界をときに王よりもわかっており、王よりも大事にしたいという意思を持っています。その場合、その人は従者ではなく、聖職者かもしれないですね。そういう人は、王(職業における雇い主)のもとで暮らすと同時に、神(大事にしたい技術)のもとで暮らしています。

webに興味のない他部署の人間に「webの為にはどうのこうの」なんて言っても怪訝な顔をされると思いますが…他の人より近い位置でwebに触れる人間こそがこういう気持ちを持って、周りの利用者とwebとを取り持つ役割を担えば良いのではないでしょうか。

技術者というものはweb制作者に限らずこういう立ち位置にいるのではないかと思っています。

なんだか話が壮大になってしまいましたね…ｗ これは単なるファンタジー好きの例え話です。

終わりに

私もたまに非webな人の様な気持ちに戻って、「今あたっている職務で満たさなければいけないルールの他に、何故こんなふうに大事に思ってwebと接するのか」と考える時があります。こうした事について私は「HTML5って未完成なのに何で使おうとするの？」に対する私の答えの記事で「我々もwebを作っている」と述べました。

私自身レベルの高いクリエイターという訳でもなく、知識だってまだまだなんですが、自分の興味を持ったジャンルをより周りに役立て、そして取り組んでいてより楽しいものにしたいとは強く思っています。

仕事であれ趣味であれ、好んで関わっているものをときに人に知ってもらい、ときにもっと好きになってもらう。そういう考えで取り組まれるものが悪くはなっていかないはずじゃないでしょうかね。

追記

この記事について、株式会社ネコメシのもりたさん(@securecat)から以下の様な記事での意見を頂きました。

正しいHTMLを書く目的はただ一つ – ネコメシCEOブログ

その後、更に私の意見も含めTogetterでまとめて頂きました。

正しいHTMLを書く目的はただ一つ　補足 – Togetter

正しいHTMLを書く目的はただ一つ　完結編 – Togetter

私の記事、ツイート共に普遍的な話ではなく私の立場からの意見を書いていること、私の記事はセマンティックなマークアップにまで至る内容ではないことについてご指摘を受けました。確かにこれは認めるところでして。

特にこの記事は私の考える「セマンティックなマークアップというものを行おう」という気持ちになってもらうには、という意識の話しかしていなくて、技術的にどうこうという部分はそこから、というつもりだったので(他に記事はありますし、別で書いてもいいかなと)、今回は書かずにいました。

しかも、私がこうした話をするのは実際のところ、HTML5を推進したいからなんですよね。HTML5の正しいマークアップをしようとすることの延長上にセマンティックなマークアップをするということがあると考えているので、「正しく書いた方がいいですよー、そうするとwebはセマンティックになってもっと恩恵が得られるしweb自体も良くなっていきますよー」という話をしたかったのですが、内容としてはセマンティックなマークアップという話題の側から見ると、単にそれ以前の話をしているだけ、という印象になってしまったようです。

考え方の話に絞りたかったので(旧来のHTMLのコードしか使っていない人がHTML5の正しいマークアップの話題とMicroformatsやRDFa等のメタデータの話題を同時に聞くと尻込みしてしまうのは経験済み)技術の話も入れてませんが、それだと記事の説得力に欠けるという指摘も頂きました。この辺はあえて省いているつもりでしたけど、正直なところ自身の知識不足も否めません。

とにかく、一番言いたいのは今webが全ての側面で正しくコードを書いた方が全体的に皆幸せになれるよー(そう思ってもらいたいなー)、だからHTML5やろうぜ！！ってことですｗ

大先輩方にご指摘頂きありがたかったです。もりたさんありがとうございました！もっと精進致します！

更に追記

振り返ってみれば、私が上に挙げた4つの目的は目的ではなく理由だったのかなと。その為記事タイトルと各項目を変更しました。

もりたさんの仰る通り、私としても「webをセマンティックにしよう」という事の目的はアクセシビリティー、機械にも人間にも分かりやすいwebを作るという事の他にはありません。

が、そんなことを説いても普通その気になる人は少ないので、「それを目指すとこういういいことがあるよ！」と言いたいがための理由を挙げていたというわけです。

ここに至り更にスッキリしました。確かに目的ではないですね…ｗ

それか、我々の「セマンティックwebを作りたい」という目的と同じ方向を向いてもらうための、それぞれにとっての目的を提示しているというか。そんな感じです。意図としては変わってないんですけど、言葉を間違っていた感じですね。