oyuuuhan、プログラミングを学ぶ

フィヨルドブートキャンプでプログラミングを学ぶUIデザイナーのブログです。

HTMLを書くときに見たいリンク集

公式ドキュメント

HTML Living Standard

全タグ

https://developer.mozilla.org/ja/docs/Web/HTML/Element

アクセシビリティについての考え方

Web Content Accessibility Guidelines 2.1に準拠する

構造化のやり方

HTMLのセクションとアウトラインを理解する | できるネット HTMLのカテゴリーとコンテンツモデルを理解する | できるネット

インデント

HTMLコーディングの際のインデントルール

バリデーション

Markup Validation Service

HTMLの基本まとめ

HTMLとは何か

  • HTMLは文書構造を示す言語
    • HyperText(ハイパーリンクでつながった) Markup(文章の構造を表すタグをつける) Langage(言語)
  • ホームページの文章に意味や役割をつける言語

タグで挟んで意味をつける

<h1>~</h1>

のようにタグで挟む。タグのことを要素という。

よいHTML

  • 文章の意味上の位置付けだけを示し、ソフトウェアが読者の環境に合わせて表示する
  • 見かけ上の表現方法と構造が分離されたHTMLが「よいHTML」

HTMLの基本形

  • head要素…そのHTMLファイル自身に関する情報
  • body要素…読者に読んでもらう本文

タグとは何か

タグは要素の名前を山括弧( < と > )で囲んだもの。

<head>ヘッド要素の内容</head>

基本的なタグ

  • head そのHTMLファイル自身に関する情報
  • body 読者に読んでもらう本文
  • title そのHTMLの表題
  • h1h6 見出し(Heading)
  • p 段落(Paragraph)
  • br 改行
  • section 段落ごとの区切り
  • mainheaderfooter そのサイト全体における情報の位置付け

アクセシビリティについての考え方

Web Content Accessibility Guidelines 2.1に準拠する