カテゴリ: HTML・CSS 更新日: 2025/02/24

HTMLとは何か?初心者向けに基本から説明します!

HTMLとは何か?
HTMLとは何か?

1. HTML とは?

1. HTML とは?
1. HTML とは?

HTML(HyperText Markup Language)は、Webページを作るための基本的な言語です。WebブラウザはHTMLを読み取って、私たちが見るWebページとして表示します。HTMLの役割は、ページの中身を整理して、どんな内容があるのかを伝えることです。HTMLは、プログラミング言語ではなく、「マークアップ言語」と呼ばれます。つまり、HTMLはWebページをどう見せるかではなく、ページの内容に意味を持たせるためのものです。例えば、見出しや段落などを示すために使われます。

HTMLは「タグ」と呼ばれる特別な記号のセットでできています。タグは、角括弧(< >)で囲まれていて、例えば、<h1>タグは大きな見出しを、<p>タグは段落を示します。タグは開始タグと終了タグのペアで使います。例えば、<tag></tag>のように書きます。また、<img>タグのように終了タグが必要ないものもあります。

HTMLは進化していて、今では「HTML5」というバージョンが最もよく使われています。HTML5では、これまでのHTMLに新しい機能が追加され、動画や音声をWebページに埋め込むことが簡単にできるようになっています。

2. HTML を書いてみよう

2. HTML を書いてみよう
2. HTML を書いてみよう

HTMLを実際に書くためには、テキストエディタというソフトを使ってコードを記入し、そのコードをWebブラウザで見ることができます。最もシンプルなHTMLページは、基本的な構造だけで十分です。以下に、最も簡単なHTMLコードを紹介します。


<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>My First Web Page</title>
</head>
<body>
    <h1>Hello, World!</h1>
    <p>This is my first HTML page.</p>
</body>
</html>
ブラウザ表示

このコードでは、<!DOCTYPE html>でHTML5を使うことを宣言し、<html>タグでHTML文書の始まりを示しています。<head>タグ内にはページに関する情報(タイトルなど)が含まれ、<body>タグ内には実際のWebページの内容が入っています。<h1>タグで大きな見出しを作り、<p>タグで段落を作ります。

HTMLを作るときは、必ず“<html>”タグで全体を囲み、<head>タグと<body>タグを使ってページの情報を整理します。そして、<title>タグでブラウザのタブに表示されるタイトルを決めます。

これが基本的なHTMLコードの一例ですが、実際にはもっと多くのタグがあって、それを使うことでWebページの内容をより豊かにすることができます。

3. HTML の基本構造

3. HTML の基本構造
3. HTML の基本構造

HTML文書は、決まった構造を持っています。この構造を理解することが、Webページを作るためにはとても重要です。以下は、HTML文書の基本的な構造の例です。


<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>基本的なHTML構造</title>
</head>
<body>
    <!-- Webページのコンテンツがここに来る -->
</body>
</html>

この例では、まず最初に<!DOCTYPE html>があります。これは、HTML5という最新のHTMLを使っていることをブラウザに伝えるためのものです。

次に、<html>タグがあり、HTML文書全体を囲んでいます。lang="ja"という部分は、このページが日本語で書かれていることを示しています。これにより、「日本語のページだよ」とブラウザに伝える役割を持っています。

<head>タグの中にはページの設定情報が含まれています。例えば、<meta charset="UTF-8">は文字コードを設定します。文字が正しく表示されるように設定します。たとえば、日本語の「漢字」や「ひらがな」などをきちんと表示できるようにするための設定です。

<body>タグの中には、実際にWebページに表示される内容が入ります。ここに見出しや段落、画像、リンクなどを追加します。

この基本的な構造を理解し、適切なタグを使うことで、検索エンジンに強いWebページを作成することができます。HTMLはシンプルでありながら、Webページ作成の基礎となる重要な技術です。

コメント
コメント投稿は、ログインしてください

まだ口コミはありません。

カテゴリの一覧へ
新着記事
Java の void メソッドとは?戻り値がない場合の使い方を初心者向けに徹底解説
Javaのメソッドのメリットを完全解説!処理の整理と再利用で初心者でも読みやすいコードに
Javaの戻り値とは?初心者でもわかるメソッドの基本と値を返す仕組み
Javaの引数とは?メソッドに値を渡す方法を初心者向けに徹底解説
人気記事
No.1
Java&Spring記事人気No1
SQLのINSERT文を完全ガイド!初心者でもわかるデータの追加方法
No.2
Java&Spring記事人気No2
SQLのサブクエリを完全ガイド!入れ子クエリの使い方を初心者向け解説
No.3
Java&Spring記事人気No3
HTMLのセレクトボックス(プルダウン)の使い方を完全ガイド!selectとoptionの基本を覚えよう
No.4
Java&Spring記事人気No4
Modelとは?メソッド引数のModelの使い方を初心者向けに解説!