Type at least 3 letters to search

GlossaryUX/UI and web design

UX/UI and web design terms, plainly defined

How websites and digital products are researched, structured, designed, tested and made accessible, from user research and wireframes to design systems and multilingual layouts. Each definition links to the service or article where we cover the subject in depth.

Research and UX strategy

How a team finds out what a product must do before anyone draws a screen.

Product design

Product design is the discipline of defining and designing a digital product as a whole: business goals, user needs, workflows, information architecture, data and technical limits, as well as the screens. User experience and user interface (UX/UI) design is one visible part of it. The result is a validated concept, a clickable prototype and a design system that a development team can build from without guessing.

More: Product Design

UI/UX design

UI/UX design is the work of deciding how a digital product behaves for its users (UX, user experience) and how its screens look and respond (UI, user interface). UX settles who the users are and what each of them must get done; UI turns that into screens and components developers can build, with clear hierarchy, navigation, states and accessibility. Our UI/UX design starts from $10,000 for products with accounts, roles and flows: a focused app is usually 15 to 30 screens, a multi-role product 80 or more, and prototypes are tested before development.

More: UI/UX Design

User research

User research is the study of how real people do the work a product is meant to support, through interviews, observation, analytics, support tickets and the spreadsheets where the exceptions live. Good questions ask about the past (“show us what you did with your last order”) rather than about wishes, and in B2B the buyer and the user are often different people. Boehm and Basili estimated that 40 to 50% of software project effort goes into avoidable rework, much of which research, prototyping and testing would catch early.

More: UI/UX Design

Customer journey map (CJM)

A customer journey map (CJM) is a diagram of the steps and decisions a person goes through on the way from first contact to an inquiry or a purchase, across channels and over time. Built from data rather than assumptions, it shows that people rarely move in a straight line: they notice a post, search for the company days later and come back weeks after that. There is no universal best journey: a luxury store may deliberately slow the customer down, while an electronics store removes every obstacle. In luxury, customers often return three or four times before making contact.

More: Why Luxury E-commerce Breaks Every Rule of Conversion Optimization

Jobs to Be Done (JTBD)

Jobs to Be Done (JTBD) is a product design method that looks at the progress a customer is trying to make, the job they hire a product or service to do, rather than at their demographics or the features they ask for. It moves a brief from what a page should contain to what the person needs to get done. Together with Double Diamond, object-oriented UX and Atomic Design, it is one of the established methods behind our approach to e-commerce design.

More: How We Design E-Commerce: From Objects to Experience

Double Diamond

The Double Diamond is a design process framework of four phases: discover and define the right problem, then develop and deliver the right solution, widening the search and narrowing it down twice. It guards against the most expensive mistake in design, a polished answer to the wrong question. Like JTBD, OOUX and Atomic Design, it formalizes starting from what the business needs its digital experience to do.

More: How We Design E-Commerce: From Objects to Experience

Object-oriented UX (OOUX)

Object-oriented UX (OOUX) is a design method that starts from the real objects of a system, such as products, collections, materials, experts, locations and services, and their relationships, rather than from screens. Each object is first defined with its properties and connections, and only then is it decided how it appears on a page. Every object becomes a candidate for a page, a filter or a link, and the same object can reappear in a collection, a story, a comparison or a recommendation.

More: How We Design E-Commerce: From Objects to Experience

Atomic Design

Atomic Design is Brad Frost's method of building an interface as a hierarchy of parts: atoms such as buttons and labels, then molecules, organisms, templates and pages. It makes components reusable and keeps a growing interface consistent. We apply it the other way round: start with the organism, meaning the real business and its customer journeys, and only then break it into components, so that the parts serve the whole rather than a UI kit.

More: How We Design E-Commerce: From Objects to Experience

Competitor UX review

A competitor UX review is a structured study of how competing sites and apps solve the same tasks: navigation, filters, product pages, forms and checkout. Each interaction found is treated as a hypothesis to test, adapt or reject, never as something to copy, and a competitor's latest launch is not a starting point. For one pearl store we reviewed 13 jewellery sites and built a matrix of 24 ways into a catalogue; one of them, filtering by size in millimetres, was missing from all five specialist competitors.

More: The Website Design Process Most Agencies Show You Is Wrong

Product thinking

Product thinking is the habit of connecting every design decision to the business result it should change: from a symptom such as customers abandoning a process, through workflow, information architecture and backend logic, to a specific KPI. The user sees one click, but behind it may sit customer, order, payment, inventory, CRM and accounting systems, so the user flow and the business flow are designed together. Usability is not usefulness: perfect UX will not save a product whose problem is not important enough.

More: Product Design vs UX/UI: Where Does a Digital Product Actually Begin?

Design hypothesis

