[frontendmasters.com] Website Accessibility [2017, ENG]

Ответить на тему
Статистика раздачи
Размер:  1,23 GB   |    Зарегистрирован:  6 дней   |    Скачан:  0 раз

Полного источника не было: Никогда

 
   
 
 
Автор Сообщение

star21 ®

Пол: Не указан

Стаж: 2 года 1 месяц

Сообщений: 354215

Создавать темы 07-Дек-2017 10:41

[Цитировать]

Website Accessibility Год выпуска: 2017
Производитель: frontendmasters.com
Сайт производителя: https://frontendmasters.com/courses/web-accessibility/
Автор: Jon Kuperman
Продолжительность: 4:04
Тип раздаваемого материала: Видеоклипы
Язык: Английский
Описание: Learn how to make your website applications accessible to a larger audience. Use keyboard shortcuts and navigation to help both power-users and those with disabilities. Make sure your website works well with screen readers and explore using ARIA to make even the most complex UI’s fully accessible! Slides (Google Slides) - https://docs.google.com/presentation/d/1_CRR-bJFX5Xt-2Tx_lPMDSMUtoxe8s8kAF7DDDXVvc8/edit?usp=sharing (included in torrent)
Code (Github) - https://github.com/jkup/learn-a11y

Содержание

Table of Contents
Web Accessibility Introduction
00:00:00 - 00:12:18
Introduction
Jon Kuperman introduces his web accessibility course, The Web is for Everyone. Demonstrating the importance of web accessibility, Jon covers why developers should care about creating a more open web and reviews the course agenda.Types of Disabilities Types of Disability
00:12:19 - 00:15:12
Types of Disability
While the web is a great benefit, it requires physical and mental effort. Jon reviews how different disabilities at various levels can affect ways in which people engage on the web.
How to browse the web
00:15:30 - 00:18:23
How to browse the web
Beyond the keyboard and mouse, Jon reviews a number of ways in which a web can be accessed.Keyboard Navigation Keyboard Shortcuts
00:18:24 - 00:20:47
Keyboard Shortcuts
Jon underscores the importance of making a site that can operate through only a keyboard by showing examples of common popular sites that can be used with simple one or two key strokes.
Tabbable Elements
00:20:48 - 00:27:35
Tabbable Elements
The basics of keyboard navigation depend on tabbable elements. Jon reviews which HTML elements are natively tabbable and how to manipulate elements to become tabbable through the tabindex attribute.
Visible Focus
00:27:36 - 00:30:35
Visible Focus
Jon reviews the importance of visible focus relating to tabbable elements.
Skip Links
00:30:36 - 00:34:44
Skip Links
Demonstration on how skip links help keyboard-only users to bypass tabbable content to help navigate a web site. - http://webaim.org/techniques/skipnav/
Exercise 1: Setting up an A11y Project
00:34:45 - 00:38:38
Exercise 1: Setting up an A11y Project
In this exercise, you will on converting a page to create an accessible form and add a skip link for improved keyboard navigation.
Exercise 1: Solution
00:38:39 - 00:51:22
Exercise 1: Solution
Jon reviews the exercise solution and answers questions on including proper color contrast, semantic HTML, and integrating tabindex.Focus Control Focus Control
00:51:23 - 00:52:46
Focus Control
Jon reviews document.activeElement, which references the element that is currently in focus within the browser. - https://github.com/jkup/focusable
Tabtrapping
00:52:47 - 00:54:58
Tabtrapping
To maintain a good user experience, Jon introduces the concept of tabtrapping. Tabtrapping occurs when you need to take control over a browser's native tab order and place it where in a region of the page where it makes more sense to the user such as a modal dialog.
Exercise 2: Focus Control
00:54:59 - 00:56:17
Exercise 2: Focus Control
In this exercise, you will work on restricting tabbable content to a modal. Then code two methods to close the modal when the user is done. - https://github.com/jkup/focusable/blob/master/index.js
Exercise 2: Solution
00:56:18 - 01:16:15
Exercise 2: Solution
Jon reviews the exercise solution and answers questions about maintain proper focus control while implemening a tabtrapping experience. - http://keycode.infoScreen Readers Screen Readers
01:16:16 - 01:13:27
Screen Readers
Jon reviews the number of screen readers available for users and the challenges in creating accessible sites with different readers. For this workshop, use the ChromeVox screen reader extension. - https://chrome.google.com/webstore/detail/chromevox/kgejglhpjiefppelpmljglcjbhoiplfn?hl=en
Alt Text
01:13:28 - 01:22:11
Alt Text
Jon reviews tips for writing quality Alternate Text, or Alt Text, which is an HTML attribute that is apart of the image element.
Label and ARIA Labels
01:22:12 - 01:30:02
Label and ARIA Labels
Jon reviews how to effectively use labels for HTML forms to let screen readers to describe form fields for users.
ARIA Roles
01:30:03 - 01:32:48
ARIA Roles
Jon introduces ARIA Roles, which help define areas of a document for a screen reader.
Exercise 3: Screen Reader
01:32:49 - 01:33:49
Exercise 3: Screen Reader
An exercise examines integrating proper HTML coding to let screen readers make a web page more accessible.
Exercise 3: Solution
01:33:50 - 01:47:27
Exercise 3: Solution
Jon reviews the coding solution for the screen reader exercise.Semantic HTML Semantic HTML
01:47:28 - 01:54:57
Semantic HTML
Jon emphasizes the importance of using the most appropriate HTML element for the content. In addition to reviewing the importance of contextual information that comes with using HTML headers, form elements, and more, he discusses semantic anti-patterns.
Exercise 4: Semantic HTML
01:54:58 - 01:55:46
Exercise 4: Semantic HTML
In this brief exercise, you will fix HTML elements with the proper HTML5 elements.
Exercise 4: Solution
01:55:47 - 02:01:45
Exercise 4: Solution
Jon reviews the solution for the exercise to add semantic HTML and ARIA Roles for greater accessibility.ARIA ARIA
02:01:46 - 02:05:31
ARIA
Jon looks at how ARIA and be used along with JavaScript to make an accessible web application.
Live Regions
02:05:32 - 02:11:32
Live Regions
Jon describes how to code Live Regions in order to tell the browser that an area of a browser will be updated frequalty.
Exercise 5: Live Regions
02:11:33 - 02:12:48
Exercise 5: Live Regions
In this exericse, Jon incoporates Live Regions for updating changes in a region of the
Exercise 5: Solution
02:12:49 - 02:23:23
Exercise 5: Solution
Jon reviews the coding solution for Live Regions exercise.Color Color
02:23:24 - 02:28:17
Color
Using the No Coffee Chrome Extension, Jon demonstrates that there are many accessibility issues for people when reading the web. - https://chrome.google.com/webstore/detail/nocoffee/jjeeggmbnhckmgdhmgdckeigabjfbddl?hl=en-US
Exercise 6: Colors
02:28:18 - 02:30:18
Exercise 6: Colors
In this exercise, you will use tools and resources to audit web sites to check their color schemes for accessibility. - https://accessibility.oit.ncsu.edu/tools/color-contrast/
Exercise 6: Solution
02:30:19 - 02:33:43
Exercise 6: Solution
Jon checks color schemes for legibility and accessibility.Tools Tools for Accessibility Testing
02:33:44 - 02:45:56
Tools for Accessibility Testing
Listing several extensions and web applications, Jon goes through tools that help in creating accessible web projects. - - https://chrome.google.com/webstore/detail/accessibility-developer-t/fpkknkljclfen...alefipecmb?hl=en - http://tenon.io - https://addons.mozilla.org/en-US/firefox/addon/accessibility-evaluation-toolb/ - http://wave.webaim.org/extension/ - https://khan.github.io/tota11y/ - https://addyosmani.com/a11y/ - https://github.com/reactjs/react-a11y
Action Items
02:45:57 - 02:47:00
Action Items
Jon covers three quick items web developers can to that will help gain an understanding of accessibility issues for their applications.Auditing Sites and Q&A Accessibility Auditing 1
02:47:01 - 03:13:44
Accessibility Auditing 1
Jon walks through several sites suggested by the audience for an accessibility audit including FrontendMasters.com, Kickserv.com, IBM.com, Healthcare.gov, and more.
Accessibility Q&A Round 1
03:13:45 - 03:22:36
Accessibility Q&A Round 1
Jon answers several questions from the audience on various topics: tools to automate accessibilty testing, tools that see into Angular components, intergrating accessibility into development workflow, accessibile menu navigations on content heavy sites, and more.
Accessibility Auditing 2
03:22:37 - 03:23:44
Accessibility Auditing 2
Jon reviews Starbucks.com
Accessibility Q&A Round 2
03:23:45 - 03:26:41
Accessibility Q&A Round 2
Jon answers qusetions about how to continue accessibility training and if there is a conflict between usability versus accessiblity within a web site.
Accessibility Auditing 3
03:26:42 - 03:35:25
Accessibility Auditing 3
Jon reviews Lifetime.com's site for accessibility.
Accessibility Q&A Round 3
03:35:26 - 03:43:03
Accessibility Q&A Round 3
Jon talks about finding people with disabitlies to test web sites, mobile web and accessibility, and web accessibility leaders, events, and resources
Accessibility Q&A Round 4
03:43:04 - 03:48:47
Accessibility Q&A Round 4
Jon talks about thoughts with product design and accessibility, color contrast ratios, and accessibility and internationalization.
Accessibility Q&A Round 5
03:48:48 - 03:59:13
Accessibility Q&A Round 5
Jon discusses how the color contrast accessibility tests are written for people with disabilities; distinction between AA and AAA compliances and legality; when to use ARIA Roles than HTML5 elements in browsers; and accessibility in emails.
Accessibility Q&A Round 6
03:59:14 - 04:05:30
Accessibility Q&A Round 6
Jon talks more about ARIA Roles support in browsers and screen readers; group testing tools for screen readers; and two-factor authentication and accessibilty.
Видео: H264, 1920x1080, 16:9, 23.98 fps, avg 800 kb/s
Аудио: AAC, 48kHz, 201kbps, stereo

Скриншоты

Для скачки контента: [Установить программу-клиент] и кликнуть по - Скачать

[asmlocator.ru].t460336.torrent 
Торрент: Зарегистрирован [ 2017-12-07 10:40 ] · 197028E253DFF79BF76A3142A2B6EF91A26857C4

Скачать .torrent

Скачать

16 KB

Статус: проверено
Скачан: 0 раз
Размер: 1,23 GB
terms.php
[Профиль] [ЛС]
Показать сообщения:    
Ответить на тему

Текущее время: 13-Дек 19:00

Часовой пояс: UTC ± 0



Вы не можете начинать темы
Вы не можете отвечать на сообщения
Вы не можете редактировать свои сообщения
Вы не можете удалять свои сообщения
Вы не можете голосовать в опросах
Вы не можете прикреплять файлы к сообщениям
Вы можете скачивать файлы