Skip to content
    Flow-alerta.cab

    Wireframe

    UX & accessibilityNo additional designation is used.
    Editorially reviewed on: 1 source
    Your reading view

    The short answer · 14 words

    In short

    A Wireframe shows the structure of a page before the final design is applied.

    Flow-alerta.cab (2026): Wireframe. https://flow-alerta.cab/en/glossar/wireframe. Editorially reviewed on: 09 October 2026.

    How much detail would you like?

    Practical

    Helps make websites understandable, operable and usable for more people.

    Possible example: Before designing, a team decides the order of the hero section, benefits, example and contact section.

    Possible application in small and medium-sized businesses: Before designing, a team decides the order of the hero section, benefits, example and contact section.

    At a glance

    Core
    A schematic, structural draft of a web page without final colours and graphics, used to plan the arrangement of content.
    Use
    Helps make websites understandable, operable and usable for more people.
    Example
    Possible example: Before designing, a team decides the order of the hero section, benefits, example and contact section.
    Limits
    Mistaking the rough draft for a finished user interface.

    In context

    Customer Journey

    Sequence of interactions and experiences through which a person works towards a goal across time and channels.

    User Experience (UX)

    User Experience describes the entire experience of using a product or service.

    Questions about this term

    What does Wireframe mean?

    A Wireframe shows the structure of a page before the final design is applied.

    What mistakes should be avoided?

    Mistaking the rough draft for a finished user interface.

    All details and background

    A schematic, structural draft of a web page without final colours and graphics, used to plan the arrangement of content.

    ELI5 – Explained simply

    Like a floor plan before colours and furniture are chosen.

    Why it matters in practice

    Helps make websites understandable, operable and usable for more people.

    Example

    Possible example: Before designing, a team decides the order of the hero section, benefits, example and contact section.

    Pitfalls and limits

    • Mistaking the rough draft for a finished user interface.

    Origin & history

    NN/g describes wireframes and wireflows as drafts of structure or interconnected flows. They must be distinguished from a fully designed interface.

    Use in mid-sized companies

    • Possible application in small and medium-sized businesses: Before designing, a team decides the order of the hero section, benefits, example and contact section.

    Related terms

    Matching Flow-alerta service

    Websites & web applicationsWebsites & web applications

    Matching tool / use case

    View use casesUse case: UX and accessibility assessment

    Sources

    • www.nngroup.comNielsen Norman Group, Wireflows: A UX Deliverable for Workflows and Apps

    Quellen geprüft am 09.10.2026. Redaktionelle Anwendungsbeispiele sind hypothetisch; kein Nachweis realer Kundenergebnisse.

    Editorially reviewed on:

    Next step

    Put knowledge into practice

    Discuss your projectView use cases