Jargon Buster

Site Environments

Local - Accessible on one local machine. Visible only to the developer working on the site.

Staging - Accessible to anyone with login details. Visible to us and the client.

Live - The live site - Visible to the whole world!

Languages

For most websites we use 4 main languages

HTML

HyperText Markup Language

It allows the creation and structure of sections, paragraphs, and links using HTML elements (the building blocks of a web page) such as tags and attributes.

<div class="panel"> <h3>This is a title</h3> <p>This is some text</p> </div>

CSS

Cascading Style Sheets

Description of how HTML elements are to be displayed on screen, paper, or in other media.

h1 {
  font-family: 'turbinado-pro', sans-serif;
  font-weight: 400;
  color: red;
  position: relative;
  margin-bottom: 60px;
  margin-top: 0;
}

Target class specific blocks

h1.blue {
  font-family: 'turbinado-pro', sans-serif;
  font-weight: 800;
  color: blue;
  position: relative;
  margin-bottom: 20px;
  margin-top: 0;
}

h1 {

font-family: 'turbinado-pro', sans-serif;

font-weight: 400;

color: red;

position: relative;

margin-bottom: 20px;

margin-top: 0;

}

Class and ID

Class is an attribute given to HTML elements to be formatted by CSS, preceded with a full stop.

.hello

ID is a unique identifier for HTML elements which can be used for formatting with CSS but can also used in tandem with anchor tags for the purpose of scrolling up and down pages.

#hello

JavaScript

A scripting/programming language that allows you to implement features on web pages.

Every time content updates, interactive maps are displayed or animated graphics render — this is what JavaScript is for.

PHP

Acronym for "Hypertext Preprocessor"

PHP is a server side languages which enables us to access data stored in databases.

Some examples of PHP:

echo "Today is " . date("Y/m/d"); = Today is 2025/10/28

echo "Today is " . date("Y-m-d"); = Today is 2025-10-28

echo "Today is " . date("l"); = Today is Tuesday

Viewport

The user's visible area of a web page.

HTML5 introduced a tag that enabled the HTML document to fit the width of the device the page is viewed on and also the intial scale of that page.

DevTools

A set of web authoring and debugging tools built into Google Chrome.

Use the DevTools to iterate, debug and profile your site.

Hard Refresh on Mac:

Cmd + Shift + R

Hard Refresh on Windows:

Ctrl + F5

Front-end

Front-end web development is the practice of converting data to an interface, through the use of HTML, CSS, and JavaScript, so that users can view and interact with that data.

Back-end

Back-end development refers to the server side of an application and everything that communicates between the database and the browser.

Back-end (WordPress)

The technical term used to describe the configuration area of an application. In WordPress, backend is used to define the admin area of the website where you create content, install plugins and more.

Also known as the wp-admin or WordPress admin area.

Full Stack

A full stack developer is a web developer or engineer who works with both the front and back ends of a website or application.

They should have an well-rounded understanding of each aspect of the website or application that they're creating and in some circumstances they may even be involved with the planning side of projects alongside the client.

Plugin

A piece of software containing a group of functions that can be added to a WordPress website.

They can extend functionality or add new features to your WordPress websites.

WordPress plugins are written in PHP and they integrate seamlessly with WordPress.

WYSIWYG

What You See Is What You Get

Editing software that allows content to be edited in a form that resembles its appearance when printed or displayed as a finished product.

Modal

Click Here

Cookies

Small text files that are placed on a user’s computer by a website, never bigger than 4KB, read by the server-side of the application to deliver website pages tailored to the specific user.

They store the pages visited on a site or a user’s login information.

The two most prominent types of cookies are Session and Persistent cookies.

If a site uses cookies a consent popup is needed

Session Cookies

These exist only in temporary memory while the user navigates the website.

Web browsers normally delete session cookies when the user closes the browser.

These cookies do not have an expiration time on them as they removed by default when the user leaves the site.

Persistent Cookies

A persistent cookie expires at a specific date or after a specific length of time.

For the duration of time that this cookie is permitted to exist for, it will send the information it contains to the server every time the user visits the website that it belongs to.

They are sometimes referred to as tracking cookies because they can be used by advertisers to record information about a user's web browsing habits.

IP address

A unique address that identifies a device on the Internet or a local network.

It allows a system to be recognized by other systems connected via the Internet protocol.

There are two different types of IP addresses fixed and dynamic. The main difference being that a fixed IP address never changes

Firewall

Network security device that monitors incoming and outgoing traffic and permits or blocks access based on a set of security rules.

Its primary purpose it to block malicious traffic like viruses and hackers.

Server

A piece of computer hardware or software that provides functionality for other programs or devices, called "clients".

Typical servers are database servers, file servers, mail servers, print servers, web servers, game servers, and application servers.

Charles is our staging server.

Live servers are named in order of Formula 1 winners, such as Stewart, Hill etc.

Contabo

Contabo is a web hosting company which provides us our virtual servers.

Forge

Laravel Forge is a tool that simplifies the deployment and management of web applications on servers. It automates tasks like server setup, software installation, and security configurations, making it easier to deploy and maintain Laravel applications.

Vultr

Vultr is a cloud computing platform which provides us our virtual servers.

Plesk

Plesk is a web hosting platform which has a control panel.

It provides a user-interface for the devs to view/edit site files, databases etc. Configure firewalls, and view server logs.

Server Errors

When accessing a server or application, every request that is received by a server is responded to with a status code.

Status codes are three-digit codes, and are grouped into five different classes. The class of a status code can be quickly identified by its first digit.

Error Codes

1xx Informational
2xx Success
3xx Redirection
4xx Client Error

401 Unauthorised
403 Forbidden
404 Not Found

5xx Server Error

500 Internal
502 Bad Gateway
503 Service Unavailable
504 Gateway Timeout

