上海时时乐介绍: Tips for Getting Started
Designing for Web Accessibility

Provide sufficient contrast between foreground and background

Foreground text needs to have sufficient contrast with background colors. This includes text on images, background gradients, buttons, and other elements. This does not apply for logos, or incidental text, such as text that happens to be in a photograph. The links below provide more information on the minimum contrast ratio as required by the WCAG and how to check contrast. “Contrast ratio” is a short version of the more technically correct term “luminance contrast ratio”.

Don’t use color alone to convey information

While color can be useful to convey information, color should not be the only way information is conveyed. When using color to differentiate elements, also provide additional identification that does not rely on color perception. For example, use an asterisk in addition to color to indicate required form fields, and use labels to distinguish areas on graphs.

Ensure that interactive elements are easy to identify

Provide distinct styles for interactive elements, such as links and buttons, to make them easy to identify. For example, change the appearance of links on mouse hover, keyboard focus, and touch-screen activation. Ensure that styles and naming for interactive elements are used consistently throughout the website.

Provide clear and consistent navigation options

Ensure that navigation across pages within a website has consistent naming, styling, and positioning. Provide more than one method of website navigation, such as a site search or a site map. Help users understand where they are in a website or page by providing orientation cues, such as breadcrumbs and clear headings.

Ensure that form elements include clearly associated labels

Ensure that all fields have a descriptive label adjacent to the field. For left-to-right languages, labels are usually positioned to the left or above the field, except for checkboxes and radio buttons where they are usually to the right. Avoid having too much space between labels and fields.

Provide easily identifiable feedback

Provide feedback for interactions, such as confirming form submission, alerting the user when something goes wrong, or notifying the user of changes on the page. Instructions should be easy to identify. Important feedback that requires user action should be presented in a prominent style.

Use whitespace and proximity to make relationships between content more apparent. Style headings to group content, reduce clutter, and make it easier to scan and understand.

Create designs for different viewport sizes

Consider how page information is presented in different sized viewports, such as mobile phones or zoomed browser windows. Position and presentation of main elements, such as header and navigation can be changed to make best use of the space. Ensure that text size and line width are set to maximize readability and legibility.

Include image and media alternatives in your design

Provide a place in your design for alternatives for images and media. For example, you might need:

Work with content authors and developers to provide alternatives for non-text content.

Provide controls for content that starts automatically

Provide visible controls to allow users to stop any animations or auto-playing sound. This applies to carousels, image sliders, background sound, and videos.

Back to Top
  • 四兄弟合伙创业 种植羊肚菌成功 2019-05-10
  • 最美季节走醉美线路——新疆伊犁大环线文章中国国家地理网 2019-05-07
  • 网络小贷牌照批设被紧急叫停 2019-05-01
  • “爸爸的苹果”,甜甜的爱(青春派) 2019-04-23
  • 全世界人民都要顺应人类社会发展规律,不断扩大社会财富公有制的范围,不断缩小社会财富私有制的范围,以便最终消灭社会财富私有制,建立共产主义社会财富公有制。 2019-04-06
  • 立秋日 滇池上空出现七彩云霞 2019-04-06
  • 抢不到门票和机票 如何假装在俄罗斯看世界杯? 2019-03-23
  • 新飞电器破产拍卖 网友:我家的冰箱坏了找谁修 2019-03-15
  • 网友举报货车扰民 交管部门用这个锁定"肇事车" 2019-03-15
  • 沈从文被包装成"情爱高手" 咱能不能别这么糟蹋经典! 2019-03-11
  • 高清:中国男篮抵达洛杉矶 长途飞行队员略显疲惫 2019-02-26
  • 小长假 新疆接待游客353.6万人次 2019-02-26
  • 【10-15万】最新汽车报价 2019-02-01
  • 户县民间艺人打造“微杆秤” 小小杆秤留住记忆 2019-02-01
  • 【访民情 惠民生 聚民心】果勒买里村丰收忙 2019-01-27
  • 576| 821| 716| 604| 835| 661| 852| 384| 422| 221| 900| 586| 61| 132| 404|