Useful Website Terms To Know

How many of us have thought WTF has my web developer just said, or wondered WTH does that mean and how do I fix/put that on my website? You’re not alone, most people just don’t admit it. After being asked to translate ‘techy’ into laymen’s terms by most of my clients, I started to create (and constantly update) this handy translation guide full of useful website terms we’d came across.

This ‘useful website terms to know’ guide may not detail everything, but it’s a darn good place to start.

Accessibility

This focuses on how accessible your website is for people with disabilities. Disability guides, simple copy and larger icons help end-users navigate the site. It’s usually more prominent on Government or Healthcare websites but should be considered across all website as good practice.

Above the fold

When a website first loads up, anything that is seen on that screen without the user scrolling down is called ‘above the fold content’. A good website will have been designed with something near the bottom (before you need to scroll down the page) which can entice the end-user to scroll down and view more of the website.

Agile

Agile is a methodology and a way that some web agencies work. It’s great for when you have a set budget but still need certain aspects to be completed within that budget. To work Agile, you need to figure out and prioritise what your top aspects are, and then (with your agency), what can be completed within your budget. This way of Agile working allows you to stay in control whilst providing flexibility within the boxed time (and
budget).

AJAX (Asynchronous JavaScript And XML)

AJAX allows the page you are viewing to complete specific actions without having the end-user to have to go to a different
page, e.g. allow an end-user to add a product to the cart while staying on the catalogue page. This can lead to a better experience for the end-user and help the server load too.

AMP (Accelerated Mobile Pages)

Accelerated Mobile Pages load faster as Google Search will retrieve the page from the Google AMP Cache, enabling a variety of load optimisations that often make the pages appear instantly, such as pre-rendering. It currently only works on mobile devices though. You can read more about it on my guide: https://www.linkedin.com/pulse/what-heck-amp-freya-swenson-costello/ .

ALT attribute

This is used to specify the alternate text that is displayed inside the image placeholder while the page is loading. The ALT text helps optimise a website for search engines, overall web accessibility and ADA compliance.

Analytics

Analytics is a term that refers to numerical data tracking on your website visitors and end-users. With analytics, you’ll be able to see a variety of data such as how many people are visiting your website, which pages are most popular, where people visit from geographically, their related interests and much more. Analytics will tell you what is happening on your website, what’s working and what isn’t so you know where to tweak and make improvements.

API (Application Programming Interface)

An API is a set of ‘Simon Says’ instructions used by code so it knows to behave in a specific way. An effective API will set out definitions and
protocols should certain actions be triggered e.g if a user selects option A when filling out a form, their data gets stored in ‘option A’ users.

Application

This is the process of writing and maintaining the source code.

Atomic Design / Kitchen Sink

This is a methodology for creating a design so the designer can focus on the smallest piece and build it together with other aspects to make larger sections. It can be broken down to 5 different areas- Atoms, Molecules, Organisms, Templates and Pages.
If we use a CTA button as an example, the designer will start with the atoms of the design and work out what font should be used and colour etc of the button. Next, they move to molecules and work out that the CTA needs to function as a button. Then they look at the organisms and see that the CTA would be best in the header section with the site name and logo before adding it to the header template section. Finally, they look at the page itself and add all the blocks together. When these sections are designed, they fall into a kitchen sink, meaning each aspect is pre-populated and can be changed on mass (e.g the font or colour) and makes building the site easier and more consistent in feel and look.

Back end

This is what is running in the background and powers your website. It consists of three parts: a server, an application and a database. It’s what makes your website run and without it, there’s no website.

Back up

A backup is a copy of something so the history of it can be reused should the worst happen and gets wiped/ goes down. It’s always recommended that anyone with a website backs it up on their computer, server and anywhere else that stores information regularly. Can your business afford to lose an entire day (or longer) of work should something go down? However long you can spend re-completing work, is how long you should have between backups.

Block

When building a website, imagine each area is built in blocks (like Lego). Each block will contain a function (e.g menu, newsletter signup form, contact us, hero image etc) and they all fit together to create a web
page.

Breakpoints

This is the pixel points at which a website’s content will adjust to provide the user with the best possible layout to view content. Different devices will have different breakpoints, which is why Responsive Design takes effect- it works with the breakpoints to make the website more fluid.

Bug

Bugs are when code behaves unexpectedly and it needs to be fixed.

Browser

This is the platform end-users use to view your website on e.g Chrome, Firefox, Internet Explorer, Safari, Microsoft Edge etc. It’s a software application for accessing information from the World Wide Web.

