Hosting, huh? Servers, what? We all have our specialities. Websites happen to be one of ours. However, we know that some of the website terminology used can leave people confused. Confusion is never a good way to start or leave a conversation, so let’s make the playing field level. This blog post aims to define some of the most common website terminologies used in a typical website designer’s vocabulary. Hopefully, it will clarify a thing or two!
The ever-changing nature that is the technology-sphere means that new phrases and acronyms pop up all the time. We will aim to keep this blog updated as regularly as possible to include new definitions as they arise.
You’ll notice that throughout these definitions they’ll be a hella load of acronyms, don’t let this throw you, there’s a super simple explanation behind them all! Also, this is the overall blog post, but we’ll aim to write separate blog posts for terms that require more explanation. Let us begin.
Call to action (CTA)
CTA is more of a marketing term, however, website designers often use them to evoke an action from the user, usually something like “click here” or “buy now”, you’ll probably be used to seeing the classic “add to basket”. All of these terms denote a call to action – essentially you are taking action. There’s a whole bunch of research that goes into the most effective call to actions.
The address bar is the place where you type the website you want to visit.
Typically used for screen readers and to improve the user experience for the visually impaired, alt text is the descriptive text you’ll see if an image doesn’t load, or when you roll over an image on a webpage. Alt text is commonly used in search engine optimisation (SEO) to improve the search engines understanding of the image and context of the page as a whole.
A backlink is another websites way of giving your own kudos. If they include a link to your website – typically an article or an affiliate – this is classed as gaining a backlink. The more links you gain from other websites, the more authoritative your own website is seen by search engines. A backlink strategy will often be included as part of an SEO strategy.
A browser refers to the service you use in order to access website pages, common ones include Google Chrome, Internet Explorer (IE), Firefox and Mac’s own browser Safari. The browser you use to access websites is completely down to user preference.
Stumbled across a 404? This simply means the page is no longer on the server, which could mean the typed URL is incorrect or the page does not exist.
Favicon refers to the favourite icon that appears on the left-hand side of your browser’s tab, websites with a favicon tend to look more complete. Next time you visit a website look out for one.
A hyperlink is generally a link within text linking to another resource. The link could be a webpage or an image and can even open your email for you if the link is to an email address.
Screen resolution refers to the pixel density of your screen. Larger screens need a higher pixel density to display a crisp clear image. Smaller screens with a large pixel density will appear clearer than those with a lower density. Ever wondered how they make phone screens clearer each time? They put more pixels per inch to increase the resolution. In other words, high screen resolution = more pixels = better display!
Search Engine Optimisation (SEO)
To put it simply, and without going into too much detail, SEO, or the service of SEO refers to optimising your website and online activities for search engines to easily find you (index you or rank you). The coveted first place on Google is often the goal. The search engine gods are often moving the goalpost which leaves us optimisers (the person carrying out SEO for you) in a constant game of cat and mouse. SEO is not a one and done kinda thing. Nope, it’s constantly tweaking, testing and monitoring best practices in order to achieve the best possible rankings.
HTTPS and HTTP are relatively similar in that they both stand for Hypertext Transfer Protocol. The additional “s” in https marks a connection as secure – and literally stands for secure. Information is transferred from a server to your screen when you visit a website or click a link. This information typically moves through cyberspace in plain text making it vulnerable for the interception, this goes for login details and passwords. When a website is using a secure – or encrypted – connection this data is protected as it moved from one server to another making it harder for hackers to see your details. So how does a connect become secure? Well, we’ll explore that in the next definition.
An SSL, or “secure sockets layer”, is a small file placed on a server that encrypts all of the information being sent between the server and browser. SSL certificates are extremely important for the security eCommerce websites where personal details and card information are not only being sent but stored by the server.
A small piece of computer programming that allows website designers and developers to add certain functionality to your website without rewriting the wheel each time.
A Pixel, or “Picture Element”, (I know, my mind was also blown) is a teeny, tiny area of illumination on a screen which is assigned a colour, millions of these pixels will make up a picture as you see them on screen. The smaller the pixel, the higher the pixel density and the better quality an image will appear.
The first rule of design, especially in our information overloaded world, WHITE SPACE IS YOUR FRIEND! White space is exactly what it says on the tin, the spaces or bits of screen with nothing on them; the white space does a lot to aid the design and user experience of a website.
With whitespace there is a fine balance, we’re not suggesting ultimate minimalist here – although sometimes it is appropriate – you just need to find a balance between information and space, it’s definitely one of those things that you’ll notice when not there.
API stands for “Application Programming Interface”. Often used by developers, an API is a small piece of code exposed by a large corporation. Google is a good example. Since everyone knows who Google is, I’ll continue to use them as an example. The API allows a third party’s (your) server to talk to Google’s server to get a response. Want to sign in using your Gmail account? That’s the website you are visiting talking to Google’s server. It’s asking for permission to access information about you, usually in the form of your username, password and email address.
Naturally only some of the code is exposed openly to another server who is requesting the data, Google wouldn’t allow access to its algorithms. In a nutshell, an API is a way of talking to a third party’s server to add functionality to your own website.
Backend development is easily explained like this – when you access a website, you see pretty pictures and beautiful layouts and whimsical animations, what you don’t see is that the website is talking to a server and a database. Think of backend development as the stuff you don’t see.
Backend development is usually referred to in the developing world as “languages”. Why are they called languages? Probably because they are friggin hard to learn and each has its own syntax and rules and could potentially take years to learn and become proficient in.
Common languages include PHP, Ruby and Python – there’s an entire world of debate as to which one is the best, it’s the equivalent of a cockfight for nerds, and damn they will fight to the death.
Fun Fact: Forty8Creates is a WordPress development agency, which is built on the PHP framework. Therefore, we use PHP for all of our website builds. (Okay, not fun, but highly informative!)
Front End Development
That brings us nicely to front-end development, this is the stuff you do see! Whether a website is red or green or purple with orange spots, and whether it has two columns or three columns is all determined by the front-end coding. Everything you see is front-end development.
Front-end development is also called languages, and they include HTML and CSS.
User Acceptance Testing (UAT)
A UAT is often used by website designers and developers to build your website pre-launch. As the name suggests, the UAT of your site allows you to see, test and tweak your site before it is pushed live for the world to see. A UAT is also handy for when you already have a website and want to test any changes before making them live.
Content Management System (CMS)
Content management systems, of which there are many, allow admins and contributors of websites to be able to collaborate on written content. Essentially a content management system is a programme that manages digital content and provides users with levels of access based on their role within an organisation.
There are many content management systems that will differ in features depending on what functionality is required. Forty8Creates may be a little bias on this one, however, we believe the best content management systems for small and medium-sized businesses is WordPress and its user-friendly interface and easy to use CMS.
WordPress is a beast all on its own, so writing it within a short explanation wouldn’t do the programme justice. Currently powering over 26% of the internet, WordPress is by far one of the most popular, open-source CMS to date.
Some of the more well-known systems include:
- Squarespace (Facebook’s answer to content management)
Of course, this list is ever growing, and new technologies and rivals will always be introduced to the market. Deciding on the best content management system for your needs is definitely a preference based exercise. However, be sure to check out the support community around each option, this can make the difference when you find yourself stuck.
Website analytics are often used by marketers and SEO folk to ensure your website is performing at its best. Whilst there are a huge amount of analytics tools available, the most common by far (and free!) is Google Analytics. Google Analytics makes sense of all the data collected from the users on your website; by looking at analytics you can tell if your target audience is visiting the site and how they react to content.
A hosting service will normally own huge data storage centres (also known as servers) where you will pay a subscription to “rent” some storage space on the internet from them. Hosts, like the name suggests, take care of the maintenance around your data and ensure their servers are as secure as possible. They attend to your needs and are there to give advice when errors occur on your website.
Servers are the physical storage space for your data. Typically servers are shared by thousands of small websites which is why many servers cost as little as £5 a month to rent. For companies such as GoDaddy, the volume is definitely the game they play. This can sometimes have an adverse effect on quality. Your website’s files are stored here. Yup, for those that don’t know, your website is simply a bunch of files and folders. The server is the storage system for them that can be accessed remotely. This remote access is commonly known as the internet!
Above the fold
Above the fold is a term used in website design to describe all of the content that loads when you first get to a website. Everything you see before scrolling. It’s often said, and correctly so, the above the fold content is of the utmost importance. Using this space to house your most important information is a “best practice” to ensure the user gets a good first impression.
Below the fold
If above the fold refers to content before you scroll, then below the fold simply means the content you see as you scroll.
A hero header is a large header occupying most of the screen above the fold real estate upon opening the website. Hero headers have become somewhat of a design trend. We think this is due to their versatility and impact on a user. Hero headers can be static, animated or videos. We definitely recommend using them sparingly. Often a user will become fatigued if they look at hero headers throughout the entire website. An exception to this rule could be portfolio websites and websites in which you showcase a product.
God love mockups, the designer’s best friend! Mockups help you to display your work in creative ways without having to shoot, light and edit the end result. Mockups are typically made by designers and sold for use by other designers who need to display their work in a visual way.
Our favourite mockup sites remain Envato, Graphic Burger and Creative Marketplace. You’ll see many mockups within our portfolio. The latest trend being video mockups. Which are uber cool! Very Shoreditch, yup, if these mockups were human, they’d almost certainly have a top knot and their own beard oil.
A website navigation is the list of links usually appearing in the top of your headers. Commonly horizontal, but can be vertical, the navigation of your website helps users and potential customers to move from one page to the next.
Navigation is a hugely important part of any website design and development. Poor navigation frustrates potential customers and is poor user experience, frustrated customers do not buy if they cannot easily navigate your website.
User Experience (UX)
User experience, commonly known as UX in the industry, is simply the way a user feels about using your website, whether or not it’s easy to use and intuitive. Again, as with most things with the web, there’s a plethora of information about how best to achieve the optimal user experience, and more importantly what not to do. We’ve reviewed what we feel our 6 key areas of website user experience to help with the flow of your website and increase satisfaction.
User Interface (UI)
A close cousin of user experience, the user interface – also known as the graphical user interface (GUI) – refers to the way the interactive elements of a website or application look. This could be the way the buttons look, what keyboards look like and the way a form looks.
Information Architecture (IA)
Information architecture, or IA, takes the combined skills and efforts of designers, developers and content strategists. These three areas of expertise come together to ensure you, the user, know exactly where you are in reference to where you want to be. “Breadcrumbs” on a website are a way of implementing IA as you are constructing the logical order that content is shown in.
UX Booth happens to have a very detailed and nicely structured (nice IA guys!) explanation of IA, so if you would like to read more about what IA is, and some of the tools of the trade, we highly recommend their blog “The Complete Beginners Guide to Information Architecture”.
A database stores information in an orderly manner by using multiple tables containing multiple fields. The database, which has modernised as technology evolved, allows you to store, access and query the data stored within it. Commonly used for eCommerce sites, a database would be used to store stock inventory and return that information back to your website. Your website is continually “talking to” the database it is connected to. This allows live updates in information such as stock levels or content on a website.
eCommerce, or “Electronic Commerce” refers to business and transactions carried out over the internet. An eCommerce website, with its explosion in popularity during the Information Age, is a necessity for many retailers to compete in modern, digital society. eCommerce is hugely complex with a multitude of moving parts. As such, it deserves an entire library of resources dedicated to it. Whilst there are many on the internet as there is – Forty8Creates is currently writing the ultimate guide to eCommerce for SMEs, so watch this space.
A plugin will typically be used in your website development to enhance functionality. The plugin saves time by allowing your developer to not rewrite code that someone has already made available. Generally, in the form of a “script”, a plugin can have multiple uses. Be warned, with so many to choose from, plugins and their content aren’t made equal.
HTML stands for “Hypertext Markup Language” and is a language used by web browsers to render the information on the page. Instructions to your web browser are often written in HTML. Such as where to find your stylesheet and fonts. They generally contain plain text that you can see on the front end of a website.
CSS or “Cascading Style Sheets” are used to make your website look pretty! They define elements such as the size, style and colour of fonts, the animation and the layout of your web pages. CSS is a front-end language.
PHP stands for “Hypertext Preprocessor” and is used to generate dynamic web pages. It is the code that can speak to your database and return information in the form of HTML text, such as the number of items in stock for a particular product. Browsers do not render PHP making it a secure way of passing information between your website and database and outputting this to your user.
Caching is your browsers way of storing data locally when you visit a website. This increases load speeds and decreases pressure on servers. Your browser is essentially taking a snapshot of the CSS is rendered when you first visited a website, omitting the need to ask the server again for the style sheet.
A URL or “Uniform Resource Locator” is your way of telling a browser which file you would like to visit on a server. The prefix of all URLs is https or HTTP. The s depends on whether or not the connection is encrypted – if it is encrypted it is https. The prefix is followed by your server name. An example is forty8creates.com. Finally, the URL ends with the path of the page you would like to visit. For example /blog. An example of the entire URL would be https://forty8creates.com/blog. This URL tells the browser you would like to access the blog page on Forty8Creates server, and it should do so securely.
DNS simply stands for “Domain Name System”. It was created to help us humans access a server (website) by using names rather than a series of numbers. A browser will access data from your server by taking its unique id number – also known as an IP Address. The name assigned to this server, for example forty8creates.com, is translated on the backend to the IP address for your browser to access.
File Transfer Protocol (FTP)
FTPs allow you to transfer files to your website via the internet. If you have read every definition on this blog so far (first of all congratulations, you deserve a break) you will have learnt that your website is simply a series of folders and files. An FTP is much like transferring a file from your desktop to your pictures folder, except when you transfer it to your website you make it publicly accessible if the visitor uses the correct path to access it. A very common FTP application is Filezilla, but there are many more. FTPs do not connect to your database.
Often used in navigation menus to show the sub-items of that menu item and is a way of organising your information (also known as Information Architecture).
Tooltips are typically used to give the user more information. Generally, tooltips are shown as question marks within a circle. When rolled over, they show additional information or a definition of the word or sentence it was placed next to.
A hover state allows the user to interact with an element. The hover state may bounce, grow or change colour. A hover state is commonly used on buttons on a website requiring the user to interact with them.
A trend in the design world that just doesn’t seem to be going away – much to our dismay! Parallax, or parallax scrolling, layers your content so when a user is scrolling down the page it appears to move at a different rate to the object in front or behind it. It’s a beautiful effect. It gives your website an immersive 3-D depth of field. However, in terms of website build, it cannot easily be replicated on mobile, so much of the experience is lost since the majority of people use their phones to browse the web.
(Content Delivery Network) CDN
A content delivery network (CDN) is a way of speeding up your websites load speeds by storing a copy of your website’s files and folders on a server that is located closer to the user accessing it. Content delivery networks are servers all over the world. When asked to, will ensure your website is loaded from the nearest server.
Tap to Call
Tap to Call is a handy user experience feature that allows users to call you directly from their phone with the single tap of a button – usually your phone icon. This omits the need for a user to copy and paste your phone number into their phone.
Geolocation pinpoints a user’s location using the signals from their devices which are beamed up to satellites. These satellites tell the browser where they are located. This is a rising trend in website development which aims to deliver you only the most relevant content. For example, this would work nicely with phone numbers. By assessing where you are in the world a website can show you a local phone number rather than an international one.
Cookies are small amounts of data that allows your browser to remember static information. This information could be things like your name, number, and email address. It is most commonly shown when your browser asks you if you would like to use “Auto Fill”. Cookies can be deleted and information can be forgotten, but more people rely on cookies to remember their passwords and login details.
Marketing people use these to determine your user preferences and activity on a website. These cookies are captured (with your permission, hopefully! Especially, since GDPR compliance.) and outputted as anonymous data in analytics software such as Google Analytics. This information has recently gotten a lot of media attention owing to the amount of data companies collect on their users, and the security of it.
A nice easy one to end on. A blog, or “Web Log”, is a series of posts that are publicly accessible for other people to read. Many teenagers use blog sites to express feelings and passively aggressively let their crushes know that they are angry at them (memories!). Nowadays the blog has evolved some. Naturally, there are also very informative blogs and articles that serve a fundamental educational purpose. Many businesses use blogs as a way to educate the public about their services and provide informative insights.
Categorised in: Website Design & Development