A design hypothesis is a design decision stated as an assumption that real behaviour will confirm or reject: if this changes, that measurable result should follow. Before launch every design is a hypothesis; after launch analytics, click maps and abandonment rates test it, so the team defends the hypothesis rather than the mockup. Each hypothesis gets its own analytics event and a review date six to eight weeks after launch. Making one store louder and more familiar lifted its conversion by 17%.

More: Website Design

Structure, flows and prototypes

The plans, paths and prototypes that decide how a site or app works before it gets its look.

Information architecture

Information architecture is the structure of a website or an app: which pages and sections exist, how they are grouped and named, how navigation and internal links connect them, and where each type of content lives. It is designed before the visual design, usually as a sitemap and wireframes. Good information architecture helps visitors find what they need and helps search engines and AI systems understand the site.

More: Website Design

Page map (site map)

A page map, or site map, is the list of all pages and templates of a website with their hierarchy and URL rules, agreed together with the wireframes before any colour appears. It fixes the scope of design and development. The number of templates, not pages, drives the price: fifty articles share one template, while the home page, catalogue, product card and checkout are four separate design problems.

More: Website Design

User flow

A user flow is the step-by-step path a user takes to complete one task in a product, from the starting point to the result, including what happens when a step fails. Flows are drawn for every key task together with the role table and the information architecture, and approved before visual design. Fixing a UX problem at this stage takes hours; after development it takes weeks.

More: UI/UX Design

Wireframe

A wireframe is a simplified layout of a page or screen that shows its structure, content blocks and their order without colours, fonts or images. It keeps the discussion on tasks and content rather than taste, and stops pages from looking more finished than the decisions behind them. Our first wireframes are deliberately plain, grey shapes with real labels, and every template is wireframed and approved before visual design. AI tools can now turn approved wireframes into working interfaces within hours.

More: The Website Design Process Most Agencies Show You Is Wrong

Clickable prototype

A clickable prototype is an interactive model of a product's key screens, usually built in Figma, that lets people tap through the main flows before any code is written. Testing it with real users is cheap: a change in a prototype costs a few screens, while after the build it means rework in code and in the database. A polished prototype can still hide open questions about data sources, ownership, failures and scale. A discovery phase, two to four weeks and from $4,000 with us, ends with one.

More: The Website Design Process Most Agencies Show You Is Wrong

Mockup

A mockup is a static, full-colour image of a screen that shows how it will look but not how it behaves. It helps agree on the visual direction once structure and flows are settled. Drawn before those decisions, a mockup is a promise the build may not keep, which is why it follows wireframes rather than replacing them. Sometimes the real thing persuades better: one pitch was won with an animated home page, with motion, video and music, instead of a static mockup.

More: The Website Design Process Most Agencies Show You Is Wrong

UI states (empty, loading, error)

UI states are the conditions a screen can be in besides the ideal one: empty, loading, error, closed to the user's role, or crowded with thousands of records. Each state, along with the wording of its messages, should be designed in advance so that developers do not have to invent it on the last day. Screens such as an empty search result, a sold-out product, a country without delivery or a form error belong in the specification and show whether a team has thought past the happy path.

More: Product Design vs UX/UI: Where Does a Digital Product Actually Begin?

Happy path

The happy path is the scenario in which everything goes right: the user enters valid data, the network works and every connected system answers. Demos show only the happy path, but real users leave fields empty, double-click, lose connection, open the site in another browser or come back six months later. Edge cases such as missing data, a failed payment, an unavailable CRM or a slow network are part of the product and need to be designed and tested, not left to chance.

More: The Website Design Process Most Agencies Show You Is Wrong

Design specification

A design specification is the document that describes every page template and block of a product: its content, behaviour, states, the data it needs and the reason behind each decision. It turns a design into something a team can build and check the result against. Each template gets a short passport: why the page exists, where people come from, what they should do, where they go next and how it is measured. For one luxury store ours ran to 108 pages covering 13 templates and 61 blocks.

More: The Website Design Process Most Agencies Show You Is Wrong

Design handoff

Design handoff is the transfer of a finished design to developers in a form they can build from: the Figma file with annotated components, spacing specifications, exported assets, the prototype, user flows and the list of states. When a client's own team builds the product, the handoff is the deliverable itself, so it includes the page map and wireframes of every template with its purpose. It is not a relay race: implementation changes things, so the designer stays in the conversation and catches differences between design and build early.

More: UI/UX Design

Figma

Figma is a browser-based design tool in which interfaces, prototypes and design systems are created and shared, with designers, developers and clients working in the same file. It is the standard tool for website and product design and for design handoff. Our prototypes, design systems and handoff files live there, usually with two to three rounds of revisions per page. Opened too early, though, Figma starts dictating reality and produces a beautiful system that answers a question nobody asked.

More: Website Design

Content-first design

Content-first design is an approach in which real texts, photos and data are gathered or drafted before the visual design, so that the layout is built around what the business actually has to say. Without real content a design can only be tested on placeholders. Template sites and sites generated from a prompt look alike precisely because the design came first and the content was poured in afterwards. Structure decides whether a business deserves attention; design decides whether people give it.

