Skip to content

HTMLの基礎

ma-san
ma-san(鈴木正行)

HTML (HyperText Markup Language、ハイパーテキスト・マークアップ・ランゲージ)はWebサイトの構造を作るための言語です。

よくあるHTMLの書き方#

HTMLはWebサイトに情報を載せたい場合に必要なマークアップ言語になります。

ページタイトル
大見出し
本文となるテキストが入ります。
画像の説明
https://ma-san.org
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>ページタイトル</title>
</head>
<body>
<h1>大見出し</h1>
<p>本文となるテキストが入ります。</p>
<p><img src="/images/img.png" alt="画像の説明" width="300"
height="200"></p>
<p><a href="https://ma-san.org">https://ma-san.org</a></p>
</body>
</html>

マークアップしたHTMLの表示例
マークアップの例
※画像は存在しないため表示がされない状態

要素とタグ#

<p>段落という意味になります</p>

上記のような纏まりを要素と呼び、前後に存在する<p></p>がHTMLのタグと言います。このタグを使うことで要素に意味を持たせることができます。

タグの種類は大量にありますが、よく使うタグを下記に紹介します。

h1 - h6
見出し
p
段落
br
改行
img
画像
a
リンク
table
ul/ol/li
リスト

上記のタグを覚えておくだけで、Webサイト上のテキストの更新などは可能になります。但し、デザインを変えたりすることは上記のタグだけでは可能にならないので、CSSの知識もあわせて必要になります。

お仕事・当サイトへ興味を持っていただいた方

お問い合わせはこちらから

お問い合わせを頂く際はご確認ください

プライバシーポリシー

ma-san(鈴木正行)
テクニカルディレクター / Webデザイナー

「ma-san web design」の管理者。東京都・千葉県・宮城県仙台市を中心に企業のWebデザイン/マーケティング/IT戦略のプランニングからWebサイト構築・運用をしています。
Webアクセシビリティ」を中心に、「変わりゆくWebと共にサービス・サイトを改善していくこと」を重視します。
当サイトではお仕事のご相談からナレッジシェアを中心に活動していきます。

るり
未来へ繋がるWebの可能性。
お客様のサービスを、Webサイト制作を通じてサポートいたします。
Accessible Web Design.

Recommendation

るり

Webアクセシビリティの重要性について 当サイトが最も注力したい「Webアクセシビリティ」について、ぜひ多様な方々と共に学びながら充実化させ、普及活動に勤しみたいと考えています。

るり

初めて依頼を検討している方 初めてWebサイト制作を依頼する方へ。Webサイトを作りたいと思ったときに参考にしていただけると幸いです。

るり

Webサイトの基本 サーバーの準備からドメイン契約。Webサイトに必要なデータや情報を一通り纏めることで初めてWebサイト制作に携わる方々の学習の一助になれば幸いです。