What Is a User Interface (UI)?

MDN defines the user interface as anything that facilitates the interaction between a user and a machine. In computing it can be a keyboard, a screen or a program; in software, a command-line prompt, a web page or a form. The abbreviation UI is used in most languages, including Spanish and German.

Nielsen Norman Group explains the difference from UX with an example. A movie review site can have a perfect interface for finding films and still give a poor experience to someone looking for a small independent release, if the database only holds films from the major studios. The interface is an important part of the experience, but the experience covers every contact with the company, its services and its products. Usability, according to NN/g, is a quality attribute of the interface: whether it is easy to learn, efficient and pleasant to use.

A web interface is made of elements the browser draws from the page's HTML and CSS: text, images, links, buttons, menus and form fields. Each element has an appearance and responds when someone clicks it, taps it or types into it.

For people to be able to use those elements, there are measurable requirements. W3C's WCAG 2.2 asks, at level AA, for a contrast ratio of at least 4.5:1 between normal text and its background, and 3:1 for large text. Targets that are clicked or tapped should be at least 24 by 24 CSS pixels, with exceptions such as a link inside a sentence or a small target with enough space around it.

Two of the Core Web Vitals measure how the interface behaves. INP measures how long the page takes to respond to interactions such as a click or a tap; according to web.dev, a good value is 200 milliseconds or less. CLS measures how much elements shift while the page loads; a good value is 0.1 or less.

The interface decides whether people can do what they came to do: read, find a link, fill in a form or buy. A button with too little contrast, or too small for a finger, becomes an obstacle even when the content and the offer are good.

For SEO it counts indirectly. Google lists the usability of content among the things it considers: when other signals are roughly equal, content that people find more accessible may perform better. As an example, it mentions mobile-friendly pages that load quickly.

We measured this for zds.es on 16 October 2026 on three glossary pages, with the browser 390 pixels wide. The main text, white on dark blue, has a contrast ratio of 17.5:1, and the "Request a review" button 4.91:1. Two elements were below 4.5:1: the grey secondary text, such as the breadcrumb and the review date, at 3.68:1, and the "Accept all" button in the cookie notice, at 3.75:1. After their colors were changed the same day, they are at 6.82:1 and 4.91:1, and all the visible text we measured meets the minimum.

• Measure the contrast of text and buttons with a tool, against WCAG's 4.5:1.
• Make buttons and icons at least 24 by 24 CSS pixels, or leave enough space around them.
• Keep the same appearance for the same function across the whole site.
• Reserve space for images and ads so the page does not jump while loading.
• Test the interface on a phone, where it is used with a finger.

• Using UI and UX as synonyms.
• Setting grey text on dark or light backgrounds without measuring the contrast.
• Making buttons and icons too small, or too close together, on mobile.
• Letting elements shift while the page loads.
• Judging the interface only by how it looks, without checking whether it can be used.