More: Website Design

Visual design and UI

The visual layer: systems, type, colour, space and the first impression they make.

Design system

A design system is the shared set of rules and reusable parts behind a product's interface: colors, typography, spacing, components such as buttons and forms, and guidelines for using them, usually kept in Figma and matched in code. It keeps new screens consistent and speeds up both design and development. Without one, every new page looks slightly different from the last.

More: UI/UX Design

Design tokens

Design tokens are the named basic values of a design system, such as colours, font sizes, spacing and corner radii, defined once and used by both designers and code. Changing a token updates every component that relies on it, so colour scales, type and spacing carry the brand logic consistently across all variants. AI tools now work at this layer as well, keeping tokens consistent, documenting components and running visual regression tests.

More: UI/UX Design

Design system debt (design drift)

Design system debt, or design drift, is the gradual loss of visual consistency when an interface keeps changing in a hurry without a shared system: dozens of near-identical buttons, different indents, fonts and sizes. A site can look consistent at a glance and still have no real design system underneath. In one large online store, four years of rushed interface changes had eroded the original visual concept. Like technical debt, it grows quietly and is usually paid for during the next redesign.

More: The Hidden Technical Debt That Makes Website Redesigns More Expensive Than Planned

Visual hierarchy

Visual hierarchy is the arrangement of size, weight, colour, contrast and position that decides what a visitor notices first, second and last on a page. It tells people what matters most and what to do next without making them read everything. Consistency lowers the effort of reading, while colour creates emphasis so that one action clearly matters most. When everything is emphasized, nothing is.

More: What Good Web Design Actually Does Once the Structure Is Right

F-pattern and Z-pattern

The F-pattern and the Z-pattern are common paths of eye movement on a page: an F-shape on text-heavy pages, where people scan the top lines and the left edge, and a Z-shape on simpler layouts, from the top left across and then diagonally down. They help decide where headings, key messages and calls to action go. They are tendencies, not laws of behaviour: content, industry and the visitor's motivation all change how a page is actually read.

More: How Website Design Affects Perceived Brand Value

Typography

Typography is the choice and arrangement of typefaces: weight, size scale, spacing, line length and hierarchy. On the web it is one of the strongest signals of quality; system fonts and framework defaults read as an absence of intent even on a well-structured site. Luxury sites usually pair a serif for names and headings with a sans-serif for the interface. On a multilingual site the typography also has to work in every script, not only in Latin.

More: Why Some Websites Look Cheap Even When They Are Well Designed

Variable fonts

A variable font is a single font file that contains a continuous range of weights, widths or styles instead of a separate file for each. Its axes can shift smoothly with the screen size, the scroll position or the state of an element. The result is fewer files to load and more expressive typography without extra weight on the page.

More: 7 UX/UI Design Trends That Actually Matter in 2026

Whitespace (negative space)

Whitespace, or negative space, is the empty space between and around the elements of a page: margins, padding and the gaps between lines and blocks. It gives content room to be read and makes the important things stand out. Space exists because something was deliberately left out, so it reads as premium only when what remains is strong enough to deserve it; otherwise it simply looks empty.

More: Why Some Websites Look Cheap Even When They Are Well Designed

Minimalism in design

Minimalism in design is the removal of everything a page does not need, so that what remains is clear and easy to act on. It is not the absence of information but the absence of unnecessary information: first understand what is necessary, then remove the rest. Minimalism that hides what people came for, such as prices, sizes or delivery terms, lowers sales. Invisible design, which lets people focus on their task rather than on the interface, is a related but different idea.

More: Design You Don't Notice: Why the Best Design Disappears

Accent colour

An accent colour is the one bright or contrasting colour in a palette that is reserved for what needs attention: main buttons, links and key highlights. A web palette usually consists of a base, a dark, a light and one accent, plus functional colours for errors and confirmations. Used sparingly, the accent guides the eye; used everywhere, it stops meaning anything. On nine luxury sites we studied, five buy buttons were black or near-black, while the brand colour lived in small details and the photographs carried the colour.

More: The Same Car in Another Colour Is Another Car

Above the fold (first screen)

Above the fold is the part of a web page visible without scrolling, the first screen. Within it a visitor has to understand what the business does, who it is for and what to do next. A landing page without a clear call to action on the first screen makes visitors from ads hunt for it. Social proof, such as a rating and a customer count, works best beside the main promise, not three scrolls below it.

More: Website Redesign Seattle | We Build Sites That Generate Leads

Hero section

A hero section is the large first block of a page, usually a headline with an image or video and the main call to action. It sets the first impression and the story the rest of the page tells, so it has to match the business: a striking image can tell the wrong story, and a clinic should not put a long film before its booking link. Autoplay video hands the first impression to whichever frame happens to be playing, and one clear subject per screen is still among the strongest layouts in luxury.

More: Do You Need a Website Redesign? Start With a Usability Audit