Cache

When you make changes to a website, you’ll need to ‘refresh your cache’ to see the changes work. This is needed because your browser will automatically store certain items (e.g images, buttons or icons etc) and will remember them to help the page load quicker next time. By clearing your cache, you’re wiping the browser’s memory so it looks at the site with fresh eyes (and sees the changes). You can also get the cache cleared on a server level to help with page load.

The keyboard commands for this are:
● Windows: ctrl + F5
● Mac/Apple: Apple + R or command + R
● Linux: F5
● And if that doesn’t work go to http://www.refreshyourcache.com/en/home/ .

CMS (Content Management System)

This is a software system that controls the content on your website. It allows the admin to log into the backend of the website and edit the text and images. A CMS is designed to simplify the publication of website content, without requiring technical knowledge to edit the code from scratch.

Console

This is the device used to access the website. Common consoles include PC’s (desktop computers), mobile phones, tablets or TVs.

Cookies

These are small text files which get sent including an anonymous unique identifier and visit information that is sent to a browser from a website and stored on a visitor’s computer hard drive. When teamed with Google Analytics, it can provide insightful information about who visits the website, how often and what parts of they go to and their preferences.

Content

This is the bread and butter, the words or images on your website. It’s worth writing down what you think your content will be before you start a website build as having 30 words vs 10 words for a particular block, will mean that block needs to be bigger and might affect how other blocks look next to it. Getting the content right and in the right places will make your end-users journey easier and more positive.

Conversion Rate

When an end-user takes a specific desired action such as purchases an item or enters their information to subscribe to a newsletter, they have converted an action. It shows how effective your website is and (usually), the higher your conversion rate, the fewer visitors you need to get the same number of leads.

CSS (Cascading Style Sheets)

This is the code working behind the scenes on a website to tell the browser how a website should look. It includes items such as colours, text formatting, image border etc. It tells the website how to behave if a certain action is selected e.g any text that is standard text should be font Helvetica, size 10 and black.

CTA (Call to Action)

Specific areas on a website such as text, images, or buttons that calls the end-user to react in a specific way e.g moving from one page to another or take a predetermined action such as download a whitepaper, view items on sale, contact us etc.

Database

A collection of information (code and data) that is organised so it can be easily accessed, managed, queried and updated.

Deployment

Once a website has been designed, built, tested and signed off by you, it needs to be deployed live onto a web server so anyone on the internet can access it.

End-User

They are the people at the end of the internet that are using your
website.

Favicon

Look at the small square-shaped icon image next to the URL on the page your currently on. It’s an image linked specifically to my website (if you’re viewing this on my website) Usually, it contains the company logo or a variation. The favicon is displayed in either the title bar or tab of the browser and also appears with bookmarks as a visual aid to mark the website.

Field

Elements of data that can be attached to a block on a page, the most common type is text for form elements.

Focal Point

When a user lands on your website, what is it you want them to look at first, where are you drawing their eyes to? By cleverly using the right words, images and page layout, you can push your end-user to complete an action you want e.g clicking a CTA to go to page X.

Front end / Development

This is the front-facing part of the website that makes it look the way it does. It’s how your end-users interact with it the design itself and works with the Backend to make the website look a specific way. It’s built using coding languages such as HTML, CSS, JavaScript and jQuery. An easier way to imagine it is as if it’s a shop- the front of the shop (outside) is the front end design, then you have inside the shop with the counter and racks (as front end development) and finally, the back of the shop where all the products sit is the backend.

Hero Image

The Hero Image is the big fancy image that sits on the top of a website page and grans the attention of the end-user. It’s almost like a billboard.

Hexadecimal

This is the most commonly used colour label for websites. The Hex colour codes are three-byte hexadecimal numbers (meaning they consist of six digits), with each byte, or pair of characters in the Hex code, representing the intensity of red, green and blue in the colour respectively.
The values range from the lowest intensity at 00, to FF which represents the highest intensity.
White is listed as #FFFFFF and Black as #000000
Check out htmlcolorcodes for help when picking website colours.

Hosting

This is where your website will be stored and is usually on a computer/server that is located within a data centre. This computer/server will be specialised to perform certain types of task like storing large amounts of information and making it available to the internet.

HTML (Hypertext Markup Language)

HTML defines the structure and layout of a web document by using tags and attributes. Hypertext refers to the links that the page may contain and the ‘markup language’ refers to the way tags are used to define the page layout and elements within the page.

