非エンジニアも知っておきたい！HTMLとCSSの基礎知識

CSSの基礎

一方でCSS（Cascading Style Sheets）とは、ブラウザ上でその文字や画像をどのようなデザインで表示させるかを決めるコンピューター言語です。スタイルシートとも呼ばれるので覚えておきましょう。

HTMLは文字に意味合いを持たせることができますが、色を変えるなどの装飾には向いていません。そこでより見やすく、読みやすくするための装飾にはCSSが使われます。

例えばHTMLでグループ分けされた文字列を赤で表示させたり、背景色を変えたり、文字を太くしたりなど。こうした装飾があるかないかで、ユーザビリティにも影響を与える可能性があります。

HTMLと一緒に使われるCSSプロパティ

CSSはHTMLがあってこそのもので、2つで1つだと言っても過言ではありません。
そこで、よく使われるCSSプロパティも覚えておきましょう。

フォントの種類／font-family
文字色／color
文字の大きさ／font-size
背景の指定／background
背景の色／background-color
行の高さ／line-height
幅／width

これでh1の文字の色、大きさを変えたいときは次のようになります。

h1{font-size: 20px, color: blue;}

20pxが文字の大きさ、blueが文字の色です。
自分が扱うWebサイトのスタイルシートをぜひ眺めてみてください。きっとどんな仕組みになっているのか、わかるようになってくるでしょう。

参考：CSSとは？−CSSの基本｜HTMLクイックリファレンス

初心者でもHTMLとCSSをWebサイトに活用！

CMSを使うことで誰でも簡単にWebサイトを更新できますが、CMSにはどうしても制限があり、自分が思ったように編集できないなんてことも。

HTMLとCSSの基礎知識だけでも持っておくことで、細かい編集をしようと思ったときに有利になります。
また、問題があればすぐに発見でき、効率的に作業ができるようになるので、時間短縮にも役立ちます。

ぜひHTMLとCSSを覚えて、Webサイト運用に活用しましょう！

HTMLとCSSについて学ぶ

SEO対策ですぐ使える6つのHTMLタグを解説！記述法や特徴、最適化の方法を紹介

この記事では、SEOの基本となるHTMLの「タグ」について解説していきます。タグを利用する目的や効果的な使い方を理解しましょう。

CSSで知っておきたい、フォントサイズ指定の単位のすべて

今回は、CSSで知っておきたいフォントサイズ指定の単位について、「px」を使うことで生じる問題についても触れながら解説します。 20年前のWebスタンダードを脱し、今日のWebの基準に合わせていくために、正しい知識を確認していきましょう。