At Cloude Solutions, we build stunning websites that generate organic traffic and help your business to thrive.
Below is a list of web design glossary terms that we use in our day-to-day work.
Web Design Glossary
A file that is used to configure how a web server behaves for a particular website. It can be used to redirect URLs, protect pages with passwords, and more.
The .htaccess file is placed in the root directory of a website, and its directives apply to that directory and its subdirectories.
The practice of designing websites that can be used by people with disabilities or limitations.
This includes making sure that content is easy to read, providing alternative text for images, and ensuring that website navigation is simple and straightforward.
Accessibility is important for creating a more inclusive web and for complying with accessibility laws and guidelines.
A programming technique that allows websites to update content dynamically without the need for a page refresh. This can improve the user experience by making the website feel more responsive and interactive.
The clickable text that appears in a hyperlink. It is important for SEO purposes, as search engines use anchor text to help determine the relevance of the linked content.
Anchor text should be descriptive and relevant to the linked page, and should avoid generic phrases like “click here” or “read more”.
The behind-the-scenes part of a website that is responsible for processing requests and serving up content to users. This includes the server, database, and other components that work together to power the website.
Back-end development involves programming languages like PHP, Python, and Ruby, as well as frameworks like Node.js and Django.
A link from one website to another. Backlinks are important for SEO, as search engines view them as a sign of the linked-to site’s authority and relevance.
High-quality backlinks from reputable websites can improve a site’s search engine rankings and increase its visibility to users.
The amount of data that can be transferred over a network connection in a given period of time.
Bandwidth is typically measured in bits per second (bps) or bytes per second (Bps), and it affects the speed at which a website can load content. Websites with large images, videos, or other media may require more bandwidth to load quickly and efficiently.
Below The Fold
The part of a website that is not visible on the screen until the user scrolls down.
This term comes from the newspaper industry, where “above the fold” refers to the top half of the front page that is visible when the paper is folded in half.
Below-the-fold content can still be important for engaging users and providing additional information or calls to action.
The percentage of website visitors who leave a site after viewing only one page. A high bounce rate can indicate that a website is not effectively engaging users or providing relevant content.
The bounce rate can be reduced by improving website design, providing clear navigation, and ensuring that content is relevant and engaging.
A graphic element that represents a brand or company. Brandmarks can include logos, icons, or other visual elements that are used to create brand recognition and identity.
A well-designed brandmark can help a company stand out in a crowded market and build brand loyalty among customers.
A navigation aid that shows the user’s current location within a website’s hierarchy. Breadcrumbs typically appear near the top of a page and show the user’s path from the homepage to the current page.
Breadcrumbs can help users understand website structure and navigate to related content more easily.
The process of storing website data temporarily in order to improve website performance.
Caching can include storing images, scripts, and other content in the user’s browser cache or on a server cache. This allows the website to load faster on subsequent visits since the content is already stored locally.
Cascading Style Sheets
A programming language used to style website content. Cascading Style Sheets, or CSS, allows developers to separate content from presentation, making it easier to update and maintain a website’s design.
CSS can be used to control fonts, colours, layout, and other visual elements of a website.
Client-side code can be contrasted with back-end code, which runs on the server.
An abbreviation for Content Management System, which is a software application used to create and manage digital content. CMS platforms provide tools for creating, publishing, and organizing website content, and they are commonly used for blogs, news sites, and e-commerce sites. Popular CMS platforms include WordPress, Drupal, and Joomla.
A text note that is added to website code for documentation or communication purposes. Comments are not visible on the website itself, but they can be helpful for other developers who need to understand the code. Comments can also be used for debugging or testing purposes.
The difference between light and dark areas of a website’s design. Contrast is an important design principle, as it can affect readability, accessibility, and visual appeal. High contrast can make text and images stand out more, while low contrast can create a more subtle, muted effect.
The process of turning website visitors into customers or users. A conversion can refer to any action that a website wants its visitors to take, such as making a purchase, filling out a form, or signing up for a newsletter.
Conversion rate is a key metric for measuring website success, and it can be improved through website design, user experience, and marketing strategies.
CTA, or Call-to-Action, is a marketing term that refers to a prompt that encourages a user to take a specific action. CTAs can be used on websites to encourage users to make a purchase, fill out a form, or subscribe to a newsletter.
Effective CTAs are usually clear, visible, and persuasive.
A programming term used to indicate that a feature or function is no longer recommended or supported. Deprecated features may still work in some cases, but they are likely to be removed or replaced in future versions of the software. Developers are encouraged to update their code to use newer, recommended features.
Domain Name System (DNS) is a system that translates domain names (such as example.com) into IP addresses (such as 192.0.2.1) that are used to connect to web servers. DNS allows users to access websites using easy-to-remember domain names instead of complex IP addresses.
A HTML doctype is a declaration at the beginning of an HTML document that specifies the version of HTML being used. Doctypes are used to ensure that web browsers display web pages correctly and consistently.
Different doctypes may be required for different versions of HTML.
A domain is a unique name that identifies a website on the internet. Domains consist of a name (such as google) and a top-level domain (such as .com or .org).
Domains are used to connect users to web servers using easy-to-remember names instead of complex IP addresses.
Document Type Definition (DTD) is a set of rules that define the structure and elements of an XML or SGML document. DTDs ensure that documents are structured correctly and consistently, and they are used to validate documents before they are processed.
E-Commerce, short for Electronic Commerce, is the buying and selling of goods and services over the internet. E-commerce websites allow customers to browse products, make purchases, and manage their accounts online. E-commerce websites require secure payment systems and are subject to regulations and legal requirements.
An elastic layout is a website layout that adjusts its width based on the size of the user’s screen or window. Elastic layouts can be useful for ensuring that website content is accessible and readable on a variety of devices, including smartphones and tablets.
An embedded style is a CSS style that is applied directly to HTML elements using the style attribute.
Embedded styles can be useful for making quick and simple style changes to individual elements, but they are generally not recommended for larger websites.
Extensible Markup Language
Extensible Markup Language (XML) is a markup language used for structuring and exchanging data between different systems. XML is similar to HTML in syntax but is designed for representing data rather than displaying content.
XML is used for a variety of purposes in website design and development.
A favicon, short for favourite icon, is a small icon that appears in a web browser’s address bar or tab. Favicon icons are usually 16×16 pixels or 32×32 pixels in size and are used to represent a website or web page. Favicon icons can be created using various image editing software.
Fixed Width Layout
A fixed-width layout is a website layout that uses a fixed width for all content, regardless of the size of the user’s screen or window.
Fixed-width layouts can be useful for ensuring that website content is displayed consistently, but they can make websites difficult to read on smaller devices.
The focal point is the main subject or point of interest in a visual element, such as a photograph or graphic. Focal points are often used in web design to draw attention to specific elements, such as a CTA button or a product image.
The fold, also known as the scroll line, is the point on a web page where the content becomes hidden and the user must scroll down to see more.
Above-the-fold content is considered more important, as it is immediately visible to users without the need for scrolling.
A GIF, short for Graphics Interchange Format, is a type of image file that supports animation and transparency.
GIFs are commonly used on websites to display short animations or graphics.
However, GIFs can be large in file size and may affect website performance.
A heading is a text element used to indicate the main topic or section of a web page. Headings are used to structure content and make it easier to read and navigate. HTML provides six levels of headings, ranging from h1 (the main heading) to h6 (a subheading).
A hero, also known as a hero image or hero banner, is a large, prominently placed image or video that appears at the top of a web page. Hero images are often used to introduce the website or promote a product or service.
A hex, short for hexadecimal, is a base-16 numbering system used in web design to represent colours.
Hex codes consist of six alphanumeric characters (0-9 and A-F) that represent the levels of red, green, and blue in a color. For example, the hex code #FF0000 represents pure red.
An HTML tag is a code element used to define different types of content on a web page.
HTML tags consist of angle brackets (< and >) and include attributes that provide additional information about the content. Examples of HTML tags include <p> for paragraphs and <img> for images.
HTTP, short for Hypertext Transfer Protocol, is a protocol used for transferring data over the internet. HTTP is used to request and retrieve web pages and other resources, such as images and videos.
HTTP is the foundation of the World Wide Web and is used by web browsers and servers to communicate with each other.
HTTPS stands for Hyper Text Transfer Protocol Secure. It is a secure version of the HTTP protocol that encrypts data sent between a user’s browser and a website’s server.
This ensures that sensitive information such as passwords, credit card numbers, and personal data is kept private and secure.
Hue is a term used to describe the colour of an image or object. It refers to the dominant wavelength of light that is perceived by the human eye.
A hyperlink, or link, is a clickable element on a webpage that leads to another webpage or a specific section of a webpage.
It is often underlined and displayed in a different colour to distinguish it from regular text.
Hypertext is a type of text that contains links to other text or media, allowing users to navigate and interact with the content in a non-linear way.
An icon is a small graphical representation of an object, action, or concept. Icons are commonly used in user interfaces to provide visual cues and help users navigate and interact with a website.
An iframe, or inline frame, is an HTML element that allows a webpage to embed content from another webpage within itself. This can be used to display videos, maps, and other types of content without redirecting the user to a different webpage.
An image map is a graphical element that contains clickable areas or hotspots. These hotspots can be linked to different web pages or specific sections of a webpage, allowing users to interact with the content in a visual way.
JPEG is a common file format for digital images. It uses lossy compression to reduce the file size while maintaining a high level of image quality. JPEG images are commonly used for photographs and other complex images.
A landing page is a specific webpage designed to capture the attention of visitors and encourage them to take a specific action, such as filling out a form or making a purchase. Landing pages are often used in marketing campaigns to drive conversions.
A link farm is a group of websites that exist solely to link to each other and artificially inflate their search engine rankings. Link farms are considered a form of spam and can result in penalties from search engines.
Markup refers to the use of HTML tags to structure and format content on a webpage. Markup is used to define headings, paragraphs, lists, and other types of content.
A menu is a graphical element that provides a list of options for navigating a website. Menus can be horizontal or vertical and can be displayed in various styles, such as dropdown or accordion.
Metadata is information that describes the content of a webpage but is not visible to users. This includes elements such as the page title, description, keywords, and author.
A meta tag is a specific type of HTML tag that provides metadata about a webpage. This includes information such as the page title, description, and keywords.
A mockup is a visual representation of a website or webpage design. Mockups are often used to communicate design ideas and gather feedback from stakeholders.
Navigation refers to the elements and techniques used to help users move through a website. This includes menus, links, buttons, and other graphical elements that provide cues and direction.
Nesting refers to the use of HTML tags within other HTML tags. This allows for the creation of complex structures and formatting on a webpage.
A non-breaking space is a character entity used in HTML and other markup languages to prevent the browser from breaking the line at that point. It is commonly used to ensure that words or phrases are kept together on the same line, rather than being split between two lines.
Opacity is a CSS property that determines the transparency of an element. An opacity value of 1.0 means the element is fully opaque, while a value of 0.0 means the element is completely transparent.
Open source refers to software that is released under a license that allows users to access and modify its source code. This enables a community of developers to collaborate on the software’s development and improvement.
A page view is a metric used to track the number of times a web page has been viewed by a user. It is commonly used by website owners and marketers to evaluate the popularity and effectiveness of their websites.
A permalink is a URL that links to a specific web page or post on a website. It is designed to be a permanent link that can be shared and used to access the page at any time.
A plugin is a software component that adds specific functionality to an existing application. In the context of web development, plugins are commonly used to extend the capabilities of web browsers or content management systems.
PNG is a file format used for storing digital images. It is a lossless format, which means that image quality is not compromised when the file is compressed.
A prototype is a preliminary version of a product or design. In web development, prototypes are often used to test and refine the user interface and user experience of a website or application.
Really Simple Syndication
Really Simple Syndication (RSS) is a technology used to distribute content from a website to other websites or applications. It allows users to subscribe to a website’s content and receive updates in a standardized format.
Resolution refers to the number of pixels displayed on a screen or image. A higher resolution generally results in a sharper and more detailed image.
Responsive design is an approach to designing websites that allows them to adapt to different screen sizes and devices.
This ensures that the website remains functional and visually appealing, regardless of the device it’s being viewed on.
Responsive design involves using flexible grids, layouts, and images, as well as using CSS media queries to apply styles based on the screen size.
RGB is a colour model that defines colours by specifying the amount of red, green, and blue light that creates them.
It’s an additive colour model, meaning that when red, green, and blue are combined at full intensity, white light is produced. RGB is widely used in digital media, such as websites, videos, and photography.
Rule of Thirds
The rule of thirds is a composition guideline that suggests dividing an image or layout into thirds both horizontally and vertically and placing important elements at the intersections of these lines.
This creates a sense of balance and visual interest in the composition. The rule of thirds is commonly used in photography, graphic design, and web design.
Saturation is a measure of the intensity of a colour, where higher saturation means a more vivid and intense colour, and lower saturation means a more muted and subdued colour.
Saturation is one of the three attributes that define a colour in the HSL (Hue, Saturation, Lightness) and HSV (Hue, Saturation, Value) colour models.
Saturation is often used in graphic design, photography, and web design to create visual interest and convey emotion.
Scale refers to the size of an object or element relative to other objects or elements in a composition.
In web design, scale is important for creating a sense of hierarchy and guiding the user’s attention.
A large element will naturally attract more attention than a small element, for example. Scale can also be used to create visual interest and convey meaning.
Schema is a markup language that allows web developers to add structured data to their websites.
Structured data helps search engines understand the content of a web page and can lead to enhanced search engine visibility and click-through rates. Schema is often used to mark up events, reviews, recipes, and other types of content.
A selector is part of a CSS rule that identifies the HTML element to which the rule should be applied. Selectors can be based on HTML tags, classes, IDs, attributes, and other criteria.
Semantic markup is HTML markup that reflects the meaning of the content on a web page. This makes it easier for search engines to understand the content of the page and can lead to improved search engine visibility.
Semantic markup is often used for headings, lists, and other types of content.
Server-side refers to code that runs on a web server rather than on the client’s computer. Server-side code is commonly used to generate dynamic content, such as database-driven web pages, and to process user input.
SGML stands for Standard Generalized Markup Language, and it is an international standard for defining markup languages. It was developed in the 1980s and is the precursor to HTML and XML.
SGML is a robust and flexible system for defining structured documents and is still used in some specialized applications.
SGML allows developers to create their own tags and document structure, making it a highly customizable system. SGML is used in industries such as aerospace, defence, and publishing.
Single-scroll refers to a website design where all content is contained on a single page that can be navigated using scrolling.
This design style has become more popular in recent years due to its simplicity and ability to provide a seamless user experience.
Single-scroll websites are often used for landing pages, portfolios, or smaller websites. They typically have a clear hierarchy of information, and users can quickly navigate to the relevant content without needing to click through multiple pages.
A slider, also known as a carousel, is a graphical user interface element that allows website visitors to scroll or swipe through a series of images or content.
Sliders can be used to showcase products, highlight features, or tell a story. While they can be visually appealing, they can also slow down a website’s loading time and may not always be user-friendly, especially for visitors with disabilities.
SOAP (Simple Object Access Protocol) is a messaging protocol used in web services. It defines a set of rules for exchanging structured data between applications over the internet.
SOAP is platform-independent and supports multiple programming languages. It uses XML (Extensible Markup Language) to encode messages and can be transported using a variety of protocols, including HTTP (Hypertext Transfer Protocol) and SMTP (Simple Mail Transfer Protocol).
SSL (Secure Sockets Layer) is a security protocol used to establish a secure and encrypted connection between a web server and a web browser.
It ensures that any data transmitted between the two is encrypted and can’t be intercepted by hackers. SSL has been replaced by TLS (Transport Layer Security), but the term SSL is still widely used to refer to the technology that secures website traffic.
SVG (Scalable Vector Graphics) is a vector image format used in web design.
Unlike raster images, which are made up of individual pixels, vector images are made up of mathematical equations that allow them to be scaled up or down without losing quality.
A tag is a keyword or label assigned to a piece of content, such as a blog post or image, to help categorize and organize it. Tags make it easier for users to find related content on a website and for search engines to understand what a page is about.
A template is a pre-designed layout or framework that can be used to create multiple pages or pieces of content with a consistent design. Templates can be used in a variety of contexts, including web design, email marketing, and document creation. Using templates can save time and ensure a consistent look and feel across different pieces of content.
TIFF (Tagged Image File Format) is a file format used for storing high-quality raster images, such as photographs or graphics.
TIFF files can be large in size, but they offer high resolution and can be edited without losing quality. They are commonly used in print design but are less common on the web due to their large file sizes.
A URL (Uniform Resource Locator) is a web address that identifies the location of a resource on the internet, such as a web page, image, or document. URLs consist of multiple parts, including the protocol (HTTP or HTTPS), domain name, and path to the resource.
Usability refers to how easy and intuitive it is for users to interact with a website or application.
Good usability means that users can easily find what they’re looking for, complete tasks without frustration, and navigate the site or app with ease. Improving usability can lead to increased user satisfaction, better engagement, and higher conversions.
In the context of web design, vector refers to graphics that are created using mathematical equations instead of individual pixels.
Vector graphics can be scaled up or down without losing quality, making them ideal for use in responsive web design. They are commonly used for icons, logos, and illustrations.
A web server is a computer program that stores and delivers web pages and other files to users over the internet.
When a user requests a web page, the web server sends the necessary files to the user’s browser, which then displays the page. Common web servers include Apache, Nginx, and Microsoft IIS.
Web standards are guidelines and best practices for creating websites and web applications. They ensure that websites are accessible, user-friendly, and compatible with different browsers and devices. Some common web standards include HTML, CSS, and accessibility guidelines like WCAG.
Whitespace, also known as negative space, is the area between design elements on a web page. It can be used to create visual hierarchy, improve readability, and make a design feel less cluttered. When used effectively, whitespace can improve the user experience and draw attention to important elements on a page.
A wireframe is a visual blueprint of a web page or application. It outlines the structure and layout of the page but does not include design elements like colour, typography, or images.
Wireframes are used to plan and communicate the basic layout of a web project before it is fully designed and developed.
XHTML (Extensible Hypertext Markup Language) is a markup language used to create web pages.
It is similar to HTML, but uses stricter syntax rules and is designed to be compatible with XML. XHTML was popular in the early days of the web but has since been largely replaced by HTML5.
XML (Extensible Markup Language) is a markup language used to store and transport data. It uses tags to define elements and attributes to define the properties of those elements.
XML is often used in web services to exchange data between applications and is also used in RSS feeds and sitemaps.