As we talk to more and more small business owners when helping them with their website design and development, we find there is terminology that we may use, but may not be common outside of the digital agency world. In the spirit of educating small business owners we have created a pocket dictionary that covers many of the most popular website design terminology that a design company or digital agency may reference.
Yes, there are many web design glossaries and dictionaries that explain many aspects of design and development, yet none are written in a way that speak to small business owners who may need help understanding basic foundational web design terms.
When compiling this list of web design vocabulary (which is an ongoing process), we tried to avoid jargon and buzz words, and instead focus on real world vocabulary that designers and agencies use.
Web Design Pocket Dictionary and Glossary
The .htaccess, or Hyptertext Access file, is a configuration text file that controls the directory, as well as any sub-directories, where it is located on an Apache web server. If you use a Linux-based web hosting plan, your web properties likely run on Apache. You may have seen the .htaccess file in certain directories, particularly if you have deployed WordPress, Joomla, Drupal or any other content management web software.
The .htaccess file can include specific instructions to the server. This file can configure the server to require a password for the directory where it resides. The .htaccess file can also be configured to automatically redirect users to another index file or site, restrict or allow users based on IP addresses and disable directory listings. You may never need to edit the .htaccess file, but if you do, you must make sure that the file is named “.htaccess” only, with the period in front and no .txt or .htm file extension. Accomplish this in Windows by placing quotes around the file name.
A 301 Redirect is an instruction to the server to permanently redirect one URL to another URL. Users and search engines that request the first URL will automatically be sent to the second. The benefit of using a 301 Redirect versus another redirect method is that the 301 Redirect passes most of the “link juice” to the site located at the second URL. This means that you can retain the first URL’s SEO ranking power while passing traffic to the second URL. 301 redirects can be used when moving a site to a new domain, cleaning up dynamic URLs and preventing duplicate content.
A 302 Redirect is an instruction to the server to temporarily redirect one URL to another URL. This method passes none of the link juice to the second URL and is not optimal for retaining SEO ranking. There are very few situations that call for 302 redirects. One reason might be to temporarily send users to another site while the original site is under maintenance.
The 404 Error is an HTTP status code that indicates the page you were looking for cannot be found on the server. Many times, the 404 error is the result of the user typing the wrong URL or including a typo in the string. However, web pages do occasionally get deleted and moved, so if you verify that you have requested the correct URL and you still get a 404 error, the page is not available server side. 404 Error pages can be customized to reflect your site’s design and the text you want to display.
Above the Fold
In newspaper publishing terminology, “Above the Fold” means just that: content that is visible on the front page, above the fold. In web design, “Above the Fold” refers to content that is visible on the web page as soon as the page is rendered in a browser, without the user scrolling up or down. Above the Fold is the first content the user typically sees on a website. Web design experts recommend that you have a clear message about your product or service above the fold on your website.
The Anchor Text is the clickable text characters within a hyperlink. SEM, SEO and Google best practices dictate that the clickable anchor text must relate to the destination page to which the link refers. In other words, the anchor text should be relevant to the destination page and not just some generic characters. Search engines utilize anchor text to determine the content of the linked-to page. If anchor text is not relevant, the page’s search engine ranking score will be decreased based on the lack of link relevancy.
Back End Developer
The Back End Developer, also known as the server side developer, is responsible for the server, applications and databases that support the front end of the website. The front end of a site consists of the pages that are visible to users. On the other hand, the back end includes database code and the code that links the front end components to the database. Programming languages typically used by back end developers to write code include PHP, Java and .Net. Back end developers also use database tools like MySQL and SQL Server.
Bandwidth in computer network terminology refers to the data transfer rate of a connection. Think of bandwidth as analogous to the plumbing in your house. Water can only flow out of the faucet at a rate that is supported by the dimension of your pipes. The larger your pipes, the more water can pass through the faucet at any given time. If your Internet connection provides a lot of bandwidth, data will transfer over the connection at greater speed than on a slower connection. This is why you can download files and videos much faster over a broadband connection than you can over a dial-up connection.
In web design, a breadcrumb is a navigation strategy that enables the user to follow a logical pattern, and to backtrack or move around freely within a page hierarchy. Breadcrumbs provide the user with an alternate method of navigation so he is entirely reliant on coded menus and sub-menus. Breadcrumbs can be path or location based. They can be auto-generated by applications like WordPress, or they can be manually implemented, perhaps in a side panel.Implementing breadcrumbs enhances the usability of a site.
Caching is the temporary storage of web elements, such as web pages, images, videos and files, to offload the web server. The cached content is temporarily stored in an area of a computer’s hard drive designated for this purpose. When you first visit a web page, the content is downloaded onto your machine. The web content is stored on your hard drive so that when you access the page subsequent times, the page loads in a fraction of the time it took to load during the first visit. Caching improves page load times and the efficiency of the computer.
Cascading Style Sheet
A Cascading Style Sheet, or a CSS, is a coding component that adds or changes the style of a web page. CSS can alter fonts, page colors, the location of images and text, as well as the placement and appearance of other design elements. In CSS, style sources are rendered in the order of precedence. You can use CSS to define variations of a web page for different screen sizes and devices.
CMS is an acronym for Content Management System. A content management system is a web application that enables page publishing, editing and management without the need for coding or programming skills. However, a seasoned programmer can customize pages within the application. CMS applications use a centralized interface for all administrative functions, including editing and publishing, user management, advertising and banner management, membership management and workflow control. Most CMS packages also include indexing, search functions and revision management. Popular open source CMS applications include WordPress, Joomla, Drupal, DotNetNuke and ModX, though many more are available.
The Description Tag is the metatag coded into a web page that describes the content of the page. The description tag is very important because this tag contains the text that displays in search engine results for your website. In other words, when you search Google, the results page displays a series of links, each with a block of text underneath. The description tag provides the text that displays for your site in the SERPS. The optimal length for the description tag is approximately 150 characters, including spaces.
A Dropdown Menu, also known as a dropdown box or list, is a menu of options that appears when you click on an element, such as a link or button, in a web page or an application. An example of a dropdown menu that most of us have had some experience with is the Expiration Month box when you enter your credit or debit card information on a shopping site. When you click on the Expiration Month box, a list of the 12 month options appears.
Faceted Navigation is a strategy for filtering web content, for example, by price range or color. Though this strategy is beneficial for users, it is not search engine friendly because many near duplicate pages are required. Duplicate pages dilute search engine indexing signals so not all pages are crawled.
The Favicon is the tiny icon that appears next to the page title on a browser tab or bookmark link. Sometimes, the favicon appears in front of the URL in the browser’s address bar. Favicons also appear in the bookmark list, in front of the link to the bookmarked page. Some search engines, such as Duck Duck Go, list favicons next to site links in the results pages.
The dimensions of a favicon are 16 x 16 pixels, and they must have the “.ico” file extension. Many companies use a variation of their logo for this icon. The favicon is a great way to brand your site while making your site easier to identify when several tabs are open in a browser.
The Font Family, also known as the font face, is the typeface that appears in the web browser to users. Font Family is also a presentation attribute that is applied to text in CSS and formerly in the deprecated HTML “font” attribute. Examples of options for the Font Family attribute include Times New Roman, Verdana and Lucida.
Font Style is a font face variation, such as bold, opaque or italic. Font Style is also an optional property for the CSS Font object.
Font Weight specifies the thickness of the text characters between the standard Normal and Bold options. Though some fonts are only available in Normal or Bold weight, you can specify a Font Weight between Normal and Bold in most font families.
The Footer is the block of content at the bottom of a web page. Content that is often displayed in the footer includes the company’s address and contact information, legal disclaimers, alternative site navigation, copyright information and sometimes, web design credits. Some sites use the footer to include spammy links for SEO, but this is not advised as Google will reduce page rank to penalize these sites for keyword stuffing. Web design experts relay that the footer is as important as the footer because the footer is the first place users tend to look for additional information.
Front End Developer
Google Analytics is a free web analysis tool provided by the search engine giant that measures website performance and traffic. The tool tracks market segmentation and conversions, data visualization apps and custom reporting. You must have a Google account to gain access to the service. Use Google Analytics to evaluate and enhance your site’s SEO.
Google Webmaster Tools
Google Webmaster Tools are a suite of free applications for webmasters and marketers to maximize the reach of their web properties. Use the tools to see how your pages are performing on Google, submit a sitemap to search engines, edit the robot.txt file and identify high performing keywords. You must have a Google account to gain access to the service. The Google Webmaster Tools suite has recently been rebranded as Google Search Console.
Hosting is the service provided by web hosting companies that allows you to store and publish your web content on server space so that the world can see your website. If you do not have your own web server, you can essentially rent space on a server with a web hosting company. Hosting plans vary in price. Larger web properties with thousands of daily visitors will pay much more for their web space than smaller websites with a limited number of users. Most hosting companies offer both Linux-based and Windows-based hosting plans. Those who have Linux-based plans rent space on Linux web servers, and Windows plans provide space on servers running the Windows Server operating system.
The HTML sitemap is a bulleted, text version of the hierarchy of the website it represents. Each line in the sitemap links to a reference page within the site. An HTML sitemap is an effective tool for SEO, accessibility and internal linking purposes. Additionally, an HTML sitemap assists users in navigating the website. Note that the HTML sitemap differs from the automatically-generated XML sitemap.
HTTP is an acronym for Hypertext Transfer Protocol. This protocol is the foundation for data transfer and communication for the Internet. When you type a URL into a web browser, the URL is prefaced with an explicit or implied “http://” command, which is actually a command that is interpreted as a request and acted upon by a web server. The URL commands the server to fetch, transmit and display the requested page in your browser.
HTTPS is the secure HTTP transport protocol. HTTPS is also referred to as HTTP over Transport Layer Security (TLS) and secure HTTP. HTTPS encrypts and decrypts web page requests and returned pages to guard against hacking and eavesdropping. Any time you send your financial information over the Web, ensure that the URL you are sending the data to uses the HTTPS protocol.
Image Alt Text
The Image Alt Text is the text that is added to the Alt attribute for the image (Img) element. Image Alt Text is important for making web pages accessible to all. Many visually impaired users utilize screen readers to audibly read text on web pages. Image Alt Text enables the screen reading application to describe the images to the user. To ensure maximum usability, author image alt tags that provide succinct yet descriptive and useful content. Additionally, developers can use Image Alt Text as an SEO element to enhance page ranking.
Image Title Attribute
The Image Title attribute is a tag that consists of a line of text in the Img object to identify an image on a web page. The Image Title attribute displays as a tool tip when the user mouses over the image. Additionally, screen readers can use the Image Title attribute to define and clarify images to visually impaired users. You can improve your site’s search engine performance by specifying both the Image Title attribute and the Image Alt attribute for images.
An Inbound Link is a hyperlink that links to your site from another website, also known as a backlink. Pages with a high number of quality backlinks tend to rank higher in search engine results pages (SERPs) than those without relevant inbound links.
Inline Style Sheet
An Inline Style Sheet is an HTML and CSS style that is applied to a specific tag. If you have one page or element that differs from the style of the rest of the site, you can use an Inline Style Sheet to specify the style for the single page or element.
An Internal Link refers to a link to another page, document or resource that resides on the same site or within the same domain.
Keyword Research is the process of determining which keywords are in high demand for your business or service. Keyword research can help you find the optimal keywords to ensure that your site is found by potential customers. You can use the free Google Keyword Planner tool to help you identify effective keyword phrases if you have a Google account.
A Landing Page is a stand-alone page designed to drive traffic to your existing site. Landing pages are a marketing tool, and these pages can be designed to maximize traffic to your site or to optimize conversions.
A Link Farm is a site or group of sites that hyperlink to all other sites within the farm. These link farm sites are designed to improve search engine ranking. However, Google takes a dim view of this strategy and will de-list sites that are deemed to be members of a link farm.
A Logo is a graphic emblem, sign or symbol designed to identify a company, product or service. Logos enable customers and potential customers to quickly identify a brand.
A Megamenu, also known as a dropdown interface, is a large menu that displays when the user hovers over a defined area on a web page. This menu displays all options available to the user. These options are often grouped into categories.
Meta Keywords Tag
The Meta Keywords tag is the metatag web page attribute that specifies a group of keywords relevant to the site. Search engines do not currently place much weight on the meta keyword tag. In fact, some search engines use this tag to identify keyword spam.
Meta Tags are lines of text that describe the web page’s content. Meta tags do not affect how the page displays to the user. However, the Description metatag is shown in search engine results to describe the site.
A Mobile Friendly site is a website that displays correctly on mobile devices like tablets and smartphones, as well as on desktop computer screens. Many sites that are mobile friendly are also responsive, meaning that they respond to the size and type of screen on which they are rendered to ensure that the site displays correctly on all devices.
An Outbound Link is a hyperlink that links to an external page, document, website or domain.
A permalink is a permanent link to a specific blog post or web page. Permalinks are often utilized in blogs, WordPress and other CMS packages where posts may appear on the front page of the site, but will eventually move off the front page to make room for new content. Use the permalink instead of linking to the front page of the site in order to send users to individual posts and pages.
A Plugin is a small piece of add-on software that extends the functionality of a browser or a CMS package, such as WordPress. The plugin adds a specific set of features that were not available with the default installation of the browser or package. You can install plugins to a WordPress or other CMS installation that will greatly increase the functionality of your site, such as the implementation of analytical tools, custom contact pages, Google maps and even shopping cart functionality.
A website’s Primary Navigation is the main navigation menu for the site which is usually located at the top or in one of the sidebars. Typical components of a primary navigation menu include links to the Home page, the Contact page and an About Us page.
Qualitative research deals with descriptions that can be observed but not measured. Examples of qualitative research would be smells, tastes, appearance, design quality, friendly customers. It emphasizes the importance of looking at variables in the natural setting in which they are found.
It uses in-depth studies of small groups of people to guide and support the construction of hypotheses. The results of qualitative research are descriptive rather than predictive.
An example everyone can relate to, let’s use coffee. Qualitative data would be variables such as: robust aroma; frothy appearance; strong taste; red cup.
Quantitative research deals with numbers and data that can be measured. Examples of quantitative research include length, height, area, speed, page views, website visits, cost – much of the data points you can get from Google Analytics or other analytics programs you use to measure your website.
An example everyone can relate to, let’s use coffee. Quantitative data would be variables such as: 12 ounces of Starbucks coffee; serving temperature 150º F.; serving cup 7 inches in height; cost $4.95
Responsive Design is a web design strategy that seeks to provide an optimal viewing experience of the website on any device. The well-designed responsive web page is easy to navigate and easily read on any screen without scrolling or panning. The responsive site responds to the type of device on which the site is displayed.
The Robots.txt file is an exclusion protocol that signifies to search engines that the directory in which the file resides should or should not be crawled. You only need to include this text file if there are portions of your website that you do not want to be indexed by search engines.
This file can also be used to define where Google and other search engines can fine your xml sitemap. This is defined by using the following line in the robots.txt file (replacing the path with the exact path of your sitemap file):
Secondary Navigation refers to a navigation menu located anywhere within the site, such as a sub-header or in the footer of the page. Secondary navigation menus may also be displayed in sidebars.
The Sidebar is the area located on the right or left of the main web page content. In WordPress, the sidebars are widget-ready areas that can be used to display contextual information about the main content, secondary navigation menus or any other relevant content.
A Slider is utilized to display a slideshow on a web page, often on the Home page of a website. Sliders display a series of images in timed intervals. However, developers and designers must be mindful of the time these devices may add to page load time.
The Title Tag is the metatag that defines the title of a web page. This tag specifies the text that displays in a browser tab when the site is open in a browser. The Title tag is also very important for SEO. This tag should concisely and accurately describe the website or page.
It is defined by adding the following (replacing what is between the tags with what you want your page’s title tag to be):
<title>This is where your content for your title tag goes</title>
The term “URL” is actually an acronym for the phrase Uniform Resource Locator. The URL is the identifier for a web address on the Internet. Web pages, images, videos and all other web content are accessed by invoking their specific URLs in a web browser or application.
Usability is a term used in software development that describes the ease of use and the learning curve required to navigate a specific web property or software application. Developers should strive for a high level of usability where the software meets the needs and expectation of users.
A Vector Image is a path-based graphic that is defined by mathematical expressions using primitive elements like lines, points and shapes. Vector images can be resized without forfeiting image quality.
A Web Server is actually a software program that processes the HTTP and HTTPS requests, however, the computer hardware used for serving web content may also be referred to as a web server.
A Website Designer is a specialized version of a front end developer. The website designer, also known as the web designer, generally possesses both creative and technical skills. This type of designer codes the page layout, style and design elements of a web page.
A WordPress Theme is a group of files that produce a unified look and feel to a WordPress site. The theme changes the way the site appears to the user without changing any of the site’s functionality. Many WordPress themes are available free of charge at the WordPress.org site. You can easily swap themes in WordPress from the administrative interface with just a few clicks, as long as you have the permissions to do so.
An XML Sitemap is a map that shows search engines the hierarchy of content pages contained within a web site that should be crawled. Unlike the HTML sitemap which can be a tool for user navigation, the XML sitemap is exclusively for search engine use. You can install various WordPress plugins to auto-generate XML site maps for WordPress sites.