退屈な白黒のウェブサイトが欲しいのは誰ですか? HTML カラーコードの使い方を学ぶと、Web サイトの見栄えが良くなるだけでなく、訪問者がそれを使用する可能性が高まります。 HTML カラー コードは、美的なデザインに使用でき、訪問者の注意をあなたが見たいものに集中させることができます。

ステップ 1

Web セーフ HTML カラー コード チャートを開き、利用可能な色を調べます。ほとんどのコンピュータは任意の色を表示できますが、Web セーフ カラーのみを使用する方がよりアクセスしやすいオプションです。その上、選択できる色がたくさんあります。 Web サイトのテーマとデザインに一致するプロジェクトの色を選択します。経験則として、2 つの補色と 1 つのアクセント カラーを選択することをお勧めします。黒、白、グレー、黄褐色などのニュートラルも良い選択です。

ステップ 2

Web サイトで使用する色の 6 文字の HTML カラー コードをコピーします。これらは、数字の 0、3、6、9 と、さまざまな組み合わせの文字 C と F で構成されています。これらの 6 文字のコードは、カラフルなアクセントを作成したい場所ならどこでも、HTML Web サイト コードで使用されます。

ステップ 3

Web サイトの背景となる色を 1 つ選択します。背景をこの色にするには、HTML コード「」を使用し、6 文字のコードを希望の色コードに置き換えます。これは Web ページ本体の背景全体の色であるため、この HTML コード スニペットは通常の「」タグを置き換えます。

ステップ 4

Web サイト コードのページ内にカラー コードと適切な HTML コードを含めて、Web サイト ページのテキスト、見出し、またはリンクの色を変更します。コードに HTML 属性「」を追加することで、任意のテキストに色を付けることができます。たとえば、大きな見出しの色を変更するには、ウェブサイトのコードに「

見出し

」を追加するだけです。

ステップ 5

代わりにカスケーディング スタイル シート (CSS) を使用して、Web サイトのすべての見出しの色を変更します。ウェブサイト コードの「」タグと「」タグの間にコード「h1 {color:#336699;}」を使用します。 Web サイトで「

」をコーディングするたびに、その色になります。 CSS は、Web サイトのスタイル設定の標準的な方法です。また、再設計したい場合に変更を加えやすくなります。

ステップ 6

CSS でフォ​​ント、リンクなどの色を変更します。フォントには CSS コード スニペット「p {color:#336699;}」を使用します。各テキスト ブロックの HTML は、「

」タグと「

」タグで区切る必要があります。リンクの色は、HTML Web サイト コードで「{color:#336699;}」および「」タグを使用して変更できます。画像の境界線、水平線、テーブル セルなどの他の HTML タグも、基本的な「{color:#336699;}」CSS コード スニペットを使用して変更できます。

ヒント

ガーデニングには緑、赤ちゃんにはパステル調の色合いなど、Web サイトのテーマに合わせて色を調整します。 CSS は、HTML カラー コードを使用して Web サイトに色を追加するための推奨される方法です。

警告

Web サイトの見栄えが悪くならないように、3 色または 4 色のみを選択してください。上記の手順のタグは、わかりやすくするために引用符で囲まれていることに注意してください。コードを HTML に挿入するときは、タグの外側にある引用符を使用しないでください。