ITパスポート 2019年 春期 問81

Webサイトを構築する際にスタイルシートを用いる理由【ITパスポート 解説】

正解の理由

解法ステップ

1. 「スタイルシート」が何を扱うかを確認する。→ 見た目（デザイン）を指定するもの（CSS）。
2. 各選択肢の役割を考える。
   • セキュリティや安全なデータ送受信はTLS/SSLの役目。
   • 更新情報を知らせるのはRSSやメール、プッシュ通知の役目。
   • 利用者の識別はCookie（クッキー）やセッションの役目。
3. 見た目の統一に関係するものを選ぶ。→ エ を選ぶ。

選択肢別の誤答解説

• ア: WebサーバとWebブラウザ間で安全にデータをやり取りできるようになる。
  → これはTLS（Transport Layer Security：通信を暗号化して安全にする仕組み）やSSL（Secure Sockets Layer）の役割です。スタイルシート（CSS）は見た目を定義するだけで、通信の暗号化や安全性には関係しません。
• イ: Webサイトの更新情報を利用者に知らせることができるようになる。
  → 更新通知はRSS（Really Simple Syndication：更新情報を配信する仕組み）、メール通知、プッシュ通知などが使われます。CSSは静的な見た目指定なので、通知機能は提供しません。
• ウ: Webサイトの利用者を識別できるようになる。
  → 利用者識別はCookie（ブラウザに保存する小さなデータ）やサーバ側のセッション管理の仕事です。CSSはユーザーの見た目を変えるだけで、識別情報を保持したりする機能はありません。
• エ: 複数のWebページの見た目を統一することが容易にできるようになる。
  → 正解です。外部のCSSファイルを1つ用意して複数ページで読み込めば、全ページのデザインを一括で管理できます。例えば「会社のブランドカラーを変えたい」ときに、CSSの1箇所を直すだけで全ページに反映できます。

よくある誤解

1. 「スタイルシートはサイトの機能（ボタンの動きや認証）も制御する」
   → 誤りです。CSSは見た目（色・配置・フォント等）を制御します。動きや挙動は主にJavaScript（ウェブページ上で動作するプログラム言語）などが担当します。
2. 「HTMLとCSSは同じもの」
   → HTML（HyperText Markup Language：文書の構造や内容を表す言語）は文章や見出し、リンクなどの中身を作ります。CSSはその見た目を整える別のものです。役割が違うので分けて扱うと管理が楽になります。
3. 「スタイルはページごとにしか設定できない」
   → 外部CSSを使えば1つのルールで何百ページにも適用できます。逆にページごとに書くと管理が大変になります。

補足コラム

• 外部CSS・内部CSS・インラインCSSの違い（簡単な例）
  • 外部CSS: 別ファイルに書き、HTMLで読み込む方法。保守性が高い。

    <!-- HTMLのhead内で外部CSSを読み込む例 -->
    <link rel="stylesheet" href="styles.css">
    

    /* styles.css の例 */
    body { font-family: Arial, sans-serif; color: #333; }
    h1 { color: #0066cc; }
    

  • 内部CSS: HTMLの内に直接書く方法。ページ単位のカスタマイズに便利。
  • インラインCSS: HTMLの各要素に直接style属性で書く方法。特定箇所のみ上書きしたいときに使われるが、管理は難しい。
• 「カスケード（Cascading）」と「特異性（specificity）」
  → CSSはどのルールが優先されるかを決める仕組み（カスケード）を持ちます。具体的には、より詳細に指定したルールが優先されます。初学者はまず「外部CSSで基本ルール、必要に応じて上書きする」という使い方を覚えるとよいです。
• レスポンシブデザイン（画面サイズに応じた見た目変更）もCSSで実現できます。スマホ・タブレット・PCで見た目を変えたいときに有効です。

FAQ