home > 『Web標準の教科書』読者サポートページ > 第2章 第8節
第2章 第8節(p.69-82)
<h4>Web上で一般に利用される画像形式</h4>
<ul>
<li>GIF(.gif)</li>
<li>JPEG(.jpg/.jpeg)</li>
<li>PNG(.png)</li>
</ul>
<h4>ディスプレイサイズ設定の上位3位</h4>
<ol>
<li>1,028×768ピクセル</li>
<li>1,280×1,024ピクセル</li>
<li>800×600ピクセル</li>
</ol>
<p>一般的な視覚系ブラウザは、</p>
<ul>
<li>Internet Explorer</li>
<li>Netscape</li>
<li>Mozilla</li>
<li>Opera</li>
<li>Safari</li>
</ul>
<p>の5つである。</p>
<p>一般的な視覚系ブラウザは、次の5つである。</p>
<ul>
<li>Internet Explorer</li>
<li>Netscape</li>
<li>Mozilla</li>
<li>Opera</li>
<li>Safari</li>
</ul>
<ul>
<li>Internet Explorer
<ul>
<li>4.x</li>
<li>5.x</li>
<li>6.x</li>
</ul>
</li>
:
:
</ul>
<dl>
<dt>MIDI</dt>
<dd>
<p>Musical Instrument Digital Interfaceの略。音楽データの世界共
通規格であり、Web上で一般に使用される音声ファイル形式。旋律を音
符で表現するデータタイプであるため、ファイルサイズが小さく、Web
上での配信に適してるという特徴がある。拡張子は「.mid」または
「.midi」。</p>
<p>なお厳密には、世界共通規格のMIDIはGM(General MIDI)であり、
さらに上位互換の音源規格として、ヤマハ社のXG、ローランド社のGS
などがある。</p>
</dd>
<dt>MP3</dt>
<dd>
<p>MPEG Audio Layer-3の略。映像データの圧縮方式であるMPEG-1のう
ち、音声データの圧縮技術のみを適用して作成される音声ファイル形
式。拡張子は「.mp3」。</p>
<p>CD並の音質を保ったまま、無圧縮の WAVEファイルと比べてファイ
ルサイズを約1/11まで圧縮できる(下位技術であるMP1は約1/4、MP2は
約1/7程度の圧縮率)。</p>
</dd>
</dl>
<dl>
<dt>2005年2月15日</dt>
<dd>Webデザイン講座に<a href="./design/color_samples.html">カラー
サンプル</a>を追加。</dd>
<dt>2005年2月10日</dt>
<dd>Webコンテンツ講座に<a href="./contents/copyright.html">コンテ
ンツと著作権</a>を追加。</dd>
</dl>
<dl>
<dt>Webデザインリファレンス</dt>
<dd>HTML/XHTML辞典</dd>
<dd>CSS辞典</dt>
<dd>Web文字/記号辞典</dd>
<dd>Webカラー辞典</dd>
<dd>Webメディア辞典</dd>
</dl>
<table>
<tr>
<th>ブラウザ名</th><th>割合</th>
</tr>
<tr>
<td>Internet Explorer</td><td>94.10%</td>
</tr>
<tr>
<td>Netscape</td><td>3.61%</td>
</tr>
<tr>
<td>Opera</td><td>1.13%</td>
</tr>
<tr>
<td>Mozilla</td><td>0.79%</td>
</tr>
<tr>
<td>その他</td><td>0.37%</td>
</tr>
</table>
<table summary="ブラウザの利用者割合に関する独自調査。
2004年第2四半期が対象。1列目がブラウザ名、2列目が割合。">
<tr>
<th abbr="ブラウザ">ブラウザ</th>
<th abbr="割合">割合</th>
</tr>
:
:
<table summary="ブラウザの利用者割合に関する独自調査。
2004年第2四半期が対象。1列目がブラウザ名、2列目が割合。">
<caption>ブラウザの利用者割合</caption>
<tr>
<th abbr="ブラウザ">ブラウザ</th>
<th abbr="割合">割合</th>
</tr>
:
:
table { caption-side: right }
caption { text-align: right }
<table summary="ブラウザの利用者割合に関する独自調査。
2004年第2四半期が対象。1列目がブラウザ名、2列目が割合。"
border="1" cellspacing="2" cellpadding="4">
:
:
table {
width: 100%;
border-top: 1px solid #000000;
border-left: 1px solid #000000;
border-spacing: 0;
}
thead { border-bottom: 2px dotted #666666 }
tfoot { border-top: 2px dotted #666666 }
th, td {
border-right: 1px solid #000000;
border-bottom: 2px solid #000000;
padding: 5px;
}
<table summary="ブラウザの利用者割合に関する独自調査。
2004年第2四半期が対象。1列目がブラウザ名、2列目が割合。">
<caption>ブラウザの利用者割合</caption>
<thead>
<tr>
<th abbr="ブラウザ">ブラウザ</th>
<th abbr="割合">割合</th>
</tr>
</thead>
<tfoot>
<tr>
<td>合計</td><td>100%</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>Internet Explorer</td><td>94.10%</td>
</tr>
:
:
</tbody>
</table>
<table summary="ブラウザの利用者割合に関する独自調査。
2004年第2四半期が対象。1列目がブラウザ名、2列目が割合。">
<caption>ブラウザの利用者割合</caption>
<colgroup span="2">
<col class="brouwsers" />
<col class="versions" />
</colgroup>
<col class="percentage" />
<thead>
<tr>
<th abbr="ブラウザ">ブラウザ</th>
<th abbr="バージョン">バージョン</th>
<th abbr="割合">割合</th>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="2">合計</td><td>100%</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>Internet Explorer</td><td>6.x</td><td>83.24%</td>
</tr>
<tr>
<td>Internet Explorer</td><td>5.x</td><td>10.76%</td>
</tr>
<tr>
<td>Internet Explorer</td><td>4.x</td><td>0.10%</td>
</tr>
<tr>
<td colspan="2">小計</td><td>93.10%</td>
</tr>
:
:
</tbody>
</table>
:
:
<tbody>
<tr>
<td rowspan="3">Internet Explorer</td><td>6.x</td><td>83.24%</td>
</tr>
<tr>
<td>5.x</td><td>10.76%</td>
</tr>
<tr>
<td>4.x</td><td>0.10%</td>
</tr>
<tr>
<td colspan="2">小計</td><td>93.10%</td>
</tr>
:
:
</tbody>
:
:
:
:
<tbody>
<tr>
<td rowspan="3" valign="top">Internet Explorer</td>
<td>6.x</td><td char="." charoff="10">83.24%</td>
</tr>
<tr>
<td>5.x</td><td char="." charoff="10">10.76%</td>
</tr>
<tr>
<td>4.x</td><td char="." charoff="10">0.10%</td>
</tr>
<tr>
<td colspan="2">小計</td>
<td char="." charoff="10">93.10%</td>
</tr>
:
:
</tbody>
:
:
th { text-align: center; vertical-align: middle; }
td { text-align: left; vertical-align: top; }
:
:
<thead>
<tr>
<th id="brs" abbr="ブラウザ">ブラウザ</th>
<th id="ver" abbr="バージョン">バージョン</th>
<th id="pct" abbr="割合">割合</th>
</tr>
</thead>
<tfoot>
<tr>
<td headers="brs ver" colspan="2">合計</td>
<td headers="pct">100%</td>
</tr>
</tfoot>
<tbody>
<tr>
<td headers="brs" rowspan="3">Internet Explorer</td>
<td headers="ver">6.x</td>
<td headers="pct">83.24%</td>
</tr>
<tr>
<td headers="ver">5.x</td>
<td headers="ver">10.76%</td>
</tr>
<tr>
<td headers="ver">4.x</td>
<td headers="pct">0.10%</td>
</tr>
<tr>
<td headers="brs ver" colspan="2">小計</td>
<td headers="pct">93.10%</td>
</tr>
:
:
</tbody>
:
:
:
:
<thead>
<tr>
<th scope="col" abbr="ブラウザ">ブラウザ</th>
<th scope="col" abbr="バージョン">バージョン</th>
<th scope="col" abbr="割合">割合</th>
</tr>
</thead>
<tfoot>
<tr>
<td colspan="2">合計</td><td>100%</td>
</tr>
</tfoot>
<tbody>
<tr>
<td rowspan="3">Internet Explorer</td><td>6.x</td><td>83.24%</td>
</tr>
<tr>
<td>5.x</td><td>10.76%</td>
</tr>
<tr>
<td>4.x</td><td>0.10%</td>
</tr>
<tr>
<td colspan="2">小計</td><td>93.10%</td>
</tr>
:
:
</tbody>
:
:
:
:
<thead>
<tr>
<th id="brs" axis="視覚系" abbr="ブラウザ">ブラウザ</th>
<th id="ver" axis="視覚系" abbr="バージョン">バージョン</th>
<th id="pct" abbr="割合">割合</th>
</tr>
</thead>
<tfoot>
<tr>
<td headers="brs ver" colspan="2">合計</td>
<td headers="pct">100%</td>
</tr>
</tfoot>
<tbody>
<tr>
<td headers="brs" rowspan="3">Internet Explorer</td>
<td headers="ver">6.x</td>
<td headers="pct">83.24%</td>
</tr>
<tr>
<td headers="ver">5.x</td>
<td headers="ver">10.76%</td>
</tr>
<tr>
<td headers="ver">4.x</td>
<td headers="pct">0.10%</td>
</tr>
<tr>
<td headers="brs ver" colspan="2">小計</td>
<td headers="pct">93.10%</td>
</tr>
:
:
</tbody>
:
: