Your first web page
This page needs a recent browser (with SharedArrayBuffer support). Please update Chrome, Edge, Firefox or Safari to the latest version. · このページには最新のブラウザ（SharedArrayBuffer対応）が必要です。Chrome、Edge、Firefox、Safariを最新バージョンに更新してください。
English
Welcome to the web
- A web page is made with HTML.
- HTML is just text with tags around it.
- You write HTML here and watch it appear — nothing to install.
日本語
ウェブへのようこそ
- ウェブページはHTMLで作成されます。
- HTMLとは単にタグで囲まれたテキストです。
- ここでHTMLを書いて、表示されるのを確認 — インストール必要なものは一切ありません。
English
How this page works
- Type in the box, then press ▶ to see your page.
- Press ✓ Check to see if your task is correct.
- Stuck? Press 💡 for a hint. Press ↻ to start over.
- Read each step, then press Continue.
日本語
このページの仕組み
- ボックスに入力し、**▶**を押してあなたのページを確認します。
- ✓ Checkを押して、タスクが正しいかどうかを確認します。
- 詰まった場合は、ヒントを得るために**💡を押します。やり直すには↻**を押します。
- 各手順を読み、次へ を押してください。
English
Tags wrap your words
- A tag is a word inside angle brackets, like
<p>. - Most tags come as a pair: an opening
<p>and a closing</p>. - A
<p>makes a paragraph — a block of text.
日本語
タグが単語を包み込みます
- タグとは角括弧内の言葉であり、例として
<p>があります。 - ほとんどのタグはペアで存在します: 開きタグ
<p>と閉じタグ</p>です。 <p>は段落 — テキストのブロック — を作成します。
<p>Hello! This is my first web page.</p>
English
More than one paragraph
- Put each paragraph in its own pair of
<p>tags. - The browser shows them one after another, top to bottom.
日本語
複数の段落
- 各段落を独立した
<p>タグのペアに含めます。 - ブラウザはそれらを上から下へ順番に表示します。
<p>I am learning HTML.</p>
<p>This is fun.</p>
English
Common mistakes
- Tags go in angle brackets; the text you see goes between them.
- Most tags come in pairs, like
<p>...</p>.
日本語
よくあるミス
- タグは角括弧の中にあり、表示されるテキストはその間にあります。
- ほとんどのタグはペアで存在し、例として
<p>...</p>があります。
English
Now you try
- Below are two small tasks. Type your HTML and press ▶ to see it.
- Press ✓ Check when you think it is right. You can try as many times as you like.
日本語
あなたも試してみよう
- 以下の2つの小さなタスクがあります。HTMLを入力して ▶ を押すと表示されます。
- 正解だと思ったら ✓ Check を押してください。何度でも試せます。
Explore · 探索
HTML is a tree of nodes
Tags nest inside tags — the browser builds a tree (the DOM).
Write a paragraph that says Hello, world! — type your text between the <p> and </p> tags.
Add a second paragraph below the first one. Make it say I made this. (Use a new pair of <p> … </p> tags.)