Placeholders
Published Jun 8, 2022Updated May 3, 2025
Contribute to Docs
When creating early-stage sketches or wireframes, low-fidelity placeholders are used to represent high-fidelity content such as text, images, and videos. Wireframe elements serve as placeholder content, indicating the use and placement of an element without emphasizing its final visual appearance.
Purpose of Placeholders in Design
Placeholders help designers and stakeholders focus on layout and interaction flow without getting distracted by details such as final copy or image styling.
They are often used in:
- Low-fidelity wireframes to represent headings, paragraphs, and buttons using grey boxes or “lorem ipsum” text.
- Content planning sessions to mark where dynamic or pending assets (such as videos or embedded charts) will go.
- Prototyping when functionality needs to be tested before assets are finalized.
Types of Placeholders
Common forms of placeholders include:
- Text placeholders: Generic copy such as “Headline here” or “Lorem ipsum” to represent future body content.
- Image placeholders: Grey boxes or icons marked with an ‘X’, a camera symbol, or image dimensions (e.g., 800×600).
- UI component placeholders: Blocks or lines indicating future dropdowns, tabs, or carousels in a layout.
- Loading placeholders (skeleton screens): Shimmering or animated blocks displayed while real data is being fetched — often used in modern web applications.
Note: Skeleton screens are a special category of placeholders focused on perceived performance rather than structural design.
Contribute to Docs
- Learn more about how to get involved.
- Edit this page on GitHub to fix an error or make an improvement.
- Submit feedback to let us know how we can improve Docs.
Learn UI and UX Design on Codecademy
- Career path
Front-End Engineer
Front-end engineers work closely with designers to make websites beautiful, functional, and fast.Includes 34 CoursesWith Professional CertificationBeginner Friendly115 hours - Free course
Introduction to UI and UX Design
Get started with User Interface (UI) and User Experience (UX) Design and learn how to wireframe and prototype using Figma.Beginner Friendly2 hours