• BPnet
  • ビジネス
  • IT
  • テクノロジー
  • 医療
  • 建設・不動産
  • TRENDY
  • WOMAN
  • ショッピング
  • 転職
  • ナショジオ
  • 日経電子版
  • PR

  • PR

  • PR

  • PR

  • PR

エンジニアのためのWebデザイン教室

第4回 Webデザインの基本を学ぶための環境について

園田 誠 2008/02/26 日経ソフトウエア
今回のポイント
HTMLはUTF-8で書くのがトレンド

 前回,HTMLに対してCSSを適用する簡単な例を見てみました。HTMLに対してCSSで装飾を施す方法は3種類あります。前回の例はその一つにすぎません。CSSについて深く追求していくにあたって,3種類あるCSSの書き方をマスターしておくことにしましょう。

 と,その前に,まずはCSSで装飾するベースとなるHTMLについて説明しておきましょう。HTMLにはHTML 4.01,XHTML 1.0,XHTML 1.1などいくつかの規格があります。大枠として基本部分での差異はさほどありません。

 2008年2月現在,マイクロソフトのサイトではXHTML1.0が使われています。GoogleはHTML 4.01を使っています。Amazonは特に明示的なバージョン表記はありません。大手でも常に最新規格(上記例の中ではXHTML 1.1が最も新しい)を使っているわけではないということです。勧告から10年近く経つ古いHTML規格が未だに大手サイトでも使われているんです。

 本記事はXHTML1.0をベースにすすめていきます。XHTML 1.0でサンプルを作ると次のようになります(リスト1)。

リスト1●XHTML 1.0のサンプル

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html 
    PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
  <head>
  <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <title>ページタイトル</title>
  </head>
  <body>
    <p>本文と<a href="http://xxxx.xxxxx.xxxx/">リンク</a>の例</p>
  </body>
</html>

 冒頭部は

<?xml version="1.0" encoding="UTF-8"?>

です。この書き方を覚えてください。これはXML バージョン1.0の仕様に従って記述し,文字コードはUTF-8(Unicode Translation Format-8)を使うということを意味しています。続いて<!DOCTYPE~>があって,<html>のところも少しごちゃごちゃと書かれていますが,<head>以降は雑誌記事などに見られる,いわゆる簡略化されたHTMLと同じ構造です。冒頭部にちょっとだけ手間がかかるというわけです。

 2006年あたりからHTMLを記述する文字コードはUnicode(ユニコード)のUTF-8が標準になっています。数年前まではLinuxなどのUNIX系ではEUCという日本語文字コードが主流でしたし,Windowsの標準はシフトJISでした。現在はこうしたOSごとの文字コードの違いは,関係各所の啓蒙活動と尽力からかUTF-8に統一されてきています。

 XHTMLは,その名前の通りXMLとHTMLを融合させようという流れの中から出てきた規格です。XMLの記述はUTF-8の使用が望ましいですし,更新情報を提供するRSSもUTF-8が前提になっています。したがって,サイトと関連するシステム全体の親和性から考えてもUTF-8を使うことが極めて妥当な時代になっていると解釈してください。「携帯サイトなのでどうしてもシフトJISで書かなくてはならない」などの理由がなければ,今後,HTMLはUTF-8で記述されることをおすすめします。

ここから先はITpro会員(無料)の登録が必要です。

次ページ UTF-8の読み書きができるエディタを使おう
  • 1
  • 2

あなたにお薦め

連載新着

連載目次を見る

今のおすすめ記事

  • 【AIと倫理】

    脳から学べば汎用AIの実現は近い、開発を萎縮させない議論を

     ドワンゴ人工知能研究所の山川宏所長は、最新の脳神経科学の成果を取り込んだ、汎用AIの研究開発に取り組んでいる。実現する手法として提唱するのが、脳が持つ部位ごとの機能をコンピュータに模倣させ、各機能を連携させることで汎用性の高い知性を実現するという「全脳アーキテクチャ(WBA)」だ。

  • 【記者の眼】

    「無人」だから客が集まる、チャットボット接客が続々

     小売業界では、販売スタッフの立っている場所で客が立ち寄りやすい店になるか、入りにくい雰囲気の店になるかが分かれるという。立ち寄りやすい店は店員の存在感をあまり感じさせない。この知恵がネットビジネスの分野でも生きようとしている。人に代わって最初に“接客”するのはチャットボットだ。

ITpro SPECIALPR

What’s New!

経営

アプリケーション/DB/ミドルウエア

クラウド

運用管理

設計/開発

サーバー/ストレージ

クライアント/OA機器

ネットワーク/通信サービス

セキュリティ

もっと見る