This web design glossary is primarily written for client purposes. It introduces lots of the technology and ideas related to our industry and the overlapping disciplines that you’ll need to know about. It’s pretty comprehensive but by no means complete, if there’s anything we should add just let us know. It’s not an entertaining read, but hopefully, it will serve a purpose.
Technology & Web Development
Basically, a computer, usually in a data centre (a big building with lots of servers), stores a website’s files and runs the software that enables a website to function. If you’re going to have a website you’ll need a server to host it on, which means getting your own server or using a hosting provider like us.
All websites need to be hosted somewhere. This is where the website is stored and made accessible to internet users. There are thousands of hosting providers out there. Hosting prices, packages and quality vary wildly.
For example, “hits.co.uk”, is usually the address of a site’s homepage. Different parts of the domain name can be referred to; the top-level part (.co.uk), the naked domain (hits.co.uk) and subdomains (priority.hits.co.uk). Domains can be bought from sites like GoDaddy for as little as 99p.
The web address of a single web page. URL stands for Uniform Resource Locator and is a human-friendly identifier for a webpage such as “https://www.hits.group/services”. It can be divided into several parts, the “protocol” (“https://”), the “domain” (“hits.group”), the “URI” or Uniform Resource Identifier (“/portfolio”)
Code that runs on your computer, in the browser, that basically defines what a webpage looks like to the user. This is what the customer/client sees when visiting your website.
Code that runs on a server defines how a site works. This is typically the CMS (Content Management System) of the website and is where you log in to update/change your site.
Code that holds the content of a webpage, and tells the browser about images, or anything else that the page should display.
CSS styles the HTML. So, it sets font colours, sizes, spacing, layout etc. Stands for Cascading Style Sheet.
Every time you connect to a website, a computer program runs, generates the website files, and sends them back to your browser. PHP is a popular language used for this purpose – around 80% of all websites use it. HITS only use PHP.
E.g.: priority.hits.co.uk – a secondary domain that does not need purchasing as it is a child of the main domain. Could be used to host a whole different website to the main domain. But for SEO purposes it will be seen by Google as a totally different site, so won’t benefit from any domain authority from the parent domain.
A text file on a website that lists all the pages/URLs on that website to help search engines find and index the whole site.
Think Microsoft Access or Excel – big tables of data that are quick to read, save and update with code. Databases are divided into “tables” (think excel worksheets), “columns”, and “rows” (like excel again). Asking a question about a database is called “querying”. Most of a website’s content is stored in a database and can be edited via a CMS, frontend website functionality often saves data to a database (think form submissions or editing account details.)
Content Management Systems exist to enable non-developers to easily manage and maintain a website. Most modern websites are managed via a CMS. HITS only work with WordPress & WooCommerce.
The world’s most common CMS. It’s a great all-around CMS, great for basic publishing, easy to work with, and very adaptable in terms of adding functionality such as ecommerce.
A digital bridge between a website and a third party is used to process payments. This gateway allows secure communication between both to exchange transactional information. For example, Stripe & PayPal are both leading payment gateways.
An API (application programming interface) is a list of things something allows you to do when interacting with it. The buttons on a vending machine are a physical form of an API. They dictate what you can and can’t do with the machine. APIs are used to integrate a website with an external website or software. This could be to feed enquiries taken through a website into a CRM like Salesforce, or passing an order status to a website from a stock/order management app.
Like a phonebook, it will convert a name (domain) into a phone number (IP address) which is then pointed to a receiving server.
Saving a hard copy of stuff that is time-consuming or complicated to fetch or load afresh each time it’s needed. Caching can be used to speed up slow web pages but could mean that the page is not totally up to date.
SSL (Secure Sockets Layer) is a way of encrypting information transmitted through a network so others cannot see it. A website needs an SSL Certificate in order to use SSL. The little padlock you see in your browser address bar indicates that a site uses SSL and is therefore secure. HITS include SSL Certificates on all client sites.
A tiny file stored on your computer when you visit a site, so that the site can check for the file on subsequent visits and do things like track visits, remember your login, etc
Hard coding is the process of writing things in code that cannot be changed from outside the code. This is generally bad practice as it means any changes must be done by developers. A better way is to be able to define information in a data store that can be altered from outside the code, such as via a CMS.
The bit of a web address that comes after the domain. E.g. hits.group/blog/this-article
The small graphic displays in the browser tab when on a website or when saved as a bookmark on mobile.
Content Delivery Network – a third-party hosting solution, usually for images, media and third-party scripts, served faster/separately from the main site. Used to speed up sites or store large amounts of images.
SEO & Digital Marketing
Search Engines & Results
Google, Bing, Yahoo etc. Google has over a 90% market share at the time of writing so when we use ‘Google’ we usually mean all search engines. Search results are the list of links with descriptions that you see when you perform a Google search. If you don’t know this already, give up!
Stands for Search Engine Results Page – the page in Google etc where search results show in a list.
Search Engine Optimisation – the process of controlling what search terms you rank for and elevating wherein the results you appear.
Your site’s position in the search results.
These are the terms/phrases that users type into Google, and site owners/businesses want to be found for, such as ‘web design’, ‘web design Hampshire’. If you don’t have a page on your site where you talk about web design in Hampshire, it’s unlikely you’ll feature in the results for a search for that term. But don’t abuse this or you will be punished, Google doesn’t like being manipulated. Your web pages should focus on providing good information that’s genuinely useful to users who are performing those searches. Think about why users are searching for a term… what information or answers are they looking for. Fill your site with info like that and Google will reward you by sending users to you.
This is the process of researching what keywords and search terms have value for a given website… What are your potential customers searching for, what are all the variants of those terms and phrases, and what do you want to be found for? This includes both short and longtail terms. Of all the terms that have value for you, which are most valuable, which are more competitive, which are less so? Keyword research should inform a website’s structure, content and SEO strategy.
Longtail Search Terms
“Bespoke Ecommerce Web Development Hampshire” is an example of a longtail search term. These are the highly specific terms that users search for in Google, usually when they know precisely what they’re looking for. When it comes to SEO, longtail terms are much easier to rank highly for but get fewer searches.
This just means the links on your pages that link to other pages on your site. Good internal linking helps Google to understand what pages on a site are related to what subject matter. Don’t confuse Google by having multiple pages on your site all about ‘Bespoke Ecommerce Web Development Hampshire’, that you link to with that term – your pages will compete against each other for Search Engine relevance, which is bad.
Search engines constantly ‘read’ all of the content on all of the websites they can find, and they maintain a ranking for every site out there. This is called domain authority and many factors contribute to it. The age of your domain (older is better), how often new content is added, volume, quality and relevance of backlinks, how good your site is at satisfying users… all these things are tracked by Search Engines and improve your Domain Authority.
Information about a page that’s not visible to users, it’s contained within the HTML of a page. It’s there to help search engines understand what a page is about. Meta Keywords are largely redundant in modern searches but page titles and meta descriptions are still used.
Every page should have a page title for SEO purposes. It tells users and search engines what a page is about. Page titles should be short and direct. They should only target one ‘keyword’ or phrase. Page titles are visible to users in the tab of the browser window.
Backlinks & Linkbuilding
Backlinks are links to your site from other sites. The process of acquiring backlinks is called link building. Search engines view backlinks as a vote of confidence in your site, so they’re great for SEO. In general, the more backlinks you have the better, but the quality (and context) also matter. A link from a major news network site is more valuable than a link from a food bloggers’ site. Relevance also matters, a link from an industry-related site will likely benefit you more than a non-industry related site. Some backlinks are bad. Sites that have a history of manipulative SEO techniques will actually damage your SEO ranking.
This is content that when published to a section on your site, a snippet or intro of that content automatically shows on other pages in other sections of the site. This is handy because Google likes to see content being updated on a site.
This just means putting new words, images, and pages on your website. This is one of the most important factors that Search Engines use to rank a site for search terms that are aligned with the subject matter of the content in question. Be warned, you cannot cheat the system! Your content must be of good quality and written with users in mind.
Stands for Pay Per Click, a form of online advertising via search engines. Essentially this is a way to acquire traffic, where you pay the search engine a given fee (10p to £20) per user that clicks on your advert. Adverts appear at the top of the Search Engine Results Pages.
A free Google tool that allows web admins to check the Indexing of their site, check for search ranking issues and check keyword search impressions and clicks.
Google is very secretive about the precise calculations and measurements it uses to rank websites and web pages. Every now and again they make a major change to how they do this. These Algorithm Updates can have a major impact on a site’s position in search results. Remember, Google is always changing in order to serve the best and most relevant results to users, so focus on making your site as good as it can be for users rather than search engines, this way you are much less likely to fall foul of an Algorithm Update.
Blacklisting is when a site is deemed to be a security threat and is removed from the Google index, meaning it will not appear in any search results.
Black-hat refers to the naughty techniques that some SEOers use that are disliked by Google. These include things like keyword stuffing (overuse of keywords on your site/page), using invisible text (white text on white background), and bulk-buying backlinks. Google will punish sites that use these techniques by moving them down in their rankings or even Blacklisting them.
The new data privacy laws that came into effect in 2018, dictate how companies store, share, acquire and dispose of customer data. This means directly asking for permissions for certain activities when capturing user data.
This is an error code that users experience when a page does not exist. Links that send users to these pages are called Broken Links.
Alt-text is a form of Metadata that provides a description of an image, primarily for screen readers, and for displaying if the image itself can’t be loaded for some reason. Alt-text is also read by Search Engine Robots and contributes to Google’s reading of a page, so can impact SEO. Alt text should be descriptive and genuinely useful for anyone who can’t see the image. Use keywords but don’t abuse them, focus on usefulness for the visually impaired etc.
A Landing Page is any page that a user arrives at a site on, so any page of a site can be a landing page. Landing Pages are also targeted destination pages when marketers are in control of the entrance point of a user, such as via a PPC campaign.
Indexing, Spiders/Robots & Crawling
Google uses spiders/robots to ‘crawl’ the internet, in general, the pages they find are added to the Google index, which means they can be returned as a search result on Google.
Design & Website Anatomy
UI (User Interface)
This is the thing that the user sees and interacts with. On the web, this usually means all aspects of a website that the user can see.
UX (User Experience)
This is the experience that the user has when accessing and using the website. So how easy and pleasing a website is to use.
A diagrammatic representation of all the sections and pages within a website, which shows where the areas/pages exist within the website and the navigation structures.
A page on a site exists as a template. Multiple pages can use the same template. So a 100-page site might only have 2 templates.
All of the text, images and videos on a given webpage or site.
Usually, the top area of a website, contains the company logo, main navigation, phone number
Usually, the bottom area of a webpage consists of links to internal pages including legal information etc, Copywrite info etc.
Most websites have many pages that are organised into sections according to the subject matter, each section comprising several pages. Links to these sections and pages usually exist in the same place across all the pages of a website, to help users access information efficiently, this is the site’s navigation.
Banners tend to be found on important pages such as home pages and immediately beneath the Header. They’re often combined with a company’s lead marketing message or important website functionality. There has been an overreliance in web design to use Banners, with little evidence to suggest that they improve site performance/user experience.
Call To Actions
A Call-to-Action is anything on a website that asks the user to take an action. Usually, this is something such as ‘buy now’, ‘call us today’, ‘order now’, ‘don’t see what you’re looking for? Call us now on xxx’, ‘ready to give it a try? Start a free trial now’.
An element for capturing data from users, consisting of various types of Input fields, and a way for the user to submit/save/send etc. their inputs.
A standard website function consists of a text field and a search button. More advanced searches will include additional fields.
A Lightbox is an element that opens on top of a webpage and usually involves darkening the below page with an overlay of transparent grey or black, with a panel on top that displays content. Think of how image galleries show on Facebook.
Accordions & Expanding Content Areas
Sections that are user expandable and collapsible to show or hide content.
A large Dropdown that presents many navigation options to a user, opens when a Main Navigation item is hovered over or clicked. It’s different to a Dropdown in that more options are present and it’s larger on the screen.
An element of a page that temporarily holds a fixed position within the browser window.
An element that is permanently fixed in position relative to the browser window, such as a background image that doesn’t scroll out of frame, or a live chat button (that are often fixed in the bottom right of the browser frame.
This is what we call a website that takes payments from users. This is usually when buying products, making bookings or buying access to something such as an eLearning subscription.
The (usually) multistage process of completing a purchase or order.
The page where users can see all the items they’re buying/ordering.
Responsiveness is when a website changes its structure/appearance/layout/content in order to give an optimal experience to users, whether they’re on a desktop computer or phone. This means users don’t need to pinch and zoom a website on a phone to read it properly. It usually means the website text will changes sizes, the pages will narrow, and menus change the layout in order to fit on small screens.
Breakpoints are the specific sizes of a Viewport, at which a website’s structure, layout or content changes in order to optimise the user experience. They’re defined by CSS Media Queries, and a typical responsive site will have several breakpoints. Normal breakpoints tend to follow standard device resolutions i.e. 320, 375, 550, 768, 1024, 1200px (width in pixels).
Usability is the ease with which a user can use a site. It’s a scale, not a binary thing. It’s wide-ranging, covering text sizes and contrast, copywriting, and functional processing such as how errors are handled on a form.
Accessibility is the practice of making websites accessible to all users, which means users with vision problems (partially sighted, colour blind, or generally poor vision), physical disabilities such as tremors, users who require assistive technology such as screen readers, deaf users, or users on slow internet connections (very common in certain parts of the world.)
The small links under the Header that show the containing sections of a given page are usually displayed as ‘home > category > subcategory > current page’. These exist to help users navigate and understand site structure.
JPGs and PNGs are the most used image types online. PNGs have the advantage of supporting transparent pixels and do not lose quality, JPGs do and can’t support transparency. HITS tend to convert all website images to a new format called WebP automatically. WebP is 30% smaller than JPG without any noticeable quality loss.
JPGs and PNGs and GIFs are raster filetypes, which means they are composed of pixels and lose quality when enlarged (they become blurry), vector files (SVG, AI or PDF) are not composed of pixels and can be infinitely scaled up without any loss in quality, they can’t, however, contain detailed colour information, like a photo, can. Vector file types are most commonly used online for icons and logos.
Copyrights mean that we can’t legally use images that don’t belong to us. So, you can’t just use an image on your site that you find in a Google image search. Creative Commons licensing is a legal system of licensing that dictates what images can/can’t be used.
Images that can be purchased for use online/offline. You essentially are buying a digital licence to use these images.
We use this to describe a website without complex functionality, that serves as an online brochure for a company. These websites usually have pages like Services, Case Studies, News, Contact us, and don’t have any ecommerce functionality.
An iframe is something we can use to show a part of a different page or site on a given page. It’s like a window we can put into a page, and in that window, we show another or part of another page.
The use of page numbers to navigate through pages of articles/products etc.
Analytics & Conversion
A conversion is the successful completion of the desired action on a website, such as buying a product, sending an enquiry, subscribing to the newsletter etc.
Conversion Rate is the number of successful conversions expressed as a percentage of the total number of visitors in that same timeframe. For example, if your site had 1,000 visitors last week and you got 15 enquiries, your conversion rate is 1.5% (15/1000)*100)
Google Analytics is a free online tool provided by Google. When set up on a website it allows website owners to see data about the website and its visitors, such as how many visitors there are, what pages they look at, or don’t, how long they stay on the site, right through to what type of devices they were using, the size of their screen, and the browser they used. It’s useful in helping us or website owners understand where their site is succeeding and where it’s failing.
Metrics are the type of measurements and data that Analytics track. Examples of these are Bounce Rate, Visitors, Unique Visitors, Time on Site etc. etc.
Bounce rate is a metric in web analytics that means a user that visits your site then leaves before looking at a second page. A typical bounce rate is around 30-40%, although this can change drastically from site to site. It’s possible to do much better than 40%.
Time on Site
Time on site is an analytics metric that means the total duration of a given Session, usually expressed as an average.
Traffic just means users that visit your site.
A Session is basically the same as a Visit, it begins when a user lands on your site and ends when they leave. A single user can have several Sessions of Visits.
Average Order Values
This Analytics metric is the average value of purchases made on a site over a given timeframe. Increasing the Average Order Value of a site is a great way to improve the performance of a site without increasing the Conversion Rate. Better product recommendations during checkout are an example of how you could increase the average order value. This would have no effect on Conversion Rate.
Revenue Per User
This is the amount of revenue taken per visitor to a site. It’s a key metric for any ecommerce site because it takes into account both Conversion Rate and Average Order Value. For example, if you double the Conversion Rate of a site but Average Order Values drop by half, the site is generating the same value of orders as it was before so the Revenue Per Visit has not changed, likewise if you double the Average Order Value but halve the Conversion Rate.
Analytics Events can be used to track something that doesn’t get tracked by Google Analytics as standard, such as a certain user interaction such as a button click. The site basically ‘pushes’ an Event to Analytics when the given action takes place on the site, then includes this data in Analytics reports.