Integration

Is there anything you need to work alongside your website e.g Mailchimp to capture leads that sign up? Integrations could include a shopping cart plugin, particular tools (e.g Yoast for SEO) or even the code itself. Some integrations don’t work together so you should always map out what you need and why before starting a new website build.

JavaScript

This is a programming language that is commonly used to create interactive effects and functionality within an end-users web browser.

JavaScript Library

This is a pre-written JavaScript code which allows for easier development of JavaScript-based applications.

jQuery

This is a JavaScript library that is designed to simplify the writing of JavaScript within a website.

Keywords / Key terms

A function of good search engine optimisation (SEO) is setting what keywords you want each page to be linked to e.g one of my keywords/ terms is ‘Digital Marketing Assistance’; it’s something I want to appear for when people search for it in Google and so I need to not only note this in the text (main body and heading) but within the backend parts like the description, meta parts etc).

Landing Page

A landing page is a lead-generating page that has a simple purpose which is to get your end-user to become a lead. People become leads by filling out forms, so a landing page should (usually) always contain a form.

Local Machine

The computer right in front of you now is your local machine. You can build your website (or download a copy of your website to your computer) and make changes to it without connecting it straight to the internet. This allows you to test work or tweak things first without playing with the live website. Once you’re happy with the work, you can upload it live.

Meta Tag

This is an HTML tag that stores specific information about the content on a web page, like the description, author etc. These tags then get read by search engine bots to categorize websites and display information in search engine results pages (SERPs).

Mobile First

When looking at your analytics, you can tell what platform and device your end-users are using and if there is a higher percentage on mobile, you should make your new website mobile-first. This means the design should look and work best on a mobile-first, and a desktop second.

Module

This is a set of code files that add a new feature/improvements to the core of multiple platforms code including WordPress. It can also include bug fix updates.

MoSoCoW (Must offer, Should offer, Could offer, Won’t offer)

Most web agencies work using the MoSoCoW methodology- it allows them to figure out what your business requirements are and compare it to your budget and time constraints.

Navigation

This is the ‘menu’ bar located at the top of a website or along either side, however, it can also include other elements that appear on a website such as textual links at the bottom of the page.

Open-source

Open-source software is an application whose source code is made available for use or modification as required by other developers. It is usually developed as a public collaboration and made freely available meaning it has multiple users throughout the World working on improving it and evolving the language.
Sometimes, a licence is required as the code creator has requested payment or information clarification to ensure the code isn’t used for commercial entities or specific use etc.

Page template

Where there are pages on a website that will need to follow a particular style e.g the layout is similar to other pages, you use templates/copies of existing layouts within the CMS. This will allow you to save time
when creating new pages and evolving your website whilst still conforming to your brand guidelines and the look and feel of the website.

Parent/Child

This is the hierarchy of items. A parent is a top-level and the child is related to the parent but falls under them. For example, when describing a menu the parent would be the top-level header, the child
would be the subheading under them.

Plugin

The easiest way to think of plugins is as if its a block of pre-written code that creates a functionality e.g a block that incorporates a shopping cart or search function within a website. Plugins are made by other developers that slot into your website and gives you specific functionality e.g Yoast is a plugin that helps WordPress websites improve their SEO easily.

Region

The region is a specific area on a page where content can be placed e.g. Footer, Header etc.

Registrar

This is the company used to register your domain name. Some examples include GoDaddy uk.godaddy.com or Fasthosts fasthosts.co.uk .

Responsive design

Rather than having set breakpoints, a responsive website will adjust to the screen size that the website is being viewed on, whether desktop, mobile or smartphone.

Search Engine Bot

When a website is created or modified, it can be submitted to various search engines and told to read the page and index them (check the content) and then upload it to it’s search result pages.

Security update

Website’s need constant improvement and evolvement as code is constantly changed and updating as new bugs get created. When these bugs are found, a patch (security update) will need to be applied to fix the bug. Without the patch applied, it could grant hackers a way into your website.

SEO (Search Engine Optimisation)

This magical art (joke) is basically a set of tick boxes and requirements search engines (like Google have) that you need to perform to appear higher up the search result pages (depending on what your key terms are).

Server

The web server is where your website files and database is housed, served and maintained within your hosted environment.

Sitemap

