目次

チェック項目　８-２「ＲＳの背景色が白の場合に外字画像がきちんと表示されるか」「ＲＳの背景色を黒にした場合に外字画像の可読性が確保されているか」「画像の代替テキストがテキスト検索の対象になるか」「画像の代替テキストが音声読み上げの対象になるか」

チェック項目　８-２
「ＲＳの背景色が白の場合に外字画像がきちんと表示されるか」
「ＲＳの背景色を黒にした場合に外字画像の可読性が確保されているか」
「画像の代替テキストがテキスト検索の対象になるか」
「画像の代替テキストが音声読み上げの対象になるか」

（外字画像が白黒反転表示されているかどうかを確認するために、ＲＳ側で背景色を変えてチェックすること。）

縦

透過PNG形式（電書協ガイド準拠／インデックス）

外字

例：

<p>「<img class="gaiji" src = "../image/gaiji-png8-touka-001.png" alt = "えい" />」</p>

「えい」

外字（縦長）

例：

<p>「さま<img class="gaiji-line" src = "../image/gaiji-png8-touka-002.png" alt = "〴〵" />」</p>

「さま〴〵」

外字（横長）

例：

<p>「<img class="gaiji-wide" src = "../image/gaiji-png8-touka-003.png" alt = "beer!" />」</p>

「beer!」

非透過PNG形式（インデックス）

外字

例：

<p>「<img class="gaiji" src = "../image/gaiji-png8-hitouka-001.png" alt = "えい" />」</p>

「えい」

外字（縦長）

例：

<p>「さま<img class="gaiji-line" src = "../image/gaiji-png8-hitouka-002.png" alt = "〴〵" />」</p>

「さま〴〵」

外字（横長）

例：

<p>「<img class="gaiji-wide" src = "../image/gaiji-png8-hitouka-003.png" alt = "beer!" />」</p>

「beer!」

透過PNG形式（RGB）

外字

例：

<p>「<img class="gaiji" src = "../image/gaiji-png24-touka-001.png" alt = "えい" />」</p>

「えい」

外字（縦長）

例：

<p>「さま<img class="gaiji-line" src = "../image/gaiji-png24-touka-002.png" alt = "〴〵" />」</p>

「さま〴〵」

外字（横長）

例：

<p>「<img class="gaiji-wide" src = "../image/gaiji-png24-touka-003.png" alt = "beer!" />」</p>

「beer!」

非透過PNG形式（RGB）

外字

例：

<p>「<img class="gaiji" src = "../image/gaiji-png24-hitouka-001.png" alt = "えい" />」</p>

「えい」

外字（縦長）

例：

<p>「さま<img class="gaiji-line" src = "../image/gaiji-002.png" alt = "〴〵" />」</p>

「さま〴〵」

外字（横長）

例：

<p>「<img class="gaiji-wide" src = "../image/gaiji-003.png" alt = "beer!" />」</p>

「beer!」

透過GIF形式

外字

例：

<p>「<img class="gaiji" src = "../image/gaiji-gif-touka-001.gif" alt = "えい" />」</p>

「えい」

外字（縦長）

例：

<p>「さま<img class="gaiji-line" src = "../image/gaiji-gif-touka-002.gif" alt = "〴〵" />」</p>

「さま〴〵」

外字（横長）

例：

<p>「<img class="gaiji-wide" src = "../image/gaiji-gif-touka-003.gif" alt = "beer!" />」</p>

「beer!」

非透過GIF形式

外字

例：

<p>「<img class="gaiji" src = "../image/gaiji-gif-hitouka-001.gif" alt = "えい" />」</p>

「えい」

外字（縦長）

例：

<p>「さま<img class="gaiji-line" src = "../image/gaiji-gif-hitouka-002.gif" alt = "〴〵" />」</p>

「さま〴〵」

外字（横長）

例：

<p>「<img class="gaiji-wide" src = "../image/gaiji-gif-hitouka-003.gif" alt = "beer!" />」</p>

「beer!」

横

透過PNG形式（電書協ガイド準拠／インデックス）

外字

例：

<p>「<img class="gaiji" src = "../image/gaiji-png8-touka-001.png" alt = "えい" />」</p>

「えい」

外字（縦長）

例：

<p>「さま<img class="gaiji-line" src = "../image/gaiji-png8-touka-002.png" alt = "〴〵" />」</p>

「さま〴〵」

外字（横長）

例：

<p>「<img class="gaiji-wide" src = "../image/gaiji-png8-touka-003.png" alt = "beer!" />」</p>

「beer!」

非透過PNG形式（インデックス）

外字

例：

<p>「<img class="gaiji" src = "../image/gaiji-png8-hitouka-001.png" alt = "えい" />」</p>

「えい」

外字（縦長）

例：

<p>「さま<img class="gaiji-line" src = "../image/gaiji-png8-hitouka-002.png" alt = "〴〵" />」</p>

「さま〴〵」

外字（横長）

例：

<p>「<img class="gaiji-wide" src = "../image/gaiji-png8-hitouka-003.png" alt = "beer!" />」</p>

「beer!」

透過PNG形式（RGB）

外字

例：

<p>「<img class="gaiji" src = "../image/gaiji-png24-touka-001.png" alt = "えい" />」</p>

「えい」

外字（縦長）

例：

<p>「さま<img class="gaiji-line" src = "../image/gaiji-png24-touka-002.png" alt = "〴〵" />」</p>

「さま〴〵」

外字（横長）

例：

<p>「<img class="gaiji-wide" src = "../image/gaiji-png24-touka-003.png" alt = "beer!" />」</p>

「beer!」

非透過PNG形式（RGB）

外字

例：

<p>「<img class="gaiji" src = "../image/gaiji-png24-hitouka-001.png" alt = "えい" />」</p>

「えい」

外字（縦長）

例：

<p>「さま<img class="gaiji-line" src = "../image/gaiji-002.png" alt = "〴〵" />」</p>

「さま〴〵」

外字（横長）

例：

<p>「<img class="gaiji-wide" src = "../image/gaiji-003.png" alt = "beer!" />」</p>

「beer!」

透過GIF形式

外字

例：

<p>「<img class="gaiji" src = "../image/gaiji-gif-touka-001.gif" alt = "えい" />」</p>

「えい」

外字（縦長）

例：

<p>「さま<img class="gaiji-line" src = "../image/gaiji-gif-touka-002.gif" alt = "〴〵" />」</p>

「さま〴〵」

外字（横長）

例：

<p>「<img class="gaiji-wide" src = "../image/gaiji-gif-touka-003.gif" alt = "beer!" />」</p>

「beer!」

非透過GIF形式

外字

例：

<p>「<img class="gaiji" src = "../image/gaiji-gif-hitouka-001.gif" alt = "えい" />」</p>

「えい」

外字（縦長）

例：

<p>「さま<img class="gaiji-line" src = "../image/gaiji-gif-hitouka-002.gif" alt = "〴〵" />」</p>

「さま〴〵」

外字（横長）

例：

<p>「<img class="gaiji-wide" src = "../image/gaiji-gif-hitouka-003.gif" alt = "beer!" />」</p>

「beer!」

チェッカーテストサンプル8-X-X

三陽社メディア開発室／電書ラボ