...
Use the appropriate HTML <label> element and label for attribute.
Labels must remain visible when an input is focused.
Labels must be announced to the screen reader on focus.
Ensure the help text which appears underneath an input is read when an assistive technology user stops at an input using ARIA.
Use sentence case capitalization (see the Capitalization section below).
Capitalization
We use different capitalization styles for different types of content to improve scannability, organize information, and guide users to key actions.
When building new LUX applications, also align capitalization practices with platform conventions to match user expectations (e.g. specific iOS conventions).
Styles
Title Case (Most Words Are Capitalized)
Use title case for:
...
Element
...
Example
...
Navigation items, including top and side navigation, navigation pane
...
Popup and dialog header
...
Tab headings
...
Buttons
...
Statistics names
...
Do capitalize
The first letter of nouns, adjectives, verbs, adverbs, and pronouns
The first and last words of the text element
The second word of a hyphenated compound unless it is an article or preposition (for example: Quick-Search Options and Add-on Choices).
Don’t capitalize
...
LUX uses two capitalization styles:
Title case
All words in the text element are capitalized (for example: System Management), except for articles (“a,” “an,” “the”) or prepositions with fewer than five letters (“to,” “on,” “at,” “by,” “from”, for example: Forecasting and Scheduling).
The second word of a hyphenated compound is capitalized (for example: Quick-Search) unless they’re the first or last words of the text element.
Sentence Case (Most words are lowercase)
...
Use sentence case for for everything else, including:
titles,
labels of input fields, checkboxes, radio buttons, drop down list
column headers in a table,
image captions,
body copy,
secondary editorial headings
and so on…
...
, unless it is an article or preposition (for example: Add-on).
Use title case for:
page titles,
navigation items, including VerinTop and side navigation,
widget titles,
dialog and popup headers,
tab headings,
buttons.
Sentence case
All words in the text element are not capitalized, except for:
the first word of the text element,
...
| title | What's a proper noun? |
|---|
Proper nouns include:
...
names and titles of individuals
...
,
unique names of organizations,
...
products,
...
Product, service, app, and tool names.
...
Trademarks.
...
Titles of books, songs, and other published works.
...
Managed standards, such as Bluetooth.
...
services, technologies etc.,
published work titles.
Use sentence case for all elements that are not in title case, including:
form element labels, like input fields, checkboxes, radio buttons, drop-down lists etc.,
popup, popover and tooltip content,
column headers in a table,
secondary headings,
body copy,
and so on…
Examples
...