...

As with Date and Time above, all applications built for Verint should allow the decimal character defaults to be automatically changed based on the users specified browser locale (or manual setting if an application allows it). Details of country and region specific conventions are available here.

Headers

Content Headers

Headers may be oriented to give the importance of a section and it’s body copy using the following matrix:

<style>
	@import url('https://rsms.me/inter/inter.css');
	html { font-family: 'Inter' !important; }
</style>
<h1 style="font-family: 'Inter', arial;">Huge Header</h1>

<style>
	@import url('https://rsms.me/inter/inter.css');
	html { font-family: 'Inter' !important; }
</style>
<span style="font-family: 'Inter', arial; font-size: 11px;">Powering actionable intelligence</span>

<style>
	@import url('https://rsms.me/inter/inter.css');
	html { font-family: 'Inter' !important; }
</style>
<span style="font-family: 'Inter', arial; font-size: 12px;">Powering actionable intelligence</span>

<style>
	@import url('https://rsms.me/inter/inter.css');
	html { font-family: 'Inter' !important; }
</style>
<span style="font-family: 'Inter', arial; font-size: 18px;">Powering actionable intelligence</span>

Accessibility

A few key factors to follow for an accessible headers:

• Provide enough color contrast between text and its background, check out the minimum recommended WCAG 2.0 color contrast ratio (4.5:1).

• Use relative em units to accommodate for user browser preferences.

• Don't skip HTML heading hierarchy levels in order to comply with screen reader guidelines.

Labels

Effective form labelling helps users understand what information to enter into a form Input. Using a placeholder text as a label is often applied as a space-saving method. However, this is not recommended because it hides context and presents accessibility issues.

...

• Provide a star (asterisk) symbol position in superscript.

• Use the Verint warning color with the star symbol to identify it’s necessity.

...

Accessibility

A few key factors to follow for an accessible labels:

• Use the appropriate HTML <label> element and label for attribute.

• Labels must remain visible when an input gets focus.

• Labels must be announced to the screen reader on focus.

• Ensure the helper text that appears under an input is read when an assistive technology user stops at an input using ARIA.

• Use sentence case capitalization (see Capitalization section below).
  

...