マガジンのカバー画像

(できるだけ)正しい HTML を書くために

6
HTML についてエンジニアで無い人でも分かりやすく解説しました。 これを読んでみなさんも正しい HTML を書きましょう!
運営しているクリエイター

記事一覧

固定された記事

(できるだけ)正しい HTML を書くために ~概要編~

皆さん HTML 書いてますか?
HTML ってタグで囲うだけなので、PHP や JavaScript みたいなプログラミング言語と比べて簡単ですよね。

しかし、簡単故に適当にネットでググって身につけた知識で正しくない HTML を書いている人がそこそこいます。
……残念ながら私の周りでも信じられないぐらい適当なHTMLを書く人が少なくありません。

HTML は簡単ですが ”正しく” 書こうと

もっとみる

(できるだけ)正しい HTML を書くために ~基礎編その 1 ~

この記事は前回書いた「(できるだけ)正しい HTML を書くために ~概要編~」の続きです。
前の記事を読んでいない方は、先にそちらをお読みください。

正しい HTML ってそもそも何?皆さん、何を満たせば正しい HTML だと思いますか?
書いた通りに表示される HTML?
チェックツールでエラーが出ない HTML?
確かに、これらも大事ですが私は

文書構造を重視して適切にマークアップされた

もっとみる

(できるだけ)正しい HTML を書くために ~基礎編その 2 ~

この記事は「(できるだけ)正しい HTML を書くために ~基礎編その 1 ~」の続きです。
前の記事を読んでない方は先にそちらをお読みください。

要素の紹介
文書構造を正しくマークアップするためには、まず「どんな HTML 要素が存在するか」を知っていなければいけません。

存在する HTML 要素を知るには MDN というサイトの中にある HTML 要素リファレンスというページを一通り読むこ

もっとみる

(できるだけ)正しい HTML を書くために ~基礎編その 3 ~

この記事は「(できるだけ)正しい HTML を書くために ~基礎編その 2 ~」の続きです。
前の記事を読んでない方は先にそちらをお読みください。

グルーピングコンテンツ・p 要素
段落を表す要素です。
あくまでも段落を表す要素なので、テキストそのものを表すのに使用すべきではありません。
段落として表現できるものにのみ使うようにしましょう!

・ol 要素
意図的に順序付けられた項目のリストを表

もっとみる

(できるだけ)正しい HTML を書くために ~基礎編その 4 ~

この記事は「(できるだけ)正しい HTML を書くために ~基礎編その 3 ~」の続きです。
前の記事を読んでない方は先にそちらをお読みください。

フォーム・form 要素
フォーム関連要素を含む文書の区間を表す要素です。

仕様
・action 属性でフォーム送信先 URI を指定し、method 属性でフォーム送信に使用する HTTP メソッドを指定します。
・form 要素をネストすること

もっとみる

(できるだけ)正しい HTML を書くために ~実践編~

前回の記事で予告していた通り、今回はサイトのデザインから HTML に落とし込むまでの私なりのやり方を書いていきます。

HTML についてよく知らない人は是非私が書いた過去の記事を読んでください。

今回マークアップするサイトのデザインはこれです!

よくあるブログサイトを目指して描いてみました。(デザインセンスの無さは見逃して……)

注意
※今回はサイトデザインにかかれている文字を適切にマー

もっとみる