チャレンジ:HTMLドキュメントを正しく構造化する
メニューを表示するにはスワイプしてください
目標
基本的なHTMLドキュメント構造を作成し、正しいウェブページを構築すること。この構造はすべてのHTMLページの基盤であり、ブラウザがコンテンツを正しく表示するために必要な要素で構成されている。
ウェブページのデザインが一見シンプルに見えても、正しいドキュメント構造を維持することが非常に重要。これにより、ウェブサイトの可読性と機能性がすべてのブラウザで保たれる。
課題
基本的なHTMLドキュメント構造の作成。すでに自信がある場合は、ステップバイステップガイドを参照せずに進めても問題ありません。より詳細なガイダンスが必要な場合は、手順ごとの説明も利用可能です。
ステップバイステップガイド
ステップ1:HTMLドキュメントの開始
HTMLで記述されていることをブラウザに伝えるため、HTMLのドキュタイプ宣言を入力。宣言はHTMLドキュメントの最初の行に記述。
index.html
ステップ2:htmlの開始タグと終了タグの追加
DOCTYPE宣言の後に、HTMLの開始タグと終了タグを追加します。HTMLドキュメント全体の構造はこれらのタグ内に含まれます。さらに、ドキュメントの言語を指定するために lang 属性も含めます。
index.html
ステップ3:headセクションの作成
HTMLタグ内に開閉の<head>タグを追加。headセクションには、タイトルや外部スタイルシートへのリンクなど、HTMLドキュメントに関するメタ情報が含まれる。
index.html
ステップ4:タイトルの追加
<head>タグ内に開閉の<title>タグを追加。これらのタグの間に入力したテキストは、ブラウザのタイトルバーやタブにウェブページのタイトルとして表示される。
index.html
ステップ5: bodyセクションの作成
<head>セクションの後に、開くと閉じる<body>タグを追加します。bodyセクションにはウェブページの表示内容が含まれます:
index.html
ステップ6:bodyにコンテンツを追加
<body>タグ内には、見出し、段落、画像、リンクなどの要素を追加可能。以下は、見出しと段落を追加する例。
index.html
自分で試してみよう
index.html
フィードバックありがとうございます!
AIに質問する
AIに質問する
何でも質問するか、提案された質問の1つを試してチャットを始めてください