Skip to content

Latest commit

 

History

History
44 lines (36 loc) · 1.32 KB

2018-Eric_Bailey-If_its_interactive_it_needs_a_focus_style.md

File metadata and controls

44 lines (36 loc) · 1.32 KB

If it’s interactive, it needs a focus style

Speaker: Eric Bailey
Twitter: @ericwbailey

Links style

  • focus, active, visited, hover

CSS rules

  • form: focus-within
  • Highlight tables that are highlighted.
  • a:focus-visible (pseudoclass) Verify in caniuse.com

The web is more than mouse and keyboard!

  • Browser sniffing still happens.

Resources:

The following notes were taken by: Quimana Boots

  • Is it beautiful? Is it useful?
  • The web is NOT print and should not be treated as such
  • Focus styles
    • affordances
    • give multiple affordances
    • Use CSS to overwrite default hover states
    • All states should be distinct
  • Identify and activate
    • Don’t shift the layout
    • CHECK HIGH CONTRAST MODE
  • New ways to focus
    • Focus-within and focus-visible
    • Focus-visible
  • Activate, don’t identify
  • Concerns
    • repeating mistakes of browser sniffing
    • sharing PII without knowing how it will be used
    • Bad design decisions made in good faith
    • Being forced into an AT-onlly companion experience
  • Embrace the Unknown
    • Good UX meets user where they are
  • https://noti.st/ericwbailey