Canonicalisation

A canonical URL is the URL of the principal version of a page when you have duplicate versions of that page on your website.

Canonical URL can be set in HTML e.g.

Or via Yoast plugin

Then, when Google crawls the page, it can distinguish this page from the duplicate pages.

robots.txt

A robots.txt file tells search engine crawlers which URLs the crawler can access on your site. This is used mainly to avoid overloading your site with requests; it is not a mechanism for keeping a web page out of Google. To keep a web page out of Google, block indexing with noindex or password-protect the page.

Redirects

Redirects are rules that send traffic from one url to another. This can be helpful if you want to have more than one url going to one web page

For example you might have a page with a slug of /news but you might want to redirect /blog to /news. A redirect rule can be set up to do this

JSON

JavaScript Object Notation.

A structured way of declaring information for storing and exchanging.

Typically written as plain text, created as JavaScript Objects.

API

Application Programming Interface

A call from your server to an external server requesting information that is typically pulled in as JSON data.

Endpoints

An endpoint is a component of an API.

For example Spotify:

"https://api.spotify.com/v1/albums/{id} (where {id} is the album's unique identifier)."

Example of how data can be returned from an endpoint

"employees":[
  {
    "name":"Ian",
    "job":"Director",
    "email":"ian@nuimage.co.uk"
  },
  {
    "name":"Liam",
    "job":"Developer",
    "email":"liam@nuimage.co.uk"
  },
  {
    "name":"Stephen",
    "job":"Designer",
    "email":"stephen@nuimage.co.uk"
  }
]}

Data Layer

A JavaScript object that is used to pass information from your website to your Tag Manager container.

You can then use that information to populate variables and activate triggers in your tag configurations.

dataLayer = [];

dataLayer.push({
  "event" : "transaction",
    "ecommerce": {
    "purchase": {
      "actionField": {
        "id": "1156",
        "revenue": "150",
        "tax":"30",
        "shipping": "Local Pickup",
      },
      "products": [
        {
          "name": "Apple",
          "id": "10",
          "price": "180",
          "category": "Fruit",
          "quantity": "1"
        },
      ]
    }
  }
});

Framework

Web frameworks provide a standard way to build and deploy web applications.

Essentially the building blocks that can be used to speed up a web build.

FTP

File Transfer Protocol

A connection of sorts that is used for transmitting files between computers on the Internet.

FTP is a client-server connection where a client will ask for a file, and a local or remote server will provide it.

Changes are then applied to files and sent back over the FTP connection for the server to store.

Repository

Repository, or “repo” for short, is a storage location for software packages/website files.

Where FTP is a direct route, repositories are perhaps a safer option as changes to files go through a more stringet review process before they can be "committed".

Pipelines

The process, scripts and configurations used for two servers to communicate.

Deployments

The stages of building, debugging and solving issues using stages of development.

Master/Production
Staging
Test

DNS Records

Records which act as instructions for the server, so it knows where relevant information about the domain needs to be sent to and requested from.

What are records?

A IP address information
CNAME Subdomains associated with the current domain
MX Mail servers
NS Nameservers currently being used
TXT Additional information

Largest Contentful Paint

The metric that measures the time a website takes to show the user the largest content on the screen, complete and ready for interaction.

Cumulative Layout Shift

CLS measures the layout stability of a webpage, to ensure that user experience runs smoothly and interactions flow as naturally as possible, without any interruptions or unexpected jumps.

How is it measured?

Images without dimensions
Ad embeds and iframes without dimensions
Dynamically injected content such as Youtube videos and Google Maps
Web fonts

Laravel

Like Wordpress, Laravel is a web framework. However it offers a lot more customisation, we have total control over how all of the backend functions and the database structure. Laravel is used for more advanced, long-term builds, such as BRSCC.

Site Migrations

When bringing a site over to use for hosting we need the database and site files.

Firstly will set the site up locally and ensure that it functions correctly, comparing it to the live site.

Secondly we create a staging site for the account handler and the client to view

Then we push the site up to one of our live server, preview it and check it's still working

Finally we update the DNS records to point to our servers. This can take up to a day to propagate through.

Sitemap

A sitemap is a file where you provide information about the pages, videos, and other files on your site, and the relationships between them. Search engines like Google read this file to crawl your site more efficiently. A sitemap tells Google which pages and files you think are important in your site, and also provides valuable information about these files. For example, when the page was last updated and any alternate language versions of the page.

Tailwind

Tailwind is a utility-first CSS framework that provides low-level, reusable styling classes. Instead of writing custom CSS, you use predefined classes directly in your HTML to style elements. This approach allows for faster, more consistent design development.

Instead of doing this:

We can do this:

Foundation

Foundation is a HTML framework that we use across our Wordpress sites, it's a family of responsive front-end frameworks which makes it easier for us to quickly build sites.

12 column layout - divisible by 6, 4, 3 and 2.

Note: We don't use foundation on new web builds.

Mailtrap

Mailtrap is a tool for testing emails sent from your application. It captures outgoing emails in a safe environment, so you can inspect and debug them without sending them to real users, preventing accidental spam during development and testing.

Uptime Kuma

Uptime Kuma is a monitoring tool for us to monitor a sites status, when it goes down. Uptime percentage etc.

Caching

There are two types of caching server-side and client-side

Server-side - The server caches data reduces load on the server.

Client-side - Your browser will cache data to improve page speed.

Bug

A bug is an unexpected problem with software or hardware.

An example of a bug could be that a slider doesn't go to the next slide when you click the next arrow

Questions?

What is FTP?

What are the two different types of caching?

What is a repository?

What are the 4 main languages we use?

What is a 404 error?

What does WYSIWYG stand for?

What is the name of our server which hosts all of our staging sites?