ウェブ担当者にHTMLの知識は必要か?

投稿日: | 投稿者:ayatori
ウェブ担当部署に配属されたけど、HTMLの知識は必要?

この春から、ウェブ担当の部署に新しく入ることになりました。ウェブの仕事といえば、やはりHTMLの知識がないと、やっていけないんでしょうか?

ウェブ担当者にとってHTMLは「常識」

企業のウェブ担当者として、ウェブサイトを運営する立場になられたわけですね。実際の制作作業を別の人 (社外の制作会社など) にお任せしたり、あるいは自社内ですでに CMS (コンテンツ管理システム) が導入されていてそこに情報を入力するだけでウェブページが生成できるようになっている場合、HTML の詳細な知識は必要ないと思われるかもしれません。

しかし、質の高いウェブコンテンツを実現する (改善提案をしたり、発注者として制作会社をディレクションしたりする) ためには、HTML の知識はあったほうが絶対によい、というのが企業ウェブ担当者を長年経験してきたものの実感です。アクセシビリティ、SEO、ソーシャルメディア連携、など顧客のユーザーエクスペリエンス (UX) を下支えする諸側面で適切な判断をするうえでも、また、スタイルシートやJavaScriptといった上位規格を理解するためにも、CMSの使い方の上達のためにも、ウェブの基本となるHTMLを理解していることは大きな強みになります。

とはいえ、いきなりHTMLのすべてを理解することは容易ではありません。なにから勉強するのがよいかで戸惑うかもしれません。私は、HTML のタグの使い方を覚えるのと並行して、以下のことを意識するのがよいのではないかと考えています。

 


 

普段から「情報構造」を意識するクセをつける

HTML とは、ウェブコンテンツの構造をマーキングする (意味的に印をつける) ものと考えることができます。もう少し具体的に言うと、コンテンツにおいて、どの部分が見出しなのか、どの塊がひとつの段落なのか、どの部分が箇条書きなのか...を (インターネット関連テクノロジーが共通に認識、解釈できるように) 明示的にするものです。

このことを念頭に、実際にHTMLを書くことができないとしても、コンテンツを「見た目」で捉えるのではなく「情報構造」として意味的に捉えるクセをつけておくとよいと思います。

  • 見出し (大見出し、中見出し、小見出し)
  • 段落
  • 箇条書き (行頭番号なし/あり)
  • 強調
  • 表 (テーブル) における見出しセルとデータセル。およびそのテーブルの表題 (キャプション)
  • フォームの入力欄の種類 (テキストボックス、チェックボックス、ラジオボタン、セレクトメニューなど)。および各入力欄の項目名 (ラベル)
  • リンク (別のコンテンツに移動する機能)
  • ボタン (何らかの機能を実行する機能)
  • ...など。

上記それぞれに、決まった記法つまり「タグ」があるということを理解しておきましょう。理想的には、実際に「タグ」を使ってコンテンツを書いてみるとよいですが、簡易的にマークダウンという記法で文章を記述することで「情報構造」を意識することに慣れる、というのもありかと思います。(ご参考 : 「日本語Markdownユーザー会」ウェブサイトの「Markdownとは」および「Markdown記法」)

 


 

基本的なメタデータを知っておく

また、ウェブコンテンツには、ブラウザ画面上にページとして表示される情報以外に、そのページに関する付帯的な情報 (メタデータと言います) もあります。メタデータも HTMLのルールに従って書かれていて、さまざまなところで活用されるので、ウェブ担当者としては、以下のようなメタデータがあることを理解しておく必要があります。

  • タイトル : ウェブページのHTMLソースコードの中で、<title>●●●</title> と記述される情報。そのページが検索エンジンやソーシャルメディア、キュレーション系サイトなどで採り上げられる際に、またブラウザのブックマーク登録の際に、この情報が引用される。
  • 概要文 : ウェブページのHTMLソースコードの中で、<meta name="description" content="●●●"> と記述される情報。そのページが検索エンジンやソーシャルメディア、キュレーション系サイトなどで採り上げられる際、概要文としてこの情報が引用される。
  • OGP (Open Graph Protocol) : そのページが Facebook などソーシャルメディアで掲載される際に、表示したいタイトル、概要文、アイキャッチ画像などを設定することができる。

 


 

HTML を学ぶ

さて、ここまでお読みいただいて (また日々の業務で意識することを通じて)、HTML への関心が高まってきたら、ぜひHTMLを学んでみて欲しいと思います。書籍や勉強会など、さまざまな学習機会がありますので、それぞれ、自分に合った手段でトライしてみるとよいでしょう。

以下、仕事の合間に簡単にできることをご紹介します。

  • マークダウン形式で文章を書くことを習慣化して、都度、それをHTMLに変換してみる。(マークダウンエディターと呼ばれるアプリにはたいてい、HTML への変換機能が用意されています。)
  • ウェブページがら「見栄えの制御 (専門用語では「CSS」と言います)」を取り除いて、骨格となる「情報構造」を見る癖をつける。(Chrome や Firefox で使える「Web Developer」というアドオンがあるので、それを使うと簡単にできます。)
  • 関心あるウェブページ (もちろん自社のページでも結構です) のソースコードを見る癖を付ける。(たいていのブラウザでは、表示されているウェブページ上で右クリックすると、ソースを見ることができます。)

このようなことを通じて、少しずつHTMLに慣れていただければと思います。HTML を理解していることで、的確な制作ディレクションができたり、制作会社の質を見抜くことができるようになります。ぜひ頑張ってください。

 


 

無料オンライン相談受付中!ウェブ戦略の専門家が
ご相談を承ります!

ウェブマーケティング担当者必見!

ウェブ戦略お役立ち資料

お役立ち資料のダウンロードや
セミナーのアーカイブ視聴が無料でできます。
ページの先頭へ