Dark mode

Dark mode is a colour scheme with light text on a dark background, offered as an alternative to the standard light theme and often switched on automatically from the device setting. In B2B SaaS, fintech and creative tools it is now a design-first decision: both modes are designed from the start as part of the design system rather than produced later by inverting colours. Simply inverted themes tend to break contrast, shadows and images.

More: 7 UX/UI Design Trends That Actually Matter in 2026

Stock photography

Stock photography is ready-made imagery licensed from photo banks rather than shot for a specific business. Generic stock makes a well-structured site feel cheaper than a simpler one with specific, real photographs, because visitors recognize the images and learn nothing about the company. On one manufacturing site, the perception changed once the placeholders were replaced with photos of real work. In architecture and construction the rule is short: renders promise, photographs prove.

More: Why Some Websites Look Cheap Even When They Are Well Designed

Art direction

Art direction is the creative leadership that sets the visual language of a brand or project: the idea, mood, palette, composition, photography and motion, and how they serve the message. It keeps images, video and interface consistent when many people and tools produce them. With AI now generating images and video, art direction remains the human part of the work: a clear visual brief, a palette and an understanding of how motion serves the brand.

More: AI-Powered Web Design and AI Video Editing in 2025-2026

Moodboard

A moodboard is a collage of visual references, such as images, colours, textures and typefaces, used to agree on the mood and direction of a design before work begins. It is a useful conversation tool but not a strategy. A palette chosen from a moodboard or from a founder's favourite colour, without a look at the category, is a common mistake. Heritage branding should begin with a diagnosis of the brand, and a brand voice belongs in a written document rather than on a moodboard.

More: When a Brand Disappears, Is It Really Dead?

Aesthetic-usability effect (halo effect)

The aesthetic-usability effect is the tendency of people to perceive more attractive interfaces as easier to use, even when they work exactly the same. In 1995 Kurosu and Kashimura at Hitachi tested 26 ATM interface layouts that were identical in function and found the better-looking ones rated as more usable. Attractive design makes users forgive minor friction, but the same halo can hide a weak business behind good looks, which is why testing has to look past it.

More: How Website Design Affects Perceived Brand Value

First impression (50 milliseconds)

The first impression of a website is the judgement of its visual appeal that visitors form almost instantly, before reading anything. Lindgaard and colleagues at Carleton University showed in 2006 that people judge a web page's visual appeal in about 50 milliseconds, and those ratings correlated closely with judgements made after 500 milliseconds. That first glance colours how everything else on the site is read, credibility included.

More: How Website Design Affects Perceived Brand Value

Interaction, motion and AI interfaces

How interfaces respond, move and increasingly adapt themselves with AI.

Interaction design

Interaction design is the part of UX that defines how a product responds to people at every touchpoint: taps, swipes, hover, scrolling, typing and voice. It covers feedback, transitions, micro-interactions, haptic feedback and interface states, including states that adapt to behaviour in real time. Good interaction design makes cause and effect obvious, so users always know what has happened and what they can do next.

More: UX/UI Design in 2026: Why It Still Pays Off for Your Business

Micro-interactions and motion

Micro-interactions are small, single-purpose responses of an interface to a user's action, such as a button that reacts to a press or a field that confirms valid input, and motion is the animation that carries them. They confirm actions and guide attention, and they are planned at the strategy stage rather than added as a finishing touch. On nine luxury sites we measured, button transitions ran from 0 to 0.5 seconds: calm comes from a still layout and few words, not from slow motion.

More: 7 UX/UI Design Trends That Actually Matter in 2026

3D on websites (WebGL, three.js)

3D on websites is real-time three-dimensional graphics drawn in the browser, usually with WebGL and libraries such as three.js, for product views, interactive scenes or immersive first screens. It can make a brand memorable, but it is heavy: on phones without a strong graphics chip it slows the page down or breaks. When we tested a three.js first screen on our own site, mobile PageSpeed fell to 32; after loading the scene only where a graphics chip can draw it, with a light version for everyone else, the score reached 78.

More: 3D on a Live Site: Our three.js Experiment and What Google Saw

AI in web design

AI in web design is the use of machine-learning tools across the design process: generating layout variations, testing colour systems, drafting copy, producing video for hero sections and checking accessibility in real time. It now works at the design system layer as well, keeping tokens consistent, documenting components and running visual regression tests. AI speeds up production and lowers its cost, while strategy and art direction stay human: someone still has to decide what the interface is for.

More: AI-Powered Web Design and AI Video Editing in 2025-2026

Generative UI

Generative UI is an interface assembled by AI from a natural-language brief or from the user's context, rather than designed screen by screen in advance. Current platforms already generate production-ready component structures and adapt them across breakpoints. The next task for designers is to create a system from which interfaces can be recomposed, so that AI can rebuild the experience around each person while the brand and the rules stay intact.

