制作スピードを速めトラブルを防ぎたいならALTタグはきちんと入れる話

制作

今日はコーディングのalt設定について話していきたい。コーディング専門にやっている方なら、画像のimgタグのaltを記述するのは当たり前だと思うが、僕のようにディレクター、デザイナー、コーダーの3職を兼ねている方の場合、とにかく早く進めようとaltを無視して記載しない方もいるのではないか?

画像に記載されている文字を読み取ってaltタグに記述するのは特に面倒くさい。そもそもaltタグの記載の意味は、テキストで画像の内容を補完してくれたり、音声読み上げ機能を使用した際の読み上げテキストとして役立ったりします。視覚障害を持った方や高齢者の方、また通信環境の良し悪しに関わらず利用の際の手助けになります。alt属性を適切に記述していると、検索エンジンだけでなくユーザーにとっても「利用しやすいコンテンツ」になるのです。altタグを記載する意味はWEBアクセシビリティに配慮することにもとづいています。

だけど、現実それだけしか意味がないようなら、飛ばしてもいいかなと自分は思っていた。現に今も面倒くさい時には記述しないときがある。または後回しにする。

しかし、altタグはWEBアクセシビリティ以外にも、書かなければいけない理由がある。

いまだにseo対策には有効なALTタグ

一つはSEO対策。だいぶ昔の話であるが、よく画像にキーワードを詰め込むと検索で上位にするというような噂があった。もちろん今現在ではない。今現在はそんなことをやればスパム扱いになるから逆に検索順位が下がる。しかし、何も記載しないとやはりこれもまた、ページとして評価が低くなる。Googleが推奨するのは、画像に記載されていることを簡潔に記載することらしいが。確かに、しっかりと正確にaltを記載したページは検索順位がいくらか上がったケースがある。

そのほかに、画像検索の際実はこのALTタグが役に立つ。通常の検索以外に最近では画像の検索も多いので、やはりaltタグは入れておいたほうがSEOには効果的です。

制作者にとってはALTタグは制作を早くするために記述すべき

制作者にとっては、実はSEO以外に大きな利点がある。僕は元々ALTタグをそんなに入れる方ではなかったが、制作の効率の利便性を考え、ALTタグを入れるようにしている。

まず、ALTタグを入れた方が、コーディングの様々な修正などがしやすい。

ALTタグを入れなかった場合、修正箇所をソースコードから探すのが難しい。ALTタグを入れておけば、ここはその画像の配置かとある程度位置が把握できるので、修正などもしやすい。また、誤った修正などをしないで済む。

僕は急ぎの案件の場合、ALTを入れずにコーディングしていたが、そんな時は逆にミスが連発していた。ALTを入れないので、修正の位置の把握ができず、逆に、修正が遅くなってしまった。お客様の指示通りでない、誤った修正をしてしまったこともある。

特に、画像がたくさんあるサイトほど、アクセシビリティの理由からでなく、制作を効率的に進める理由で、ALTタグは記載すべきだ。急がば回れというが、急がばALTタグを記載しろということだ。最終的にきちんとALTタグを入れた方が、制作スピードが早くなる。

もう一つ、ALTタグを入れておけば、画像のリンク切れが画像切れマークで表示されるので一発でわかる。しかし、ALTを入れない場合、ブラウザ(特にクロームなど)でマークが表示されない。マージンやパディングだと勘違いされ、そのままになってしまい、後で問題となることも多い。

結構、自分も画像のリンク切れに気づかずトラブルになったことがあった。

画像名が英文字で記載されている場合、特に多くの画像が配置されているページでは、どの画像がどの部分に対応しているのか一目で判断するのが難しいことがあります。ここでも、ALTタグの存在が大きな助けとなります。ALTタグには、画像の内容や機能を簡潔に表すテキストが含まれているため、コードを追いながらページの構造を理解しやすくなります。

最後に

総じて、ALTタグの記載は、SEO対策だけでなく、制作の効率性、ウェブサイトの品質維持、ユーザーエクスペリエンスの向上、プロフェッショナリズムの向上など、多方面にわたる利点があります。急ぎの案件であっても、時間をかけてALTタグを適切に設定することで、長期的に見て多くのメリットが得られることを理解しましょう。

タイトルとURLをコピーしました