Typography is a vital component of user interface design. It establishes a strong visual hierarchy, provide a graphic balance to the website, and set the product’s overall tone. Typography must guide and inform the users, optimize readability and accessibility, and ensure an excellent user experience.
Typography is a strong extension of the NYS standards, and plays a major role in creating a distinctive and consistent look across all NYS websites and applications.
To enable an engaging user experience and to prioritize OMH's applications' readability and accessibility, we designed typography by several typography elements.
A typeface is a design style which comprises a myriad of characters of varying sizes and weight, whereas a font is a graphical representation of text character. Put simply, a typeface is a family of related fonts, while fonts refer to the weights, widths, and styles that constitute a typeface.
Contrast creates huge difference on the interface, emphasizes the text to users to make it interesting, meaningful, and attention-grabbing. Contrast depends on typefaces, colors, styles, and sizes that create impact and break up the page.
Contrast creates huge difference on the interface, emphasizes the text to users to make it interesting, meaningful, and attention-grabbing. Contrast depends on typefaces, colors, styles, and sizes that create impact and break up the page.
White space is the space around text or graphics. It’s often overlooked and tends to go unnoticed by the user, but proper use of white space ensures the interface is uncluttered and the text is readable. White space can even draw attention to the text and provides an overall aesthetically pleasing experience. White space often takes the form of margins, padding, or just areas with no text or graphics.
Alignment is the process of unifying and composing text, graphics, and images to ensure there is equal space, size, and distances between each element.
Color is one of the most exciting elements of typography. Using perfect color and contrast on the typography, a interface can be made outstanding for visibility and accessibilities.
Color has three key components: value, hue, and saturation. A good interface needs to have the balance of these three components to make the text both eye-catching and clearly legible, even for those with visual impairments.
Establishing hierarchy is one of the most vital principles of typography. Typographical hierarchy aims to create a clear distinction between prominent pieces of copy that should be noticed and read first, and standard text copy.
Typographical hierarchy or type scale is created by font size such as Primary Heading>Secondary Heading>Tertiary Heading>Body Text
Hierarchy can be created using sizing, color, contrast, and alignment.