More: AI-Powered Web Design and AI Video Editing in 2025-2026

UX personalization

UX personalization is the adaptation of a website or app to each visitor, changing content priority, navigation and calls to action according to who they are and what they appear to want. Machine-learning systems now infer intent from behaviour, going beyond the rule-based logic and A/B testing of the 2010s. For designers, the unit of work shifts from the page and the component to context, intent and decision.

More: AI-Powered Web Design and AI Video Editing in 2025-2026

Zero UI (screenless interfaces)

Zero UI is a design approach for interfaces without a screen, where people interact through voice, gestures or their surroundings, as with voice assistants and smart devices. With no visual hierarchy to lean on, the information architecture has to carry the whole structure and be clear enough to navigate without seeing it. It is a useful reminder that structure, not decoration, is what makes any interface usable.

More: 7 UX/UI Design Trends That Actually Matter in 2026

Usability, conversion and testing

Ways to find where people get stuck and what turns a visit into an inquiry or a sale.

Usability audit

A usability audit is an expert review of how easily people can do what they came for on a website or in an app: navigation, structure, forms, page speed, broken links and the points in the journey where visitors give up. It ends with a prioritized list of fixes rather than a new design, which often makes it a cheaper first step before a redesign. Our usability audit starts from $1,500. It takes one to two weeks, draws on session recordings, rage clicks and analytics, and ends with annotated screenshots and a walkthrough call.

More: Usability Audit

Heuristic evaluation

Heuristic evaluation is an expert review of an interface against established usability principles, or heuristics, such as clear feedback, consistency, error prevention and easy recovery. Specialists go through navigation, page hierarchy, the mobile experience, load speed, conversion paths, form friction and content clarity. Combined with analytics, the review lets every finding trace back to a principle or to real visitor behaviour, which makes the list of fixes easier to trust and to prioritize.

More: Usability Audit

Usability testing

Usability testing is watching real users try to complete real tasks on a website, in an app or in a prototype, to see where they hesitate, make mistakes or give up. It reveals problems that the team, who know the product too well, cannot see. Nielsen Norman Group found in 2000 that five users of one kind uncover about 85% of usability problems, so several small rounds with fixes in between beat one large study. A test is worth running only if it is able to fail.

More: UI/UX Design

Heatmaps and click maps

Heatmaps and click maps are visual reports that show where visitors click, how far they scroll and where their attention stops, aggregated over many sessions. They also reveal rage clicks, repeated clicks on something that does not respond, and dead clicks on elements that are not links, in tools such as Microsoft Clarity. Heatmaps let a redesign rest on behaviour instead of opinions; they inform design judgement rather than replace it.

More: Do You Need a Website Redesign? Start With a Usability Audit

Session recordings

Session recordings are replays of individual visits that show how a real person moved, scrolled, clicked and typed on a site. Analytics says what happened, a recording shows what a person did, and usability analysis explains why. Recordings once showed customers relying on breadcrumbs that an earlier design had removed for looks. They also often show that the interface can stay while the code underneath is replaced.

More: Do You Need a Website Redesign? Start With a Usability Audit

UX friction

UX friction is the distance between what a person came to do and what the interface makes them do to get there. Bad friction includes broken search, unclear shipping terms and unnecessary checkout fields, and each piece of it costs conversions. Some friction is intentional, such as a payment confirmation, and in luxury the time spent examining a piece from every angle, reading about its origin or watching how it was made is what creates desire.

More: Why Luxury E-commerce Breaks Every Rule of Conversion Optimization

Cognitive load

Cognitive load is the amount of mental effort an interface demands from a person to understand it and make a decision. Every element without a purpose, every extra option and every unclear label adds to it, and an overloaded visitor postpones the decision or leaves. The practical rule is one clear message and one primary action per screen, with consistent patterns so that people do not have to relearn the interface on each page.

More: 7 UX/UI Design Trends That Actually Matter in 2026

Call to action (CTA)

A call to action (CTA) is the element, usually a button or a link, that tells a visitor what to do next: request a quote, book a call, buy. Vague CTAs such as Learn More ask visitors to think harder, while specific low-risk actions such as Schedule a Free Consultation get more clicks. In luxury, Request availability or Book a private appointment replace Buy Now when a product needs inspection or advice. A CTA that disappears into the page is not subtle, it is invisible.

More: Why Your Business Isn't Getting Leads From Its Website (And How to Fix It in 2026)

Form optimization (form friction)

Form optimization is reducing the effort a form demands so that more of the people who start it also finish it. Each extra field is a reason to abandon: name, email and one qualifying question usually beat a ten-field form, and one dental practice that cut a nine-field form to name, phone and preferred time saw completed submissions rise. The metric that matters is how many people start the form and how many submit it. In e-commerce the same problem appears as checkout friction.

More: Website Redesign Seattle | We Build Sites That Generate Leads

Trust signals (social proof)

Trust signals are the elements that give a visitor checkable reasons to believe a business: projects, reviews, ratings, figures, certifications and client names, placed at the moment of decision. Badges alone do not create trust; claims that can be verified do. Design itself is a signal: in a Stanford Persuasive Technology Lab study of more than 4,500 people, 46.1% said visual design influenced how credible a site seemed. One firm with hundreds of Google reviews gained form submissions once those reviews appeared on its own site.

More: Why Your Business Isn't Getting Leads From Its Website (And How to Fix It in 2026)

Sticky CTA (sticky buy button)

A sticky CTA is a call-to-action button that stays fixed on the screen while the visitor scrolls, most often the price and buy button on a mobile product page. It keeps the main action within reach on long pages; one store redesign introduced it because 76% of orders came from phones. It has to be checked together with everything else that floats: on three of nine luxury sites we studied, chat bubbles, help buttons or accessibility widgets covered the mobile buy bar.

More: We Measured Nine Luxury Brand Websites. Here Is What Their Design Gets Right

Pop-ups and floating widgets

Pop-ups and floating widgets are elements that appear over the page content: newsletter and discount windows, cookie banners, chat bubbles and help buttons. Each may make sense on its own, but added by different teams they are rarely checked together on a 390-pixel phone screen, where they cover products and buttons. A subscription or discount window over the product blocks not only people but also AI shopping agents trying to read the page.

More: We Measured Nine Luxury Brand Websites. Here Is What Their Design Gets Right

Perceived performance

Perceived performance is how fast a site feels to a visitor, which depends not only on load time but on what appears first, whether the layout shifts and whether the page responds at once. Speed is a UX decision: Aberdeen Group found that a one-second delay cut conversions by about 7%. A page that hesitates, jumps while loading or reveals images in stages says something about the business; in one store the price block loaded after the buy button and pushed it down, so the first click missed.

More: Why Some Websites Look Cheap Even When They Are Well Designed

Accessibility, mobile and languages

Design that works for every person, every screen and every language of the site.

Web accessibility

Web accessibility is the practice of designing and building websites that people with disabilities, whether visual, hearing, motor or cognitive, can use, often with assistive technology such as screen readers. It belongs in design and development, not in a checklist after launch: high contrast, keyboard navigation, real headings, labelled form fields, text alternatives for images and a reduced-motion mode are good UX for everyone and help machines read the page too. For one federation site we built a dedicated mode for visually impaired visitors.

More: Website Design for Architecture Firms: What Clients Look For Before They Call

WCAG 2.2

WCAG 2.2 (Web Content Accessibility Guidelines) is the version of the international web accessibility standard published by the W3C in October 2023, with success criteria at levels A, AA and AAA. Level AA, the usual target, asks for a contrast of at least 4.5:1 for normal text and 3:1 for large text and interface parts, and for pointer targets of at least 24 by 24 CSS pixels. Meeting it is a floor, not a ceiling: a site can pass every check and still be hard to use.

More: Website Design

ADA website compliance

ADA website compliance means making a website usable for people with disabilities in line with the Americans with Disabilities Act, a US civil rights law. In its March 2022 guidance the US Department of Justice stated that the ADA applies to what businesses open to the public offer on the web; it sets no detailed technical rule and names WCAG as helpful guidance. Lawsuits over website accessibility are common in the US, so for American businesses accessibility is a legal question as well as a UX one.

More: UI/UX Design

Colour contrast ratio

Colour contrast ratio is the measured difference in luminance between text or an interface element and its background, expressed from 1:1 (no contrast) to 21:1 (black on white). WCAG asks for at least 4.5:1 for normal text. Low contrast hides even the most important buttons: one luxury house had an order-by-phone button in black on #222222, about 1.3:1. A palette that fails the numbers cannot be fixed in code without changing the design, so contrast is checked when the palette is chosen.

More: We Measured Nine Luxury Brand Websites. Here Is What Their Design Gets Right

Alt text

Alt text is a short text description of an image in the page code, read aloud by screen readers and used by search engines and AI systems to understand what the picture shows. WCAG asks for text alternatives for meaningful images, and image search brings visitors of its own. A useful alt text describes the specific image, such as “living room of a private house with a glass wall”, rather than repeating a keyword or the file name.

More: Website Design for Architecture Firms: What Clients Look For Before They Call

Accessible authentication (WCAG 2.2)

Accessible authentication is a WCAG 2.2 requirement (level AA) that signing in must not depend on a memory or puzzle test unless an alternative is offered, so password managers and pasting must be allowed. WCAG 2.2 added related rules for forms and controls as well: users should not have to retype information they have already entered (level A), and drag actions need a single-pointer alternative (level AA). These rules help everyone, not only people with disabilities.

More: UI/UX Design

Touch target size

Touch target size is the size of the area that responds to a tap, which can be larger than the visible icon or text. Apple's guidelines recommend 44 by 44 points by default, Android at least 48 by 48 dp, and WCAG 2.2 at least 24 by 24 CSS pixels unless targets are spaced apart. A target that is comfortable with a mouse or trackpad is often too small for a thumb, which leads to mistaps and frustration on phones.

