'

Making Forms Accessible to All Users

Понравилась презентация – покажи это...





Слайд 0

RYAN SCHROEDER ACCESSIBLE FORMS


Слайд 1

ACCESSIBLE FORMS BACKGROUND ▸ Overview ▸ Troubles with forms ▸ Why are forms important?


Слайд 2

ACCESSIBLE FORMS INTRO TO HTML FORMS ▸ <form> ▸ declares the form for the browser ‣ action ‣ method ▸ <input> ‣ tells the browser what to show


Слайд 3

ACCESSIBLE FORMS <INPUT> ▸ type=“ “ ▸ sets the type of input field ▸ name=“ “ ▸ name that gets submitted with the form ▸ value=“ “ ▸ optional (but encouraged) ▸ <p> tag?


Слайд 4

ACCESSIBLE FORMS


Слайд 5

ACCESSIBLE FORMS


Слайд 6

ACCESSIBLE FORMS


Слайд 7

ACCESSIBLE FORMS


Слайд 8

ACCESSIBLE FORMS GROUPING ▸ <fieldset> ▸ grouping of like objects ▸ <legend> ▸ the title for each different grouping


Слайд 9

ACCESSIBLE FORMS


Слайд 10

ACCESSIBLE FORMS


Слайд 11

ACCESSIBLE FORMS LABELS ▸ <label> or aria-labelledby ▸ for=“” ▸ added to the label tag ▸ id=“” ▸ added to the input tag ▸ “Label for=“ must match id=“”


Слайд 12

ACCESSIBLE FORMS


Слайд 13

ACCESSIBLE FORMS


Слайд 14

ACCESSIBLE FORMS REQUIRED ELEMENTS ▸ add “(required)” ▸ this is to be added in the label ▸ “required” ▸ to be added in the input tag ▸ aria-required=“true” ▸ to be added in the input tag


Слайд 15

ACCESSIBLE FORMS


Слайд 16

ACCESSIBLE FORMS


Слайд 17

ACCESSIBLE FORMS THANK YOU


Слайд 18


×

HTML:





Ссылка: