マークアップとは?意味や基本知識、言語の種類について

マークアップとは?

マークアップの基本知識を学ぶことで、htmlの理解が深まります。ここでは、マークアップの定義、役割、コーディングとの違いなどを解説していきます。

マークアップの定義

マークアップとは、文書構造(テキスト)が正しく認識できるよう、コンピュータに文書の要素に目印である「タグ」をつけて意味づけすることをいいます。

文書の要素とは、「タイトル」や「見出し」「段落」などのことです。

コンピュータは、人間の言葉を認識できません。よって、マークアップすることで、「ここからここまでがタイトルである」「ここからここまでが本文である」というように文書の構造を理解させる必要があるのです。

マークアップの役割

マークアップの役割は、主に2つあります。

1つ目は、先に述べたとおり、コンピュータに文書構造(テキスト)が正しく認識できるよう、文書の要素に目印である「タグ」をつけて意味づけすることです。マークアップすることで、文書をわかりやすく表示できます。

もう1つは、検索順位を上位にするための対策である「SEO対策」となることです。適切なマークアップが行われていると、Googleにサイト内容の情報を正しく伝えることができます。

マークダウンとの違い

マークダウンも、テキストに意味づけをすることです。ですが、マークアップとは記述の仕方が違います。

マークダウンは、「*」や「#」、「-」などといった特定のマークをテキストの前後につけて意味づけを行います。例を挙げると、

・見出しの部分は行頭に「#」をつける
・強調したい部分は「*」で囲む
・箇条書きにしたい部分は行頭に「-」をつける
・引用部分は「>」を行頭につける

などです。マークアップよりもマークダウンのほうが記述が少なく、基本を覚えれば作業が楽になるというメリットがあります。

コーディングとの違い

コーディングとマークアップは混同しがちですが、違うものです。

コーディングとは、プログラミング言語やマークアップ言語を使って、ソースコード全体を記述すること。一方、マークアップは、マークアップ言語を使って文書の要素に目印である「タグ」をつけて意味づけすることです。

両者の違いは、使用する言語と、役割が違うといえます。

作業としては、コーディングの作業の中に、マークアップを挿入するかたちとなります。

プログラミング言語との違い

マークアップ言語とプログラミング言語の違いはどこにあるのか、解説していきます。

プログラミング言語とは、コンピューターに計算処理を行うように指示する言語です。プログラミング言語には、C言語やphp、Ruby、Javaなどがあります。

それに対しマークアップ言語は、タグを使って文書の構造に意味づけをするために使用する言語となります。代表的なマークアップ言語は、htmlやxml、CSSです。

2つの言語の違いは、役割です。プログラミング言語は、コンピューターに命令を与え、計算処理させる言語。これにより、データ処理が可能になるわけです。一方、マークアップ言語は文書に意味づけをする言語で、似ているようですが、全く別物です。

ただし、プログラミング言語はマークアップ言語上に記述することがあり、密接に関わっているため、どちらの言語も理解しておく必要があります。

マークアップ言語

マークアップ言語には、htmlやxmlがあり、タグで囲むことで構造を表現する言語です。それぞれどのような言語なのか説明しましょう。

html

htmlは基本的なマークアップ言語で、Webページを作る際に必須となります。

<タグ名></タグ名>で囲うことで、ページ内の文書にタグをつけ、その部分の意味を示します。htmlで使用するタグとタグの持つ意味は世界共通のルールで決められており、以下のようなタグがあります。

・タイトルの場合、<title></title>で囲む
・大見出しの場合、<h1></h1>で囲む
・箇条書きの場合、<li></li>で囲む
・段落の場合、<p></p>で囲む
・文中で強調を示す場合、<em></em>で囲む

xml

xmlの特徴は、htmlとは違い、作成者がタグ名を自由につけられることにあります。

xmlのタグは、<〇〇>と</〇〇>で囲みます。スラッシュのついていないタグが命令の始まり、スラッシュのついたタグが命令の終わりです。この〇〇の部分は作成者が自由につけられることから、文書中のデータの意味がわかりやすくなり、データのやり取りや管理が簡単になります。

たとえば、お店の情報のWebアプリケーションをつくる場合、
<店名>あいうえお商店</店名>
<住所>東京都S区A町1-2-3</住所>
<電話>012-345-6789</電話>
のようにタグ名を作成者が決めて記述します。

マークアップエンジニアについて

マークアップエンジニアは、Webエンジニアの職種のひとつ。昨今、需要が高まっている職業です。ここでは、マークアップエンジニアの仕事内容、必要なスキル、年収についてを解説していきます。

仕事内容

マークアップエンジニアは、HTMLやCSSのマークアップ言語をベースに、Webページの実装を行うのが主な仕事です。Webページの実装というと、コーダーと同じような仕事に思われるかもしれません。ですが、マークアップエンジニアは、デザイナーの指示どおりにWebサイトを作るのではなく、サイトの目的を理解し、ユーザーが利用するにあたり快適なサイトに改良することが求められます。

必要なスキル

マークアップエンジニアは、広範囲のスキルが必要になってきます。必須なのは、マークアップ言語であるHTMLやCSSのコーディング知識です。また、ブラウザにさまざまな動きをつけるJavaScript、PHPのスキル、SEO、CMS、デザイン理論の基礎を一定のレベルまで押さえておくと、ワンランク上のマークアップエンジニアになれることでしょう。

そのほか、Webデザイナーとのやりとりも多いため、コミュニケーション能力や、どんなときにも柔軟に対応できるスキル、新しい技術に対する向上心、探究心などがあると、仕事がスムーズに進み、キャリアアップも見込めます。

年収

マークアップエンジニアの年収の相場は、300万から500万円程度が一般的です。ただし、未経験やアルバイト、契約社員といったケースでは、年収300万円以下もありえます。最初は300万円程度だとしても、経験を積んだり、スキルをアップすることで、収入も上がることはありますし、ジョブチェンジやフリーランスとして独立することもできます。

マークアップで見やすくわかりやすいWebページに

マークアップとは、htmlやxmlなどのマークアップ言語を使い、文書の要素に目印である「タグ」をつけて意味づけすることです。マークアップによってWebページが見やすく、使いやすくなりますし、SEO対策にもつながります。文書構造を意識しながら、マークアップスキルをアップさせましょう。

求人詳細ページへのリンク

仕事カタログページへのリンク

関連コラム

マークアップとは?意味や基本知識、言語の種類についてのページです。ITエンジニア・移動体通信エンジニア(技術者)の派遣求人ならブレーンゲート。株式会社ブレーンネットはシステムエンジニアやネットワークエンジニア、プログラマーの派遣・転職をサポートいたします。