アルファサード株式会社 代表取締役 野田 純生のブログ


プレビュー時に画像のALT属性をチェックをするMTImgAltCheckerプラグイン。


公開日 : 2009-11-10 19:50:52


MTIfPreviewプラグインってのをカッとなってアップしたら、たくさん(@usualoma)から

@junnama <mt:IfPreview></mt:IfPreview> は、<mt:If name="preview_template"></mt:If> でもいいんじゃないかと思いました。

と来たもんだw

ときたらMT芸人の先輩としてはさらにカッとなるのが心情というもんで、書いた。プレビュー拡張してIMG要素のALTをチェックするプラグイン。

(追記)MTImgAltCheckブロックタグには、targetモディファイアとして[tag|src]のいずれかが指定できます。tagを指定した場合はtagsモディファイアに評価したいタグをカンマ区切りで指定します。下記の例はMTEntryBodyの中身のみチェックします。

srcを指定した場合は評価したいソースをSetVarBlock等で変数に入れてsrc属性に突っ込んでください。(追記ここまで)

ブログ記事アーカイブのテンプレート

<MTIfPreview>
<h3>
ALT属性のチェック結果
</h3>
<MTImgAltCheck target="tag" tags="MTEntryBody">
<MTImgAltCheckHeader>
<table border="1">
    </MTImgAltCheckHeader>
    <tr>
        <td>alt属性の値:
            <MTImgAltCheckImgAlt></td>
        <td><a href="<MTImgAltCheckImgSrc>" target="_blank"><MTImgAltCheckFilename></a></td>
        <td>
            <MTIf name="__error__">
            <MTImgAltCheckErrorMessage>
            <MTElse>
            チェックOK
            </MTElse>
            </MTIf></td>
    </tr>
    <MTImgAltCheckFooter>
</table>
</MTImgAltCheckFooter>
</MTImgAltCheck>
</MTIfPreview>

結果はプレビュー時のみ表示されます

プレビューでの画像のALT属性チェックの結果

ループの中ではMTImgAltCheckErrorCodeタグで以下の4種類の値が所得できます。

エラーコードエラーの内容
1ALT属性そのものがない
2ALT属性が空
3ALT属性値がファイル名と同じ(MTだとありがち?)
4ALT属性が(半角)スペースのみ

ALT属性が空でもいいときあるじゃんとか言うなよ。そういうのはちゃんと確認してチェックするんだ!

ダウンロード

ライセンス:Artistic License



このブログを書いている人
野田純生の写真
野田 純生 (のだ すみお)

大阪府出身。ウェブアクセシビリティエバンジェリスト。 アルファサード株式会社の創業者であり、現役のプログラマ。経営理念は「テクノロジーによって顧客とパートナーに寄り添い、ウェブを良くする」。 プロフィール詳細へ