Why Understanding Website Redesign Terminology Matters
A website redesign represents one of the most significant digital investments a business can make. Yet many business owners and marketing managers find themselves lost in conversations with web professionals who casually toss around terms like "wireframes," "responsive design," or "301 redirects" without explanation. This knowledge gap can lead to miscommunication, unexpected costs, and ultimately, a website that doesn't fully meet your business objectives.
When you understand the language of web design and development, you become an active participant in the creative process rather than a passive observer. You can ask meaningful questions, provide clearer feedback, and ensure that your vision translates accurately into the final product. More importantly, you'll be better equipped to evaluate proposals, compare vendor offerings, and make strategic decisions that impact your bottom line.
This comprehensive glossary covers all the essential terms you'll encounter throughout a website redesign project, organized by the phase of work where you're most likely to encounter each concept. Whether you're in the discovery phase mapping out your site structure or preparing for launch with technical optimizations, this guide serves as your reference for understanding the vocabulary that shapes modern web experiences.
Our /services/web-development/ team regularly works with business owners navigating their first or fifth website redesign, and we've found that shared vocabulary accelerates project success and reduces costly miscommunication.
Strategic Planning and Discovery Terms
The strategic planning phase forms the foundation of any successful website redesign. During this stage, your team works with designers and strategists to define goals, understand your audience, and establish the overall structure and direction of your new website. These terms represent the building blocks of project planning and user experience design.
Information Architecture
Information Architecture, often abbreviated as IA, refers to the structural design of information spaces--the way content, features, and functionality are organized and connected within your website. Think of it as the blueprint or map that defines how users navigate through your site and find what they're looking for. A well-designed information architecture makes intuitive sense to visitors, reducing frustration and increasing engagement.
Information architecture encompasses several key components including the site hierarchy (which determines how pages relate to one another), navigation systems (how users move between sections), labeling systems (how content categories and links are named), and search functionality (how users find specific information). During a redesign, information architects analyze how users currently interact with your site, identify pain points in the existing structure, and propose improved organization based on user research and business goals.
Site Map
A site map is a visual representation of your website's structure, displaying all pages and their hierarchical relationships in a tree-like format. This document serves as a crucial planning tool that shows how different sections connect and help users understand the overall organization of your content. During a redesign, the site map often evolves significantly from the existing structure as you optimize for better user journeys and updated business priorities.
Wireframe
A wireframe is a low-fidelity visual guide that represents the skeletal framework of a web page, focusing on space allocation and prioritization of content rather than visual design details. Think of it as a blueprint that shows where different elements will live on a page without including colors, images, or sophisticated styling. Wireframes typically use simple grayscale elements--boxes, lines, and placeholder text--to communicate layout and structure.
Mockup
A mockup takes the wireframe structure and applies visual design elements to create a high-fidelity representation of what the final page will look like. Unlike wireframes that focus on structure, mockups show colors, typography, imagery, iconography, and branding elements. A mockup is essentially a static design composition that looks very close to the final website but lacks interactivity and functional behavior.
Prototype
A prototype moves beyond static mockups to create an interactive experience that simulates user flows and functionality. While a mockup shows how a page looks, a prototype demonstrates how a page behaves--allowing you to click through navigation, test form interactions, and experience user journeys in a simulated environment. Prototypes bridge the gap between design concepts and functional reality.
User Experience (UX)
User Experience, commonly abbreviated as UX, encompasses all aspects of a visitor's interaction with your website--including emotional response, perceived value, and task completion. While often conflated with user interface design, UX is a broader concept that includes usability, accessibility, performance, and the overall feeling visitors have when engaging with your digital presence. Excellent UX means visitors can accomplish their goals efficiently and enjoyably.
Design and Content Creation Terminology
Once strategic planning is complete, the design phase transforms wireframes and requirements into visual concepts and content. These terms describe the elements, principles, and components that shape the aesthetic and experiential qualities of your website.
Typography
Typography refers to the art and technique of arranging type to make written language legible, readable, and visually appealing when displayed. In web design, typography encompasses font selection, sizing, spacing, hierarchy, and formatting--all the decisions that determine how text appears and communicates on your website. Typography is often called the voice of design because it conveys mood, personality, and emphasis through letterforms.
Grid System
A grid system is a framework of horizontal and vertical lines that define where content elements should be placed on a page. Grids bring order to design layouts, ensuring visual consistency, proper alignment, and balanced spacing across all pages. In web design, grids are typically implemented using CSS frameworks or custom CSS that defines column structures and responsive behaviors.
Hero Image
The hero image (or hero section) is the prominent visual element that appears at the top of a web page, typically spanning the full width of the viewport. This area serves as the visual anchor for the page, communicating the most important message or value proposition in a striking, memorable way. Hero sections often include headline text, supporting copy, and calls to action positioned over or alongside the hero imagery.
Call to Action (CTA)
A Call to Action, or CTA, is a prompt that encourages visitors to take a specific desired action--typically making a purchase, requesting a quote, downloading content, contacting the business, or navigating to another page. CTAs appear as buttons, links, forms, or interactive elements strategically placed throughout the website to guide visitors toward conversion. Effective CTAs use action-oriented language and create urgency or value proposition.
Whitespace
Whitespace (also called negative space) is the empty area around and between design elements on a page. Despite its name, whitespace isn't necessarily white--it refers to any unmarked space, regardless of color. Whitespace is a fundamental design element that creates breathing room, improves readability, and establishes visual hierarchy. Effective use of whitespace separates content areas, guides attention, and creates sophisticated, modern aesthetics.
Navigation
Navigation refers to the system of links, menus, and controls that allow visitors to move between pages and sections of a website. Effective navigation makes it easy for visitors to find what they're looking for, discover relevant content, and understand the website's structure. Navigation includes primary menus, sub-menus, footer links, breadcrumbs, in-content links, and any other mechanisms for movement.
Technical Development Terminology
Once designs are approved, the development phase brings your website to life with code. These terms describe the technical components and considerations that determine your website's functionality, performance, and capability.
HTML (Hypertext Markup Language)
HTML is the standard markup language used to create web pages. It provides the structural foundation that defines content elements--headings, paragraphs, images, links, forms, and other content types. HTML uses a system of tags and attributes to describe content, which browsers then interpret and render as visual web pages. Every website you visit is built using HTML as its structural foundation.
CSS (Cascading Style Sheets)
CSS is the language used to describe the visual presentation of HTML elements--colors, fonts, layouts, spacing, animations, and all other aesthetic aspects of web pages. While HTML defines content structure, CSS defines how that content looks. CSS separates presentation from structure, enabling consistent styling across pages and flexible adaptation for different devices.
Responsive Design
Responsive design is an approach to web design that makes websites adapt their layout and presentation to different screen sizes and devices. A responsive website looks and functions well on desktop computers, tablets, smartphones, and any other device a visitor might use. This adaptation happens through flexible layouts, responsive images, and CSS media queries that apply different styles based on device characteristics.
Breakpoints
Breakpoints are the screen width thresholds at which responsive layouts adapt their configuration. When the viewport reaches a breakpoint, CSS media queries trigger different styling rules that reorganize content for the new screen size. Common breakpoints include those corresponding to typical device widths--smartphones (around 320-480px), tablets (around 768-1024px), and desktop monitors (around 1200px and above).
Lazy Loading
Lazy loading is a performance optimization technique that delays loading non-critical resources until they're needed. In web contexts, this most commonly refers to images that load only as users scroll them into view rather than loading all images when the page first loads. This approach can dramatically improve initial page load times, especially on pages with many images or embedded media.
SSL Certificate and HTTPS
An SSL (Secure Sockets Layer) certificate is a digital certificate that enables encrypted communication between a web browser and a web server. When a website has an SSL certificate and is configured to use HTTPS (HTTP Secure), all data transmitted between the browser and server is encrypted, protecting sensitive information from interception. HTTPS is now considered essential for all websites, not just those handling sensitive data.
Partnering with an experienced /services/web-development/ team ensures these technical considerations are properly addressed during your redesign project.
SEO and Analytics Terminology
Your website's success depends partly on its visibility in search engines and your ability to measure and improve performance. These terms describe the concepts and tools that drive organic discovery and data-driven optimization.
Meta Tags
Meta tags are HTML elements that provide information about a web page to browsers, search engines, and other web services. While not visible to regular visitors, meta tags communicate critical information that influences how pages appear in search results and social media shares. The most important meta tags include the title tag (which appears as the clickable headline in search results) and meta description (which appears as the summary text below the title).
Schema Markup
Schema markup is structured data added to web pages that helps search engines understand the content's meaning and context. Using vocabulary from Schema.org, this markup creates a standardized format that search engines can parse and use to provide enhanced search results. Schema markup enables rich snippets--search results that display additional information like ratings, prices, event dates, and other structured data.
Canonical Tags
Canonical tags are HTML elements that specify the preferred URL when multiple URLs contain identical or very similar content. Without canonical tags, search engines may interpret duplicate content as a quality issue or split ranking signals between multiple versions. Canonical tags consolidate ranking signals and prevent duplicate content penalties by indicating which version should be considered authoritative.
Core Web Vitals
Core Web Vitals are Google's user-centric performance metrics that measure loading, interactivity, and visual stability. These metrics--Largest Contentful Paint (LCP), First Input Delay (FID), and Cumulative Layout Shift (CLS)--quantify aspects of user experience that directly impact perceptions of site quality. Core Web Vitals are now ranking factors, meaning they can affect your search visibility.
Google Analytics
Google Analytics is Google's web analytics service that tracks and reports website traffic, user behavior, and conversions. By placing a tracking code snippet on your website, you can gather data about how visitors find and use your site--which pages they visit, how long they stay, where they come from, what devices they use, and whether they complete desired actions. This data informs strategic decisions and performance optimization.
Heatmap Analytics
Heatmap analytics tools visualize user behavior by overlaying color-coded data on screenshots of web pages. Clicks, scrolls, and mouse movements are represented through color gradients--hot colors (red, orange) indicate high engagement areas while cold colors (blue, green) indicate low engagement areas. Heatmaps provide intuitive visual representations of how users actually interact with pages, complementing the quantitative data from analytics platforms.
Our /services/seo-services/ specialists help clients implement proper SEO foundations, schema markup, and analytics tracking as part of comprehensive website redesign projects.
Mobile and Accessibility Standards
Modern websites must serve diverse audiences across various devices while ensuring accessibility for users with disabilities. These terms describe the standards and approaches that ensure inclusive, universal web experiences.
WCAG Compliance
The Web Content Accessibility Guidelines (WCAG) are international standards for making web content accessible to people with disabilities. These guidelines address accessibility for users with visual, auditory, physical, speech, cognitive, language, learning, and neurological disabilities. WCAG compliance ensures your website can be used by the broadest possible audience, including those using assistive technologies like screen readers.
WCAG defines three levels of conformance: A (minimum), AA (recommended for most websites), and AAA (highest level). Most organizations target AA compliance, which requires addressing the most significant accessibility barriers. Achieving WCAG compliance involves technical implementations like proper heading structure, alt text for images, keyboard navigation support, sufficient color contrast, and many other considerations.
Responsive Design
Responsive design ensures websites function effectively across all device types and screen sizes. Rather than maintaining separate mobile and desktop sites, responsive approaches use flexible layouts, fluid grids, and media queries to adapt presentation to the viewing environment. This single-site approach simplifies content management while providing optimized experiences for all visitors.
Pre-Launch and Launch Terminology
As your redesign nears completion, specific terms describe the critical activities and considerations that ensure a successful launch.
301 Redirects
A 301 redirect is a permanent redirect from one URL to another. When you change URLs during a website redesign (and you almost always will), 301 redirects ensure visitors and search engines reach the new location. Beyond simply forwarding traffic, 301 redirects also transfer most of the original URL's search ranking signals to the new destination, helping preserve your visibility during and after the transition.
Staging Environment
A staging environment is a private version of your website used for testing and review before changes go live. The staging site mirrors your production environment but isn't accessible to the public. This allows thorough testing of new designs, features, and content without risking the live website. Changes are tested and approved in staging before being deployed to production.
DNS Propagation
DNS propagation is the process by which changes to domain name system records spread across the internet's distributed network of DNS servers. When you launch a new website or change hosting providers, DNS propagation determines when visitors can reach your new site. This process can take from a few hours to 48 hours, depending on various factors including TTL (time-to-live) settings on your DNS records.
Common Website Elements
These terms describe components and features commonly found on websites, regardless of project phase.
Carousel
A carousel (also called a slider) is a rotating display that shows multiple pieces of content sequentially in the same space. Carousels typically cycle automatically through images or content panels, with navigation controls allowing manual advancement. They're commonly used to showcase featured content, highlight promotions, or present multiple messages without requiring vertical scrolling.
Sticky Navigation
Sticky navigation (also called fixed navigation) keeps the navigation menu visible at the top of the viewport as users scroll down the page. Rather than scrolling away with the page content, sticky navigation remains accessible at all times, making it easy for users to navigate regardless of how far they've scrolled. This pattern has become standard on many modern websites.
Hover States
Hover states are visual changes that occur when a user positions their cursor over an interactive element without clicking. Hover states provide feedback confirming that elements are interactive, guide attention to clickable areas, and can communicate additional information through tooltips or reveal effects. While hover states have no meaning for touch devices, they remain important for mouse and trackpad users.
Conclusion
Understanding website redesign terminology empowers you to participate more effectively in the web development process, communicate more clearly with professionals, and make more informed decisions about your digital presence. This glossary covers the essential vocabulary you'll encounter, but web design and development continues to evolve with new technologies, standards, and best practices.
The most successful website redesigns result from effective collaboration between business stakeholders who understand their audience and goals, and technical professionals who understand how to translate those goals into effective digital experiences. Shared vocabulary and understanding strengthens this collaboration.
As you move forward with your website redesign project, refer back to this glossary when unfamiliar terms arise. Your project team will appreciate working with an informed stakeholder who asks thoughtful questions and provides clear feedback. The investment in understanding this terminology will pay dividends throughout your redesign project and beyond.
Ready to start your website redesign? Our team at Digital Thrive can guide you through every phase of the process, from strategic planning through successful launch. Contact us today to discuss how we can help transform your digital presence.
Frequently Asked Questions
What is the difference between a wireframe and a mockup?
A wireframe is a low-fidelity structural guide showing layout and content placement without visual design elements. A mockup is a high-fidelity design representation showing colors, typography, and branding but lacks interactivity. Wireframes focus on structure; mockups focus on aesthetics.
Why are 301 redirects important for website redesigns?
301 redirects preserve search engine rankings when URLs change during a redesign. They permanently redirect old URLs to new ones, transferring ranking signals and ensuring visitors reach the correct content. Without proper redirects, you risk losing search visibility and creating broken user experiences.
What are Core Web Vitals and why do they matter?
Core Web Vitals are Google's metrics measuring loading performance (Largest Contentful Paint), interactivity (First Input Delay), and visual stability (Cumulative Layout Shift). They affect both user experience and search rankings, making optimization important for visibility and performance.
What is responsive design and why is it essential?
Responsive design makes websites adapt to different screen sizes and devices, providing optimal experiences on desktops, tablets, and smartphones. With mobile traffic often exceeding desktop traffic, responsive design is essential for usability, SEO, and meeting modern user expectations.
What is WCAG compliance?
WCAG (Web Content Accessibility Guidelines) are international standards for making websites accessible to users with disabilities. Compliance levels include A (minimum), AA (recommended), and AAA (highest). WCAG compliance ensures your website can be used by the broadest audience possible.
What is the difference between a CMS and a website builder?
A Content Management System (CMS) provides a backend interface for managing content without coding knowledge. Website builders are often more visual, drag-and-drop tools that combine design and content management. The choice depends on your team's needs, technical skills, and customization requirements.
Website Redesign Checklist
A comprehensive guide to planning and executing a successful website redesign project.
Learn moreQuestions to Ask Before Hiring a Web Design Agency
Essential questions to evaluate potential web development partners for your redesign project.
Learn moreUnderstanding Website Analytics
Learn how to interpret website data to measure performance and inform optimization decisions.
Learn more