👀 わずか2分であなたのALTテキストの重要性を示すために2プラグインを使用する💡

この記事では、Chrome用の拡張子のカップルを紹介します.その1つは、あなたが構築したサイト/Webアプリをテストする際の大規模な助けになります!それから、私はそれらの拡張子を使用して、ALT属性が大きい問題をあなたに示すでしょう!(それらの不足の最大の問題は!)

クイックイントロ

( click here to skip this bit if you know what alt text is )
ALTテキストに200000記事があります.私は彼らを繰り返す必要はありませんか?
OK -簡単な概要を示します.
Altテキストを使用すると、HTML内のイメージを記述できます.
これは、補助的な技術を使用する人々がイメージが含んでいるものを知っているようになることを意味するので、同じ(または類似した)経験を得ます.
また、誰かがイメージを無効にしたり、画像をロードするに失敗する場合も、イメージが含まれて知ることができます.

HTMLでaltテキストを追加する

ここではどのようにイメージにaltテキストを追加する方法です

<img src="image-source.jpg" alt="A description of the image in the context of the document">

そのビットalt 属性、それはaltテキストです.
良いALTのテキストを書くには、すべての場合は、携帯電話の上に友人に記事を読んでいた想像しているときにイメージを得るだけで十分な詳細は、彼らはイメージについては、記事に関連するイメージ内の任意の情報を得るだろうとそれを記述します.
良いALTのテキストにいくつかの他のヒントがあります私は将来のポストについて書きますが、それはメインのものです!
この記事のポイントに、なぜ!

ここで何をしていますか。

があるestimated to be over 4.4 million Americans who use a screen reader ...世界中の外挿し、画面リーダーを使用して約100万人を持っている!
Altテキストなしでは、スクリーンリーダーは人々にイメージが何であるかについて話すことができません!
それはあなただけではなく、あなたのメッセージに到達していないされていない100万人です!
私は、ALTテキストのあなたの欠如があなたにそれを当てにする誰かのために感じていることを示すつもりです、うまくいけば、それは家にALTテキストの必要をドライブします!
この記事は完璧なALTテキストの書き方を教えてくれません.これは、なぜあなたとあなたのアクションを持っている影響を気にする必要が表示されます!
必要なツール:コンピュータとGoogle Chrome(またはChrome Extensionsで動作するブラウザ)を必要とするので、あなたがモバイルでいるならば、あなたはこの記事をブックマークして、それを試みるために家に着くまで待つかもしれません.

どれくらい、これは取ることになっています、そして、なぜ、私は悩まさなければなりませんか？

正直なところ、ちょうどあなたの時間の2 - 3分を与え、あなたはすぐにALTのテキストの欠如は、マイナーな問題ではないことを理解する、それは人々の多くに大きな影響を与えている!
追加ボーナスとして我々が使用している最初の拡張子は、それだけでこの記事を読む価値がある開発者としてあなたのために非常に多くの便利なツールを持っています!
これは、“ツール”セクションの下のリンクを使用してコードの品質をチェックするのに最適です!
第2の拡張子はこのデモのためにより多くです、しかし、ALT属性についてあなたに思い出させるために社会的メディアのためにまだ役に立つ!

ツール1 -ウェブ開発者

Web Developer for Google Chrome Webページをテストするためのユーティリティの負荷を提供します.
それは素晴らしいです!今日、あなたのツールキットに加えてください.

ツール2 -社会的な視覚のaltテキスト

Social Visual Alt Text 画像のALT説明を受け取り、ページ上で視覚的に表示します.
これはTwitter、Instagram、Facebookやつぶやきデッキのためにこれを行います.
クロムにそれを加えてください.
最初のプラグインでは、Altテキストを表示することができますが、それは適切にTwitterで(私たちは、この2番目のプラグインを必要とする理由です)動作しません.Twitterは私たちがそこではるかに明白であるので、問題を示すつもりです!

Twitterのテスト！

閉じるこの動画はお気に入りから削除されています.
グレート、今すぐにこのページを離れる前に1つの小さなタスクがあります.
あなたのエクステンションツールバー(淡グレー色、丸)のCOGアイコンを探します.

それをクリックし、上部にある“画像”タブを選択します.

今すぐリスト内の最初の項目を無効にするすべての画像を選択します.
これで緑色のダニが“無効にするすべての画像”の横に表示されるはずです.

また、緑色の通知が下に表示される画像を知っているように表示される必要があります(矢印で示す)無効になっています.
あなたはすべて設定されている!私があなたにして欲しいすべては、ためして、2分の間Twitterを使用して、それを理解することです!
上に行く、頭の上、わずか1分または2つ!

閉じるこの動画はお気に入りから削除されています。

(20分後には?)
重要なリマインダー:Web開発者プラグイン(COG)に戻って、もう一度イメージを許可することを忘れないでください!
それで、あなたがTwitterで若干の時間を浪費した今、それはどんなものですか?
あなたが存在しなかったイメージとして共有されたコード例のロードを見ましたか?人々は文脈なしで絵を共有しました、そして、あなたは彼らが何に関してあるか全くわからないですか?
こんな感じですか?

それはひどい経験ですか？

yup、それはあなたが多くの人々のためにALTテキストを加えないことを引き起こしている問題です.
うまくいけば、あなたもいくつかの良いALTの説明に遭遇!
私はあなたがコンテキスト内の画像の詳細な説明を参照してくださいと同じ情報と経験を楽しむことができます願っています!
それは私があなたが見て欲しかったすべてです、私はそれが重要である理由をあなたに示したことを望みます!
これは、我々が大きな影響で本当に簡単に何かをすることができる平等への障壁です!

ソーシャルビジュアルALTテキストプラグインを残す

私はあなたが方法で取得しないようにリマインダーとして社会的なメディアのプラグインを残して奨励し、すぐにそれに慣れる.(私たちは忘れています.
実際には、時々役に立つようになります誰かが建物がどこにあるかを説明するいくつかのALTテキストを追加し、何かアートの何かはそうでなければ私は知らない!
そして、誰が知っている、社会的な視覚的なaltのテキストプラグインを(優しく)あなたのお気に入りの覗き見のいくつかをTwitterであなたのお気に入りの覗き見のいくつかをあなたのコンテンツに赤バーを見続けるときに自分のイメージにaltの説明を追加することをお勧めします!

それはラップです！

それはすべてです!
私はあなたが良いか悪い経験をTwitterのイメージなしで使用していたかどうか知っている😋) コメントで!
私には、この主題のまわりに並んでいる2つのフォローアップ柱があります.
良いALT記述を加える方法の1つ.
二つ目は、dev、twitterなどのサイトがALTの記述をより自然に、緩やかに基づいて追加できるようにする方法です.
WYSIWYGは少しのAlt記述プロセスが概念(私は関連部分にまっすぐにリンクしました)として含まれます!
あなたがそれらを書く場合はあなたの記事を使用することができます.
P . S .誰かが知っている場合は、ALTのテキストを追加することができますイメージをカバーする前に、フロントまたは何か?それは私がそれを行うことができないことを私に迷惑!私はそれについての前兆の倉庫でgithub問題を見ているのを覚えているようです、しかし、私は現在それを見つけることができません.