Web design can sound confusing if you’re not familiar with the technical terms. This glossary explains common web design language in plain English, helping you understand what your designer or developer is talking about.
A | B | C | D | E | F | G | H | I | J | K | L | M | N | O | P | Q | R | S | T | U | V | W | X | Y | Z
A
Accessibility
Designing websites so everyone can use them, including people with disabilities. It involves readable text, clear navigation, and compatibility with assistive technology.
Anchor link
A link that jumps to another section of the same page. Often used for table of contents or “back to top” links.
Animation
Movement added to a web page, such as fading buttons or sliding images. Used sparingly, it draws attention and improves user experience.
API (Application Programming Interface)
Software that lets two systems communicate. For example, a website might use a Google Maps API to display a live map.
Aspect ratio
The width-to-height ratio of an image or video. Keeping it consistent prevents distortion or cropping problems.
B
Back end
The part of a website you don’t see — where the code, database, and server handle data and logic. Developers work here to make everything function properly.
Bandwidth
The amount of data transferred between your site and its visitors. High-quality images or videos use more bandwidth and may slow things down.
Breakpoint
The screen width at which a responsive layout changes to fit different devices, such as mobiles or tablets.
Browser cache
Stored files (like images and CSS) that help websites load faster when you revisit them.
Breadcrumb navigation
A trail of links that shows where a page sits in your site’s hierarchy. It helps users find their way back to previous sections.
C
Call to action (CTA)
A button or link that encourages visitors to do something — for example, “Get a quote” or “Join now”.
CMS (Content Management System)
Software that allows you to add, edit, and manage website content without needing to code. WordPress is the most popular CMS in the world.
Colour palette
The set of colours chosen for a website’s design. A consistent palette builds brand recognition and makes pages visually balanced.
Compression
Reducing the size of files, such as images or scripts, so pages load faster without noticeably losing quality.
CSS (Cascading Style Sheets)
The code that controls a site’s design — colours, fonts, spacing, and layout. It works alongside HTML to style your pages.
CTA button
A prominent button that draws attention and leads to a specific action, like “Book a consultation”. Good design and colour contrast are key.
D
Dashboard
The admin area of your CMS where you can manage content, users, and settings. WordPress users often call this the “back end”.
Database
Where website information is stored — posts, users, orders, etc. WordPress, for example, stores its data in a MySQL database.
Domain name
Your website’s address on the internet (for example, medlockweb.com). It’s what users type to reach your site.
Dropdown menu
A navigation element that expands to show more options when clicked or hovered over. It helps save space on mobile and desktop menus.
E
E-commerce
Websites that sell products or services online. They include shopping carts, checkout pages, and payment integrations.
Element
A single piece of content or design on a page — like an image, button, or heading. Page builders such as Elementor or Kadence Blocks use elements as building blocks.
Embedded content
Content loaded from another source, such as a YouTube video or Google Map, displayed directly within your page.
Emoji compatibility
Support for displaying emojis properly on web pages, useful for modern branding and social-style content.
F
Favicon
The small icon displayed in a browser tab beside your site’s title. It helps users recognise your site quickly among open tabs.
Flat design
A minimalist design style without heavy shadows or 3D effects. It improves clarity and usually loads faster.
Footer
The bottom section of a website that often contains contact details, navigation links, or copyright notices.
Form
An area where visitors enter data, such as contact information or feedback. Forms collect leads or enquiries.
Front end
The part of a website users see and interact with. It includes everything displayed in the browser.
Framework
A collection of pre-written code that helps developers build websites faster. Examples include Bootstrap and Tailwind CSS.
G
Gallery
A collection of images displayed in a grid or slideshow. Common on portfolio and photography sites.
GDPR
General Data Protection Regulation — UK and EU law on protecting personal data. Websites must follow it when collecting information such as email addresses or cookies.
Grid layout
A structure that arranges elements in rows and columns for visual balance and consistency.
H
Header
The top part of a page that usually includes your logo, navigation, and sometimes a call-to-action button.
Hosting
The service that stores your website’s files and makes them accessible on the internet. A reliable host improves performance and uptime.
Hover effect
A visual change that happens when someone moves their mouse over an element — for example, a button changing colour.
HTML (HyperText Markup Language)
The foundation of all websites. HTML structures your content so browsers can display it correctly.
I
Icon
A small graphic symbol representing an action or concept, such as a magnifying glass for search or a phone for contact.
Image optimisation
Preparing images to load quickly by resizing, compressing, and using modern formats like WebP.
Interactive design
Design that encourages user actions — scrolling effects, quizzes, sliders, or animations that respond to input.
J
JavaScript
A coding language that adds interactivity to web pages, such as pop-ups, dynamic forms, or image sliders.
JPEG
A common image format that balances quality and file size. Ideal for photographs.
K
Kerning
The spacing between individual letters in text. Proper kerning improves readability and gives a more polished look.
Keyword
In web design, a keyword often refers to the main search term a page targets, influencing design choices like headlines or URL structure.
L
Landing page
A single, focused page designed to achieve a specific goal, such as getting sign-ups or enquiries. Often used in campaigns.
Layout
The arrangement of text, images, and elements on a page. A clean layout improves usability and flow.
Lazy loading
A technique that loads images only when they appear in view, helping pages load faster initially.
Logo
A symbol or wordmark that represents your brand. It should be clear, scalable, and look good in different formats.
M
Margin
The space outside an element’s border. Adjusting margins controls spacing between blocks of content.
Menu
The navigation area that lets users move between pages. Menus are usually found in headers or sidebars.
Mock-up
A visual preview of how a website will look before it’s built. Designers often create mock-ups in tools like Figma or Canva.
Mobile responsive
A design that adapts automatically to different screen sizes and devices, ensuring good usability on phones and tablets.
N
Navigation
The way users move around a site. Good navigation is clear, predictable, and available on every page.
Navigation bar (navbar)
A strip at the top or side of a page containing key menu links.
Newsletter sign-up
A form inviting visitors to subscribe for updates or offers. It’s a simple lead-generation tool.
O
Open graph tags
Meta tags that control how your pages look when shared on social media — they define the title, image, and description shown in previews.
Optimisation
Improving the performance, accessibility, and usability of a site to make it load faster and work better across devices.
Overlay
A semi-transparent layer placed over an image or video to improve text contrast or add visual focus.
P
Padding
The space inside an element’s border. Adjusting padding affects how content sits within its box.
Page builder
Tools like Elementor, Kadence Blocks, or Divi that let you design pages visually without coding.
Parallax effect
A scrolling effect where background images move slower than foreground content, adding depth and movement.
Pixel
The smallest unit of a digital image or display. High pixel density screens (like Retina) need sharper graphics.
Plugin
Software add-ons that extend a website’s features — such as contact forms, sliders, or SEO tools.
Prototype
An interactive mock-up showing how users will navigate or interact before development begins.
Q
Quality assurance (QA)
The testing phase before launch to check that pages look right, work properly, and display correctly on different devices and browsers.
R
Resolution
The clarity of an image or screen, measured in pixels. Higher resolution means sharper visuals.
Responsive design
A design approach that ensures websites look and function well on any screen size or device.
RGB
Stands for Red, Green, and Blue — the colour model used for digital displays.
Row
A horizontal section in a layout that contains one or more columns. Rows help structure page content.
S
Sans-serif
A typeface style without decorative strokes at the ends of letters. Commonly used for modern, clean designs.
Search bar
A field that lets users find specific content within your website.
Slider
A rotating display of images or content panels. Popular on homepages but should be used sparingly for speed and accessibility.
SSL certificate
Security technology that encrypts data sent between your website and visitors. It changes your site address from HTTP to HTTPS.
Sticky header
A header that stays visible at the top of the screen as you scroll down the page.
Stock photos
Licensed images used to illustrate content when custom photography isn’t available. Always choose high-quality, relevant photos.
T
Template
A pre-designed layout that you can reuse for similar pages. Templates save time and keep design consistent.
Typography
The art and style of arranging type — font choice, size, spacing, and alignment all affect readability and tone.
Tagline
A short phrase that sums up what a business does or stands for. Usually displayed near the logo or site header.
Thumbnail
A small version of an image or video, often used in galleries or previews.
U
UI (User Interface)
The visual layout and design of a website — what users interact with directly.
URL
The address of a page on the internet. Clean, readable URLs make it easier for users and search engines to understand your structure.
UX (User Experience)
How someone feels when using a website. Good UX means navigation is smooth, content is clear, and actions are easy.
V
Viewport
The visible area of a web page within the browser window. Designers use it to define responsive breakpoints.
Visual hierarchy
The arrangement of elements to guide attention — headings, colours, and spacing all influence what people notice first.
W
Web hosting
The service that provides the server space where your website’s files live.
Wireframe
A basic layout showing how a page will be structured before colours, fonts, or graphics are added.
WordPress
A content management system (CMS) that powers millions of websites worldwide. It’s flexible, user-friendly, and widely supported.
Widget
A small block that displays dynamic content, such as recent posts, social media feeds, or contact forms.
Whitespace
The empty space between elements. Proper whitespace improves readability and gives designs a clean, uncluttered feel.
X
XHTML
An older version of HTML that follows stricter coding rules. It’s mostly replaced by modern HTML5.
Y
Yellow space
A design term sometimes used jokingly to describe areas that need balance or contrast. Essentially, it means “use empty space wisely”.
Z
Z-index
A CSS property that controls which elements appear on top when they overlap. Useful for layering pop-ups, menus, and overlays.