Website vs Web Application

May 5, 2017

What is the difference?

Very often I hear the terms “Website” and “Web Application” used interchangeably, but in some cases this is not quite correct. This subject brings me back to the age old discussion that I used to get into arguments about back in elementary school. It is the difference between a rectangle and a square. In many ways, the two are very similar and share a lot of properties; however, they are not the same thing.
Just like the square and rectangle debate, the difference lies in specificity. The website, just like the rectangle, is the more vague of the two. It refers to the overarching idea of having a location on the web that is visited to view content. Now what makes a website and web application differ is how it handles data. A website allows for the display of data, where a web application also allows for manipulation and storing of data.

A nice beautiful shameless plug of an example of a website is BuildThis. It catches your attention, it displays information that it needs to display, and the only real interaction with the user is the ability to submit a contact form. You do not have an account to log into and data really isn’t saved*. Each time the site is accessed, the same static content is loaded from a page. Now that content may change as updates are made to the website, but it is not dynamically created by users.
A good example of a web application is www.facebook.com. Each user has an account that has information tied to it. Every post/comment/like/share you make is stored and linked to that account. Data is free flowing and able to be created and manipulated through their interface and is stored in their databases. This sort of free flowing or dynamic data is what defines it as an application in addition to being a website.

Now all of this is really just speculation in terms of what we refer to a site as. There is no true hard definition or set rule that determines one or the other; however, there is in terms of building a site.

A beautiful site can be built with just your basic HTML, CSS, and JavaScript, however an application often needs a more powerful set of tools to be built.

Often when building a web application a framework is used. A framework is a set of tools and prebuilt functionalities that are packaged together to help reduce the tedium of creating a web application. Essentially like using a muffin pan when cooking muffins, the shape is already determined for you so it makes it easier for you to bake the perfectly golden muffins that fill your home with delicious scents, except you know, for web development. Common frameworks are Laravel (www.laravel.com), and Django (www.djangoproject.com). These frameworks are written in different languages, the listed frameworks are in PHP and Python respectively.

Since building web applications requires knowledge of more intensive programming languages, it often needs a higher analytical skill level. Application developers require knowledge that website developers don’t particularly need to know or at least not to the extent in which an application developer needs to know them. For instance, in terms of optimization, a website developer may need to know that reducing absurdly large images as well as quantity of images loaded on a single page may increase load speeds; However, they may not need to know about Big O Notation**.

Web application developers need to not only think about how a page is designed, and how a user will interact with it, but they will also have to worry about how their database tables are implemented, what extra technologies need to be set up, how users interact with data, and how data interacts with itself. These extra steps are incredibly difficult to deal with, especially when dealing with sensitive data, such as payments, credit cards, information about users, or complex data structures.

Because there are so many more steps to development of an application when compared to the development of a basic site, parts of the application are split off to be worked on by people of different specialties. The two biggest specialties that application development gets separated into are Frontend Developers and Backend Developers.

Frontend Developer
To put this plainly, a Frontend Developer is responsible for the design aspects of the application, the look and feel of everything the user interacts with.

Backend Developer
The Backend Developer handles the Data structure, core functionality, extra features, and essentially everything that makes the system work.

Think of it in terms of a car. The Backend Developer is the engine, cooling system, alternator, brakes, exhaust system, suspension, etc, all of the core elements that makes a car function, where a Frontend Developer is the frame, the paint job, the leather seats, the placement of the brake pedal, the layout of the dashboard, all of the elements that users interact with. A Full-Stack Developer handles both of these things, and there are many other jobs that specialize even further beyond what is explained in this article.

Although there really isn’t much difference between a website and a web application in terms of how the user sees the site, under the hood there is a huge difference in terms of skillsets needed to build one over the other. It is very important to keep this in mind when looking at having a site built and who is the right fit for building the site. You don’t ask the person who changes your windshield wipers to also replace your engine while they are at it. It is two different jobs, requiring two different skillsets, at two different price points.

* WordPress itself is a web application and certain functionality implemented natively along with the use of plugins can in fact save dynamic data, for example the inputs to a contact form. Even though the website itself is not a Web Application, it is built on one.

** Big O Notation refers to the complexity of an algorithm or programming function, particularly describing the execution time that will be taken to complete this action. Often referred to when dealing with iteration within the function.

Let’s Start a Web Design Project

Talk with a Web Strategist.

Array