Are you still confused about what the three layers of web development are?
In this article, we will briefly explore what web development is, what is considered to be the three fundamental layers of web development, and what tools we use when working with these layers. But first, let’s start answering the basic question:
What’s web development?
Basically, web development is the field that covers the work that goes into creating websites for the internet, or websites for an intranet (a private network set up for companies).
Everyone that seeks to be a web developer by trade must be exposed to the three amigos, a.k.a. the three musketeers, a.k.a. los tres amigos, a.k.a. the basic building blocks of web development.
For the impatient, the short answer is:
- Structure (HTML)
- Style (CSS)
- Behavior (JavaScript)
The Triangle Addiction
Let’s face it…humans just love triangles!
A long time ago, some people were standing in the middle of the desert thinking, “You know what this place really needs? Some giant triangles!” And boom! Over the next thousand or however many years, they built the pyramids.
We froth for them, we design with them, build with them, and learn with them (if things are related to each other, like the recycling logo). They’re super strong, and helluva sexy.
For all web developers, the first triangle they learn to love forms the starting point of their careers and lays the foundation of knowledge upon which they will build. I am of course referring to HTML, CSS, and JavaScript. Now, for those unfamiliar with the subject and the three edges of this triangle:
HTML – The Builder
HTML or HyperText Markup Language can be thought of as the builder. It is responsible for the structure and is referred to as the content layer.
CSS – The Artist
CSS or Cascading Style Sheets can be thought of as the artist. HTML by itself is toast without butter, CSS gives us the flavor and makes the website look good.
JavaScript – The Magician
And last but not least, the Beauty and the Beast…JavaScript, this can be thought of as the magician. HTML combined with CSS looks good but it does not have functionality. We use JavaScript to create interactions with the web, such as animated images and clickable buttons.
Now…the three web development layers mentioned above: structure, style, and behavior must co-exist together and always be in the back of the mind of the developer. These days, we have so many tools at our disposal, and it is very easy to over-complicate things.
I have recently learned that the difference between a junior, mid-level, and a senior developer is not always dependent on the amount of time dedicated to your skill…the 10,000-hour rule is not the only factor contributing to success.
Someone may put time into the craft and never leave the realm of a mid-level developer. And oftentimes it comes down to simplicity and the ability to write simple code.
Even though there are various frameworks available for us to use on the front and backend, the core building blocks are still the three above-mentioned languages.
Side note: HTML and CSS are not strictly programming languages because you cannot add logic to them.
The web was not always as we know it now. Here’s a short and brief rundown.
A Brief History of The Web
By the end of 1990, a man by the name of Tim Berners-Lee working at CERN had developed the three fundamental elements that form the foundations of today’s web, HTML, URI, and HTTP.
HTML is the language of the web and can be considered as the content layer.
URI can be thought of as a unique address that is used to identify resources on the web.
Lastly, HTTP (Hypertext Transfer Protocol) is the protocol or official procedure used to format and transmit data between web browsers and servers.
Putting together these elements, the first web page went live in on the 6th August 1991. Thanks to a restoring project, you can access the first website ever created here. Isn’t it absolutely amazing?
Moving Forward
HTTP is still an ever-evolving markup language used to create electronic documents that are displayed on the World Wide Web. In 1994 while working with Tim at CERN, Håkon Wium Lie and co-author Bert Boss proposed CSS, a styling language that enables coders to add colors and choose fonts for the content of a web page.
Since the first introduction of CSS in 1996, the internet has changed tremendously compared to the first web page we saw earlier.
What Happens from Here?
With the introduction of CSS, websites started to look good but were still static. The only website interaction was through hyperlinks added to HTML content that enabled users to click and see more information (remember that first website).
Nowadays, websites can do extraordinary things: animated images, embedded videos and games, and even progressive web apps. We are so used to those interactive websites that we don’t stop to think that they only exist thanks to JavaScript, which made it possible to add functionalities and behavior.
In 1995, JavaScript was created by the brilliant mind of Brendan Eich. He created a new programming language called Mocha in only 10 days. Later, he renamed it to LiveScript and, finally, JavaScript.
The Web As We Know Today
The worldwide and wonderful web is responsive, adaptive, and continuously evolving. We now have so much versatility and options that we forget that this would not be possible were it not for the fundamental relationship that exists between fundamental components of the web: HTML, CSS, and JavaScript.
But how can we spot a great website from a bad one? The subtle but obvious difference is all based on how a developer combines these three layers to create the best user experience possible.
A website may be technically amazing and do wonderful things, but if people cannot use it and interact with it in a way that is meaningful to them then unfortunately the battle is lost.
For this reason, It’s extremely important that the communication between client and the software development team is clear and transparent.
At Appstrax, we build long-term relationships with our clients based on trust and transparent communication to ensure websites are not only functional but also engaging, easy to navigate and meaningful for end-users.
