A-Z Glossary for Web Design & Development
Ever felt lost in a sea of jargon when talking to a web designer or developer? You’re not alone! We’re so used to these terms, we sometimes forget they sound like a foreign language.
A
- Analytics: This is all about understanding your visitors. We use tools to collect and analyze data on how people use your website—things like which pages they visit, how long they stay, and what actions they take. It’s like a spyglass that gives you a clear view of your audience’s behavior.
- Accessibility: This is the practice of building websites that are usable by everyone, regardless of their abilities. It means making sure your site works for people with visual, auditory, cognitive, or motor impairments. By thinking about things like proper color contrast and keyboard navigation, you create a more inclusive and welcoming experience for all users.
- Above the Fold: Picture a newspaper—anything on the top half that you see right away is “above the fold.” On a website, this refers to the part of the page visible on your screen before you have to scroll down. It’s prime real estate for your most important content and calls to action.
B
- Backend: This is the unseen engine of your website. It’s the server, the database, and the application logic that makes everything work. While you can’t see it, the backend is responsible for storing data and ensuring the site runs smoothly.
- Breadcrumbs: Think of these as your trail of digital breadcrumbs. This secondary navigation shows you exactly where you are on a website and how you got there. For example:
Home > Blog > Digital Marketing > SEO
. They’re super helpful for keeping users from feeling lost. - Below the Fold: This is the opposite of “above the fold.” It’s everything on a web page that you have to scroll down to see. It’s a great spot for detailed information, blog posts, or additional content that isn’t critical for the initial impression.
- Browser: This is the app you use to access the internet, like Chrome, Safari, or Firefox. The browser takes the code from a website and turns it into the visuals you see on your screen.
C
- Cache: A cache is a temporary storage spot for web files and data. When you visit a site, your browser might save a copy of it in its cache. The next time you visit, it loads instantly because it doesn’t have to download everything again. This makes your browsing experience much faster.
- CMS (Content Management System): A CMS is a user-friendly platform that lets you create, edit, and manage website content without needing to write code. Platforms like WordPress and Shopify are perfect examples.
- CSS (Cascading Style Sheets): If HTML is the skeleton of a web page, CSS is the skin and clothes. It’s the code that tells the browser how to style the site—everything from colors and fonts to layouts and spacing. It ensures a consistent, beautiful look across all your pages.
- Call to Action (CTA): A CTA is a button, link, or instruction designed to prompt a user to take a specific action, like “Buy Now,” “Sign Up,” or “Download Our Guide.” They are essential for guiding visitors toward your goals.
D
- Domain Name: This is your website’s unique address on the internet, like
www.yourbrand.com
. It’s what people type into their browser to find you, acting as a memorable way to navigate the web instead of using a complex IP address. - DNS (Domain Name System): Think of DNS as the internet’s phonebook. When you type in a domain name, the DNS instantly translates it into the numerical IP address that computers use to locate your website.
- DPI (Dots Per Inch): This term measures the resolution of an image. A higher DPI means a sharper, more detailed image.
- Database: This is where all your website’s data lives, from user accounts and product information to blog posts and comments. It’s a highly organized collection of data that the website can access and manage.
E
- E-commerce: This is the process of buying and selling products or services online. Whether you’re running a small online shop or a massive marketplace, e-commerce is all about conducting business over the internet.
- Error 404: This is a familiar sight for any internet user. It’s an HTTP status code that means “Page Not Found.” It appears when the server can’t locate the requested page, often because of a broken link or a typo in the URL.
- Event Tracking: This is the process of monitoring and recording specific user interactions on your website. Want to know how many people clicked a “Download” button or played a video? Event tracking gives you the data you need.
F
- FTP (File Transfer Protocol): This is a standard method for moving files from one computer to another over the internet. Developers use it to upload their website files from their computer to the web server where the site is hosted.
- Footer: The footer is the section at the very bottom of a webpage. It typically contains important, yet not-so-prominent, information like contact details, social media links, privacy policies, and copyright notices.
- Favicon: A favicon is the tiny icon or logo you see in a browser tab next to the page’s title. It’s a small but powerful tool for brand recognition and makes it easier for users to identify your site among many open tabs.
- Frontend: This is everything a user sees and interacts with on a website. It includes the layout, design, and interactive elements. The frontend is built using languages like HTML, CSS, and JavaScript.
G
- GUI (Graphic User Interface): This is a visual interface that lets you interact with a website or app using buttons, icons, and menus instead of text-based commands. It makes technology intuitive and user-friendly.
- Global Navigation: A global navigation menu is a consistent set of links that appear on every page of a website. It helps users easily navigate to the main sections of your site, like your “About Us” page, “Services” page, or “Contact” page.
- Grid System: The grid system is a design framework of horizontal and vertical lines used to organize a website’s layout. It helps designers and developers create a clean, consistent, and balanced look.
- GIF (Graphics Interchange Format): A GIF is a type of image that can be either static or animated. They’re popular for short, looping clips and memes because they have a small file size and are supported by all web browsers.
H
- Header: The header is the section at the top of a webpage. It’s usually where you’ll find the company logo, the main navigation menu, and sometimes a search bar or a user login button.
- HTML (Hyper Text Markup Language): HTML is the foundation of every website. It’s the code that structures all the content on a page, including headings, paragraphs, images, and links.
- Heatmap: A heatmap is a visual tool that uses color to show you where visitors are clicking, scrolling, and spending the most time on your site. It looks a bit like a weather map, with “hot” colors (red, orange) indicating high activity and “cool” colors (blue, green) showing less activity.
I
- Interactive Design: This is a design approach that focuses on creating engaging interfaces where users can actively interact with the content. Think of buttons that change color when you hover over them, dynamic forms, or animated menus.
- Image Optimisation: This is the process of reducing an image’s file size without sacrificing its quality. Optimising images helps your web pages load faster, which is great for user experience and SEO.
- Information Architecture: This is the practice of organizing a website’s content in a way that makes it easy to understand and navigate. A well-planned information architecture ensures users can find what they’re looking for with minimal effort.
J
- JavaScript: This is a powerful programming language used to add dynamic and interactive effects to a website. It’s what makes things happen on a page without a full reload, like validating form inputs or creating animations.
- JPEG (Joint Photographic Experts Group): A JPEG is a common file format for images, especially photos. It uses a type of compression that reduces file size, which makes it perfect for displaying images on the web quickly.
K
- Keyword: In the world of search engines, a keyword is a specific word or phrase that a user types into a search bar. In web design and SEO, we use keywords to help search engines understand what a page is about, so it can rank higher in search results.
- KPI (Key Performance Indicator): A KPI is a measurable value that helps you track your website’s success. This could be anything from your site’s conversion rate and bounce rate to the average time a user spends on a page.
L
- Landing Page: A landing page is a single, standalone web page created for a specific marketing or advertising campaign. Its sole purpose is to get visitors to take a single action, like signing up for a newsletter or buying a product.
- Latency: This is the delay or lag between a user’s action and the website’s response. Lower latency means a faster, more responsive website.
- Load Balancing: This is a technique used to distribute incoming website traffic across multiple servers. It ensures that no single server gets overloaded, which improves speed and reliability.
M
- Metatags & Metadata: These are pieces of code that provide information about a webpage, like its title and a brief description. While users don’t see them on the page, search engines use them to understand and rank your content.
- Mobile-First Design: This is a design approach where you start by designing the website for a mobile device first, and then scale it up for tablets and desktops. This ensures your site is fully optimized for the most common way people access the web.
N
- Navigation Menu: This is a list of links that allows visitors to browse a website’s different pages and sections. It’s the primary way users explore your site.
- Noindex: A noindex tag is a special instruction for search engines that tells them not to include a specific page in their search results. This is useful for pages you don’t want the public to find, like thank-you pages or internal documents.
- Node.js: A popular software platform that allows developers to run JavaScript on the server side to build fast, scalable web applications.
O
- Open Source: This refers to software where the source code is publicly available and can be used, modified, and shared by anyone. WordPress is a great example of open-source software that thrives on a community of developers.
P
- PNG (Portable Network Graphics): A PNG is a type of image file that supports a transparent background. Because of this, it’s the ideal format for logos, icons, and graphics that need to be placed over different backgrounds.
- Plugin: A plugin is a small piece of software that adds a specific feature to a website or CMS. For example, you can add a contact form, a photo gallery, or an e-commerce shop to your WordPress site by simply installing a plugin.
R
- Responsive Design: A responsive website automatically adjusts its layout to fit any screen size, whether it’s a mobile phone, a tablet, or a desktop monitor. This ensures your site looks and works great on any device.
- Redirect: A redirect is an automatic signal that sends a user’s browser from one URL to another. This is often used when a page has been moved or deleted to ensure visitors don’t land on a broken link.
S
- SEO (Search Engine Optimisation): SEO is the process of improving your website’s visibility and ranking on search engines like Google. It involves things like using the right keywords, creating quality content, and ensuring your site is fast and secure.
- SSL (Secure Sockets Layer): SSL is a security protocol that encrypts the data sent between a user’s browser and your website. An SSL certificate is why you see
https://
in your address bar and a padlock icon, ensuring that any information (like credit card numbers) is protected. - Sitemap: A sitemap is a file that lists all the pages and files on your website. It’s like a table of contents for search engines, helping them understand your site’s structure and crawl it more efficiently.
U
- UI (User Interface): UI refers to the visual look and feel of a website, including the colors, fonts, buttons, and layout. It’s all about making the website aesthetically pleasing and easy to interact with.
- UX (User Experience): UX is focused on the user’s overall journey and satisfaction while using a website. It considers how intuitive and seamless the navigation is, how easy it is to find information, and how enjoyable the entire experience is.
- URL (Uniform Resource Locator): The URL is the complete web address used to locate a specific page on the internet.
V
- Validation: Validation is the process of checking a user’s input in a form to ensure it’s correct before it’s submitted. For example, it will check if the email address is in the right format or if a required field has been filled out.
W
- Wireframe: A wireframe is a simple blueprint of a web page’s layout. It’s a low-fidelity sketch that maps out where the main elements—like buttons, images, and text—will go before any design or coding begins.
- WordPress: A very popular and user-friendly CMS that powers millions of websites. It’s known for being highly customizable and is used for everything from blogs and portfolios to online stores and business websites.
X
- XSS (Cross-Site Scripting): This is a type of security vulnerability that allows attackers to inject malicious code into a website. XSS can be used to steal user information or redirect them to harmful sites.
- XML Sitemap: A specific type of sitemap that lists your website’s pages for search engines, helping them discover and index your content more effectively.
Y
- Y-Axis: In web design and development, the Y-axis refers to the vertical dimension. You’ll often hear this term when discussing the vertical movement of elements on a page.
Z
Z-Index: This is a CSS property that controls the stacking order of elements on a page. Think of it like layers in a photo editor—a higher z-index value means the element will appear on top of other elements with a lower value.