terminology

21 webdesign and web developer terms

At Code-on we like to help our customers. Because we know that IT jargon is often hard to understand, we omit this as much as possible. It is nevertheless useful to know a number of terms that are often used. I want to familiarize everyone with jargon you may encounter.

Here are a few of those recurring terms.

webdesign

Front end:

Developers call a website’s or application’s user interface the front end. Programming for the front end affects how the site or application looks and how the user interacts with it.

Back end:

A site’s underlying code is in its back end. When data are entered via the front end, they must be stored in a database, available when a user requests data. Before saving or retrieving data, authentications, processing, and relationships must often first be established. That is typical back-end work.

“Back end” also often refers to the administrative part of the website. The site’s administrators, admins for short, can work on a website here through a content management system (CMS).

MVP:

MVP stands for minimal viable product. The web developer will often propose to build an MVP first. Then the minimum number of features is built to make the product workable. You test the market and show prospective investors that your business plan has potential. Later, when you get users, you will ask the web developers to add features.

SPA:

SPA stands for single page application. One page is provided. When a user surfs to another page, javascript will request the data via the necessary application programming interfaces (APIs; see definition below) and load them within that same page. The advantages are that the application responds much faster and becomes much more interactive. The focus of development is therefore shifting to the front end.

SPA has been on the rise in recent years. This has only become possible since Javascript as a language has become mature and speed mature.

Code-on is a strong believer in building SPA.

Typical javascript frameworks used for programming SPA applications are VUE, React, and Angular. Code-on uses VUE or Angular.

MPA:

MPA stands for multipage application. This is the traditional way of developing an application. When a user requests data, the server builds an html page that is read by the browser. Every time the user asks a new question, the server will receive it and build a new page.

API:

API stands for application programming interface. You can view it as a kind of socket. An API usually looks like a representation of data, most often in the JSON format (JSON: Javascript Object Notation; see definition below). The computer can then read it and display it in a readable format in the browser. When it comes to building the application with SPA, there will almost always be an API first.

Headless:

Closely connected to API and SPA, headless means that the administrative part of the stie will be separate from the front end. For example, a headless CMS it means that the CMS will always result in API. If you have an API, the SPA application can be built. This can then, for example, be placed on very different or multiple URLs.

JSON:

JSON stands for Javascript Object Notation. It is a standardized data format that is used to exchange data.

Framework:

Frameworks are built to simplify the development process. In principle you do not need a framework for software development. But it would be a lot of work to build software without a framework, given that a framework already has many solutions and best practices. Otherwise you would have to (re)invent them all! Code-on, for example, uses different frameworks, such as Django, Django REST, VUE, and Angular.

Unit tests:

Unit tests are tests that are written programmatically. When your code changes, the unit test will prove whether or not the new code is still validating the expected one. For example, if the data expect a number and it suddenly becomes possible to enter a letter, the unit test will detect an error. This way developers know that they may have made a mistake.

Git repository and version control:

Git is a version control system. When a programmer has written a piece of code, he submits it to a repository. Every change is recorded there. For example, if a piece of code does not work, you can always see who wrote that piece of code and when it was written, and possibly request the old code back. In other words, it is the ideal backup. Git has become a de facto standard in the IT world.

SSL:

SSL stands for secure socket layer. It is a protocol to the data that are exchanged to be encrypted between the server and browser (client). That means that someone else cannot read these data. You can recognize this by the “https://” in the URL bar. Today it is standard to provide your website with SSL. This is free with letsencrypt.

UI Design

UI stands for user interface. The designers and front-end engineers are working on this. All interaction with a computer is via the UI.

UX Design

UX stands for user experience. Developers work to solve the following issues: How easily can the user handle the application? Is any task in it frustrating? Can we simplify flow? What about conversion? UX is all about making the application easy to use.

Lo-fi Design:

Lo-Fi design is the sketchy elaboration of a design. It looks at the functionality that it must have and gives a general impression of what needs to be built. This is often accompanied by wireframes.

Wireframe:

Wireframes are sketches of an application. These do not show what the design will look like but deal with functionality. The complete application can be displayed in this way. So it doesn't have to be beautiful.

Hi-fi Design:

Hi-fi design is when all the wireframes come together to form a finished design. Here the application is fully drawn up in detail. The UI and UX come together for the first time in determining design including colors, font, buttons, menus, widgets, etc.

Widget:

A widget is a smaller element within the application. We often use this to indicate a small, separate functionality. For example, a widget can be a sidebar that indicates how many hours you have been working.

Responsive Design:

When we design an application or website, the front-end engineer and designer code it so that everything on the page adapts to remain readable on any size screen, including smartphones. Responsive design is also for when someone enlarges or reduces a browser window. For example, elements that appear in the same row on a wide-screen monitor may be stacked vertically on a mobile device’s screen.

CSS:

CSS stands for cascading style sheet. This is where the front-end developer describes what the application should look like. For example, in the CSS you can say that an H1 title must be 22px in size. If you then place an H1 title in your site’s or application’s html, this will be 22px in size.

Above the Fold:

This term comes from the newspaper world. When you see a newspaper for sale in a store, you only see the top half of the front page, because the paper is folded. In web design, “above the fold” describes the content the user will first see on the screen without having to scroll down.

Web development uses a lot of jargon. These are the most common terms that you will read on a quote or when working with a developer. Programmers use even more jargon, such as singleton, cache, and recursive. But as a customer you will not have to deal with that.

In a future blog post I will discuss a number of project management terms such as agile, waterfall, backlog, WBS, Milestone, Triple constraint, prince2, and Scrum. In another blog post I will go into which analytics terms you should know best when you plan to start a startup.