オンラインストア、銀行の申し込み、ホテルの予約、フリーランスの仕事など、ますます増えています インターネットを介して処理されるタスク 場合によっては、従来のメディアに取って代わりました。
この デジタル運用の急速な成長により、私たちは簡単になりました 多くの面で 人生 トランザクションが高速で、物理的な施設に行く必要がないため、時間を節約できます。もちろん、 以前は存在しなかった新しいメディアが作成されました そして今では、ソーシャルネットワーク、Netflixのようなプラットフォームでのストリーミング映画やシリーズ、Paypalのようなオンライン決済システムなど、ほとんどの人が使用しています。
このデジタル世界の台頭に伴い、それは不可欠です アクセス可能で適切に設計されたインターフェースの開発に投資する ユーザー向け。 しかし、それを忘れることはできません 障害に苦しむユーザーがいます コンピューターや携帯電話を使用する経験と能力を大幅に制限する身体的または心理的
車椅子を使用する人など、インターネットの使用を妨げない障害もありますが、視力や失明、運動協調性の問題、難聴、自閉症などの障害もあります。 それらは、Webをナビゲートする能力を深刻に妨げる可能性があります。 これらの場合、いくつかはすでに作成されています dispositivos スクリーンリーダーのように、 ユーザーを支援およびサポートする人 彼らが障害を持っている地域で。
しかし、これは問題解決の最初の部分にすぎません。 これらのユーザーのことを考えると、 Webページのインターフェイスを設計する それはあなたの経験を促進し、 あなたのニーズに合っています。 設計時に適用できるいくつかの原則があります。
コンテンツとソース
最も基本的なものから始めて、あなたはしなければなりません コンテンツデザインの優先順位を設定します。 ヘッダーとメニューバーは視覚的に簡単に見つけられる必要があり、ユーザーが最初に目にするものでなければなりません。 ホームページの要素、画像、および関連情報は、XNUMX番目に検索されます。
広告や広告バナーは多くのページに表示されます。 それ自体がすべてのユーザーにとって煩わしい場合、視覚障害のあるユーザーにとっては、多くの混乱を引き起こし、Webダイアグラムの読み取りを妨げるため、問題になります。 そのため、作成することが不可欠です。 一般的な編集デザイン あるページの 論理的に整理された わかりやすく、要素のサイズが適切であるため、他に気が散る場合でも、ユーザーは重要なコンテンツに集中できます。
使用するフォント できれば彼らは 大きくて読みやすい。 タイプ サンセリフと太字 それらは失読症に苦しむかもしれない人々のためにはるかに読みやすくします。 その他の推奨フォントは、Arial、Times New Roman、Helvetica、Tahoma、Calibri、およびVerdanaです。
そしてもちろん、あなたは常に間に明確な違いがあることに注意する必要があります テキストと背景。 同様の色を使用せず、むしろ選択してください 対照的な色。
Sans Serif Boldフォントを使用すると、テキストをより適切に視覚化できます。
代替テキスト
El 代替テキストまたは代替タグは、画像に配置される説明です Webページで。 このテキストはユーザーが読むことはできませんが、 よく書かれた説明 は、より良いSEOポジショニングを実現するのに役立つツールです。
しかし、Altタグの有用性はそれだけではありません。 それらのための スクリーンリーダーを使用しているユーザー 視覚障害の場合、画像の説明は次のとおりです。 彼らが外観が何であるかを知る必要がある唯一の参照 ページに公開されているものの。 たとえば、多肉植物の写真を配置する場合は、 良い代替テキストは次のようになります。 ピンクの鉢のXNUMXつの多肉植物。 次のような非常に短いテキスト： 鉢植え、 関連する詳細を提供する説明ではないため、機能しません。
ピンクの鉢のXNUMXつの多肉植物。 代替テキストの例。
適応性
設計時には、すべてを考慮に入れる必要があります 私たちのインターフェースが表示されるプレゼンテーション、どちらかで Webまたはモバイルバージョン。 視聴するメディアによって、体験は常に異なります。
私たちがモバイルを使うとき、 さまざまな環境にさらされる可能性があります 読むのが難しくなる コンテンツの 画面の。 たとえば屋外にいる場合、太陽の明るさによって画面が非常に暗く見え、ノイズによって音声がよく聞こえなくなります。 そのため、モバイル版は大きな文字と暗い色を持ち、ビデオが聞き取りにくい場合に備えて字幕を付けるように、これらの詳細をよく考えることが重要です。
携帯電話とコンピューターの両方で読み取れるように、インターフェイスのデザインを調整します。
設計の一貫性
エディトリアルデザイン 私たちのウェブサイトで何をするか セクションに関係なく同じである必要があります あなたがいる場所。 [ホーム]セクションには、[連絡先]セクションと同じメニューバーアイコンが表示されます。 スタイルを変えてはいけません また、Webのキーボタンの場所もありません。
また、自動的に再生されるビデオを配置することも不便です ページを開くとき。 スクリーンリーダーを使用しているユーザーにとって、一時停止する方法を知ることは困難です。
スターバックスページのメニューバーは、すべてのセクションで同じです。
キーボードナビゲーション
最後に、運動協調性の問題を抱えている一部のユーザーは、コンピューターのマウスをつかんだり、ラップトップのタッチパッドを使用したりするのが難しく、キーボードだけに頼っています。 必ず あなたのウェブサイトがある方法で設計されていること それは完全にできます キーボードボタンでのみ機能します。