CSS Master

(Primo) #1
dizzinessornauseaforpeoplewithvestibulardisorders,suchasvertigo^22 .Flashing
animationscantriggerseizuresinsomepeoplewithphotosensitiveepilepsy^23 .Use
themsparingly,andstronglyconsidergivinguserstheabilitytoturnthemoff.

A Note About Performance


Somepropertiescreatebetter-performingtransitionsandanimationsthanothers.
Ifananimationupdatesapropertythattriggersarefloworrepaint,itsperformance
maybepooronlow-powereddevicessuchasphonesandtablets.

Propertiesthattriggerareflowareonesthataffectlayout.Theseincludethefollowing
animatableproperties:

■ border-width(andborder-*-widthproperties)
■ border(andborder-*properties)
■ bottom
■ font-size
■ font-weight
■ height
■ left
■ line-height
■ margin(andmargin-*properties)
■ min-height
■ min-width
■ max-height
■ max-width
■ padding(andpadding-*properties)
■ right
■ top
■ vertical-align
■ width

(^22) "InfiniteCanvas6:VestibularDisordersandAccessibleAnimation"
[https://www.youtube.com/watch?v=QhnIZh0xwk0]isagreatintroductiontothesubjectofvestibular
disordersandanimation.
(^23) WCAG2.0providesguidelines[http://www.w3.org/WAI/WCAG20/quickref/Overview.php#seizure
]foravoidingflashesandanimationsthatareknowntotriggerseizures.
220 CSS Master

Free download pdf