More: UI/UX Design

Reduced motion

Reduced motion is an operating system setting for people who are sensitive to animation, which websites can detect through the prefers-reduced-motion media query. A considerate site respects it by calming or switching off parallax, large transitions and moving scenes. On our own site, visitors with this setting get a light first screen without the 3D scene.

More: 3D on a Live Site: Our three.js Experiment and What Google Saw

Mobile-first design

Mobile-first design is the approach of designing for phones first and then expanding the layout to tablets and desktops, instead of shrinking a desktop design. For most sites mobile is the majority experience: if 65% of visitors are on phones, designing for desktop and fixing mobile later optimizes for the minority. Thumb-reachable buttons, click-to-call and forms that need no zooming are the basics, and in a store the catalogue, filters, product page, cart and checkout are all designed for the phone first.

More: Website Redesign Seattle | We Build Sites That Generate Leads

Responsive design (breakpoints)

Responsive design is an approach in which one website adapts its layout to the screen it is viewed on, rearranging columns, images and navigation at set widths called breakpoints for phones, tablets and desktops. It lets one codebase and one address serve every device. A responsive site is not the same as a mobile app, and a good mobile layout is designed rather than simply shrunk. AI tools can now adapt responsive structures across breakpoints automatically.

More: AI-Powered Web Design and AI Video Editing in 2025-2026

Click-to-call

Click-to-call is a phone number on a website or in an ad that starts a call with a single tap on a mobile device. For service businesses it is one of the mobile essentials, next to thumb-reachable buttons and short forms. A phone number shown as plain text or as an image that cannot be tapped is one of the quiet ways a site loses leads at the very moment a visitor is ready to act.

More: Website Redesign Seattle | We Build Sites That Generate Leads

Burger menu

A burger menu is collapsed navigation hidden behind a three-line icon, used mainly on mobile screens to save space. It keeps the layout clean but hides the options, so its contents and their order need as much design attention as a desktop menu. In one store redesign the burger menu was reordered to fit on one screen, and the wishlist and account moved into a separate quick-access bar.

More: Website Design

Platform guidelines (iOS and Material Design)

Platform guidelines are the official design rules of mobile operating systems: Apple's Human Interface Guidelines for iOS and Google's Material Design for Android. Users expect an iOS app to behave like other iOS apps and an Android app like other Android apps, so fighting these conventions creates friction. Following them covers basics such as thumb-sized targets and important actions within thumb reach, while error and offline states still have to be designed for each product.

More: When Does a Business Actually Need a Mobile App?

Multilingual website

A multilingual website is a site that serves visitors in several languages, ideally as one system adapted to different audiences, markets and content operations rather than one design translated several times. Structure and brand stay the same, while content, layout, typography, imagery, navigation and business rules can change. Each extra market adds roughly 10 to 30% to design and development and 20 to 30% to search work, so two well-supported versions beat five poorly maintained ones. Our own site runs in English, Russian and Ukrainian, each designed separately.

More: Multilingual Website Design: What Changes Beyond Translation

Language switcher

A language switcher is the control that lets a visitor move between the language versions of a website, ideally to the equivalent page rather than to the home page. Sites usually offer a region selector on the first visit, a default language for the main market or a version suggested by location, but visitors should always be able to change it. Google advises against automatic redirects by language and calls IP-based location unreliable: suggest a version, link the equivalents and keep the switcher visible.

More: Why Multi-Language Websites Need a Different Design Approach

RTL layout (right to left)

RTL (right-to-left) layout is the mirrored version of a website for languages written from right to left, such as Arabic. Navigation, column order, arrows, sliders, icons and forms are flipped, while numbers, Latin brand names and product codes still run left to right, and fonts are chosen anew. It has required a separate mirrored design rather than a simple switch, which puts an Arabic version at the top of the 10 to 30% extra budget range per market.

More: Digital Agency for Businesses in Dubai and the UAE

Text expansion

Text expansion is the growth in length when interface text is translated from English into another language. Russian and Ukrainian usually run 15 to 25% longer: “Book a Call” becomes “Записаться на звонок”, nearly twice as many characters. Buttons, menus and headings that fit perfectly in English then wrap or break, so every component should be stress-tested against the longest language before the design is approved.

More: Why Multi-Language Websites Need a Different Design Approach

Script-specific typography (Cyrillic, Arabic)

Script-specific typography is choosing and setting type for each writing system a site uses, such as Latin, Cyrillic or Arabic, rather than assuming one font works everywhere. A font with excellent Latin letters may have weak Cyrillic, and the reverse. Each script also has its own quotation marks, dashes and comfortable line length, and Chinese, with its denser characters, needs a different line length again.

More: Why Multi-Language Websites Need a Different Design Approach

