インターネットの始まり 以来、HTML はワールド ワイド ウェブを機能させ、私たちが望むように表示するために不可欠なものでした。 HTML とは何か、そしてそれが毎日目にするページにどのように変化するのかを見てみましょう。
インターネットのバックボーン
HTML は「ハイパーテキスト マークアップ言語」の略です。これは、Web ブラウザーで表示できるページを作成するために使用されるコーディング言語です。あなたが今この記事を読んでいるページも含め、インターネット上で見つけた Web ページのほとんどは HTML ファイルとして保存されています。 Web サイトは、サーバー上に保存された関連する HTML ページの集合です。この言語がしばしば「 インターネットのバックボーン 」と呼ばれるのはそのためです。
インターネット上のページにアクセスするときは、基本的にサーバーに保存されている HTML ファイルをリクエストすることになります。その後、Chrome や Firefox など、使用しているブラウザが HTML を解析し、意図した方法で表示します。
HTML はその普遍性と多用途性により、世界で最も人気のある マークアップ言語 となっています。ほとんどのフロントエンド Web 開発者は、HTML で コードを記述する方法を学ぶこと から始めます。ドラッグ アンド ドロップ ツールと WYSIWYG エディタは最終的に HTML に変換され、ブラウザで解析できるようになります。
HTML の仕組み
他のプログラミング言語と同様、HTML は、前面のビジュアルに変わる前は、コマンドとテキスト ブロックの束のように見えます。この特定のページの HTML がどのように見えるか知りたい場合、デスクトップまたはラップトップを使用している場合は、このページの任意の場所を右クリックして [ページ ソースの表示] を選択してください (オプションはブラウザによって異なる場合があります)。 ）。コードという巨大な壁に直面するはずです。
ほとんどの HTML は、ページ上のさまざまな要素を区切る HTML コードの断片である「要素ブロック」を使用して構築されます。たとえば、この記事の本文は、メニュー、以下の推奨事項、ページのフッターと同様に要素ブロックです。これらの要素は動作が異なる可能性があるため、独自の方法でコード化されています。
HTML ページを構築する上で重要な部分は、カスケード スタイル シート (CSS) の使用です。これらは、ページの特定の要素がどのように見えるべきかを定義するドキュメントです。たとえば、画像の大きさ、ページ上に表示されるフォント、サイズ変更または拡大されたときに Web ページがどのように反応するかなどです 。これらはすべて、魅力的でまとまりのあるスタイリッシュな Web サイトを作成するために重要です。過去 10 年間で Web サイトの見栄えが良くなり始めていることに気付いた方は、CSS の使用が増加していることが最大の理由です。 CSS について詳しくは 、こちらを ご覧ください。
HTML の最も優れた点の 1 つは 、JavaScript または JS を介して動的スクリプトを実行できることです。 これらのスクリプトは動的要素を作成できます。たとえば、特定の Web サイトでは、画像の上にマウスを置くとズームインできます。この効果は、JavaScript 要素にコーディングすることで実現できます。
HTMLの基本
HTML はさまざまなタグやブロックがたくさんあるかなり複雑な言語ですが、Web を閲覧するときに便利な HTML コードがいくつかあります。ここでは、遭遇する可能性のあるいくつかの基本的な HTML タグを示します。
リンクを作成するには、
<a>
コマンドを使用します。 URL はリンクが指す場所であり、「How-to Geek」というテキストがエンドユーザーにどのように表示されるかを示します。
<b>太字</b> <i>斜体</i> <u>下線</u>
太字 斜体 下線
<b>
、
<i>
、および
<u>
を使用して、標準のテキスト書式設定オプション (太字、斜体、下線付きテキスト) を適用できます。
<img src="picture.jpg">
<img>
タグは、ページに画像を埋め込むために使用されます。同じドメインからイメージをプルすることも、外部ドメインを指すこともできます。サイズ変更や代替テキストなどの追加属性を使用してカスタマイズすることもできます。
<h1>見出し 1</h1> <p>段落</p>
上記は見出しタグと段落タグです。 Microsoft Word でテキストをヘッダーと本文に分類できるのと同様に、HTML でもデフォルトのヘッダーと段落のオプションに基づいてテキストを書式設定できます。これらの形式は、CSS スタイルシートを使用して定義されます。
<p style="color:edr;">赤い段落</p>
"style"
属性を使用して、テキストの色、背景色、フォント サイズなどのさまざまなスタイル設定でテキストをカスタマイズすることもできます。
HTML 書式設定オプションの詳細について知りたい場合は、 W3Schools の無料リソース を確認してください。 Web ページの構築を開始するために使用できる HTML タグの完全なリストが見つかります。
