水平線・横線
HTMLで水平線(横線)を引くには<hr>タグを使います。空要素(void element)なので、終了タグは不要です。ページ内でコンテンツを区切る際に使用します。 とても簡単ですが、デザインを変更するのが案外難しい、というか、変更できることを知らない方もいます。 ※垂直(縦線)を引くのも案外難しいので別で紹介する予定です。 <hr>タグをCSSでカスタ...
HTMLで水平線(横線)を引くには<hr>タグを使います。空要素(void element)なので、終了タグは不要です。ページ内でコンテンツを区切る際に使用します。 とても簡単ですが、デザインを変更するのが案外難しい、というか、変更できることを知らない方もいます。 ※垂直(縦線)を引くのも案外難しいので別で紹介する予定です。 <hr>タグをCSSでカスタ...
WEBページをコーディングする際にSEOに最適化されたコードを書いていますか❓なかなかできていない方が多いのではないでしょうか。クライアントからは見えない箇所なので手を抜きがちになってしまいます。 SEO対策は全てを行うことは大変で、時間もお金もかかるので、コーダーは少なくともセマンティックHTMLコーディングを行うべきだと考えています。 セマンティックHTMLコーディングとは、SE...
HTMLには、見出しの重要度に応じてh1からh6までの6段階の見出しタグがあります。h1が最も重要で、h6が最も重要度が低い見出しです。これらのタグは、ブラウザで表示される際に、デフォルトでは自動的に太字になり、上下に余白ができますが、CSSでカスタムすることが通常です。 コード <!DOCTYPE html> <html lang="ja"> <head> ...
リストに順番を付けたい場合に'ol'タグを使用します。 例えば、手順、ランキング、目次、時系列のイベントなど、順番が重要な場合に役に立ちます。 コード <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8" /> <meta name="viewport" c...
情報を整理し、見やすく、理解しやすくしたいときに効果的な手法です。 長文や難解な文章は、項目として列挙したり、塊を分解してみたり、階層を作ったりして読みやすくしてみましょう。 コード <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8" /> <meta ...
最も基本的なHTMLコードの紹介です。 プログラミングではよく「Hello World!」が使われますが、なぜでしょう❓ その答えは、あなたもきっと、下記コードを実際にブラウザで表示できたときに実感するでしょう。 小さな成功は大きな一歩なのです。 コード <!DOCTYPE html> <html lang="ja"> <head> ...
HTMLとは「HyperText Markup Language」の略で、WEBページの構造と内容を作るためのマークアップ言語です。その構造とは、見出し、段落、リスト、表、行、列などの文書構造が挙げられます。さらに、その構造の中にテキスト、画像、リンク、動画などのコンテンツ(要素)を配置していきます。 「タグ」と呼ばれる記号を使って表現します。多くは開始タグと終了タグのペアになっています。...