Cultural adaptation of design

Cultural adaptation of design is adjusting a website or product to the culture of each market beyond translation: metaphors, holidays, photography, the kind of social proof that persuades and how direct the tone may be. What builds trust in one market can feel pushy or cold in another. A global design system provides the consistent framework while leaving room for each market's own content and imagery.

More: Why Multi-Language Websites Need a Different Design Approach

Website types and redesign

The kinds of websites businesses order and when to redesign, restructure or rebuild.

Website design

Website design is the work of defining a site's structure and look in enough detail to build it: page map, wireframes of every template, key pages for desktop and mobile, a design system and the handoff to developers. Ordered on its own, it risks architecture decisions being made later by someone else. Our website design starts from $8,000; the price moves with the number of languages and markets, whether a brand identity exists, how many components and states the system covers and how ready the texts and photos are.

More: Website Design

Landing page

A landing page is a single web page built around one offer and one action, such as a request, a booking or a purchase, usually as the destination of an ad or email campaign. Everything on it supports that one decision, with as few distractions as possible. When ads bring clicks but not leads, the landing page is often where the problem lies. Our landing pages start from $4,000.

More: Landing Page Development

Corporate website

A corporate website is a company's main site, where it explains what it does, for whom and why it can be trusted. It suits businesses with several services or audiences and usually includes case studies, several languages and inquiries that go straight into a CRM. It is a larger project than a landing page: with us a corporate website costs $20,000 to $40,000.

More: Corporate Website Development

Lead generation website

A lead generation website is a site built as a business tool whose main job is to turn visitors into inquiries, calls or bookings, rather than a digital brochure. It can lose leads in three places: reach, when the traffic is wrong or too small; understanding, when visitors do not grasp the offer; and action, when the next step is unclear, proof is missing, the form is long or the phone number cannot be tapped. Each of these needs a different fix, so the diagnosis comes before the redesign.

More: Website Redesign Seattle | We Build Sites That Generate Leads

Template website vs custom website

A template website is built on a ready-made theme or a website builder, while a custom website is designed and developed for a specific business, its structure and its goals. Templates suit idea tests, portfolios and very small local firms; a custom site is needed to compete in search, generate leads or win high-value clients, since template and prompt-generated sites make companies in one industry look alike. In Seattle in 2026, builders cost $20 to $80 a month, freelancers $1,500 to $6,000 and custom agency sites $15,000 to $50,000 or more.

More: How Much Does a Website Cost in Seattle in 2026?

Website redesign

A website redesign is a new design, and often a new structure, for an existing site that keeps its domain, content and search authority. It is the right choice when the foundation is healthy: search visibility, a reliable CMS, a logical structure and good speed. When every change needs a developer or the platform is slow and fragile, a rebuild may be the better answer, and redesigning only because a site looks old is not a strategy. In the US a redesign typically costs $5,000 to $15,000 and takes 6 to 12 weeks.

More: Website Redesign Seattle | We Build Sites That Generate Leads

Website restructure

A website restructure is a change to which pages a site has, why they exist, in what order they come and whether they tell visitors what to do next, without necessarily changing how the site looks. A redesign changes the look; a restructure changes whether the site works. In one cited case, a rebuild of messaging and structure lifted qualified leads by 34% in a quarter, while a visual redesign with the same positioning did not.

More: Most Companies Don't Need a New Website. They Need a New Structure.

Case study page

A case study page tells the story of one project: the task, constraints, key decisions, scope and result, shown with plans and photographs rather than renders alone. In visual industries, before-and-after stages that explain each decision persuade best, because renders promise and photographs prove. Clients go straight to projects in their own niche, so a portfolio needs filters by project type, and each case should credit the people who actually led the work.

More: Website Design for Architecture Firms: What Clients Look For Before They Call

Luxury e-commerce UX

Luxury e-commerce UX is the design of online stores for premium brands, where the experience is part of the product and standard conversion rules often do not apply. A luxury site may deliberately slow the visitor down and use generous empty space or unconventional navigation; breaking a convention can be the right decision. Slow transitions and video belong to the brand, but full text on materials and dimensions must be in the HTML from the first load. On nine luxury sites, six of eight buy buttons had square corners and none used the pill button of mainstream stores.

More: Why Luxury E-commerce Breaks Every Rule of Conversion Optimization

E-commerce UX design

E-commerce UX design is the design of the digital layer of a retail business, its objects, relationships, customer journeys and decisions, not just a set of store pages. Navigation follows how customers actually shop: a jewellery house organized both by product category and by collection needs navigation that supports both. A store that sells to two audiences, such as architects and designers alongside consumers, gives each of them its own entry point.

More: How We Design E-Commerce: From Objects to Experience

Glossary

Need a term explained on your own project?

Bring it to a strategic session. In two hours we look at your business as a whole and explain, in plain words, what each technical or marketing decision means for it. The session costs $500, credited toward a project started within 30 days.