This is a document stored on your website that shows a global, hierarchical view of the pages and content of a website. It’s like a table of contents on a book. It’s useful to create a sitemap at the start of a website build as it can help you work out what content is needed before design begins to ensure no pages get missed. A sitemap can also be a web page that offers links to all the pages within a website. When
search engine bots review a website, they will use a sitemap to see where they need to go.

Slider

Not used as much these days, a slider is a rotating banner of images that are usually placed on the homepage of a website. It is a ‘slide
show’ type format that is usually used to highlight different content or images/video and can be used to help a site feel active.

Source code

Source code, often referred to as simply the ‘source’ of a program can be considered the blueprints of a house. It contains statements that tell the program how to function. This code then gets compiled so that the computer can read or execute the program.

SSL

SSL certificates are what enable websites to move from HTTP to HTTPS (a more secure version) and allow end-users to know the site can be trusted. The SSL certificate is a data file hosted in a website’s origin server making SSL/TLS encryption possible. Devices attempting to communicate with the origin server will reference this file to obtain the public key and verify the server’s identity. The private key is kept secret and secure. Having an SSL certificate is a big plus for search engines like Google and will help your website rank higher than others for your search terms.

Style Guide

When designing your website and brand, it’s useful to know what’s what and how it interacts with other elements e.g your logo. Your style guide should detail what your logo looks like, it’s colour, it’s size, what it looks like on specific colour backgrounds and how it should be spaced. The style guide should also note things like your typography and font and other colours used for your brand. Too many colours or shapes can confuse the user, so it’s important to have a complementary blend. More detailed style guides list things like your tone of voice, the type of words you use and who your audience is and how they would interact with you.

Taxonomy

This is a logical way to categorise pieces of data or information, for example, this guide is a Taxonomy. Within WordPress, it means a category for grouping pages e.g. for property pages, you could have a Taxonomy called ” House-Type”, which would have detached, semi-detached, bungalow etc.

Tag / Term / Category

This is an organisational keyword that can be used to filter a group of items.

Theme

Theme means a file or collection of files which together determine
the look and feel of the site e.g what the typography used is, what the brand colours will be etc.

URL / Domain name / Webpage

A live website sits on a server in a particular location. The domain is identified by the number (IP address) assigned to its unique location. To make it easier to use, however, the number is given a name of your choice and this name is assigned to the number (e.g on www.FreyaHelps.Me the name is the ‘FreyaHelps’ bit).

User Experience/ Interaction (UX/UI)

User Experience (UX) references the experience the user has within the website e.g did they find the page they were looking for or did they get annoyed and left without a conversion. The User Interaction (UI) references how they interact with the website e.g what they click on
and why and what pages they go to etc.

User Generated Content (UGC)

This is content of any variety that is generated by your end-users (general public). UGC, can be material made publicly available to others, or it could be used to collect content for marketing materials.

Waterfall

Another methodology (like Agile), a waterfall approach means that once a task is started, the next task can’t be started until the previous one is completed so that progress follows a steady downwards flow. Unfortunately, because of this, it can mean that projects often overrun and problems can’t be foreseen or dealt with before blocking others.

Web page

A web page is a hypertext document connected to the World Wide Web. Websites will have multiple pages such as a home page, contact page, about us page etc. Each page will have a unique URL.

Whitespace

This is the amount of padding or margin around key pieces of content on a web page including paragraphs, buttons and images. A cluttered website is the opposite of the website with plenty of whitespace. It allows the design to pause for a breath and work cleaner and simpler.

Wireframe

This is a way to visualise and guide you what the content and blocks
of a web page will look like without any design elements. It’s usually just black lines and blocks on a white page but allows you to focus on the layout of the content without being distracted by the design.

WYSIWYG (What You See Is What You Get)

This is the interface inside a CMS that applies styles to text and graphics and allows the user to see what the content will look like without creating the code for it. Think of it as the menu bar in Microsoft Word which allows you to change the text format (e.g font, size, colour, numbering etc).

W3C

The World Wide Web Consortium (W3C) is an international community that develops open standards to ensure the long-term growth of the Web.

301 redirect

This is a set determined and permanent redirection of traffic from one web address to another. It is useful when you have an old website and you want people with the old URL to be redirected to
your new website e.g. ‘webaddress.com/about-us’ is now webaddress.com/our-company’ on the
new website.

404 page

When someone online tries to access a page with the wrong URL or with one that no longer exists (and a 301 redirect hasn’t been set up), they’ll be greeted with a 404 error page. An effective 404 error page should
communicate to the end-user why the page doesn’t exist and where they can go now or what they can do next.