The Anatomy of a Web Page
Have you ever looked at a web page and wondered how it was made? Yes? You are not the only one. As humans, we are naturally inquisitive. Here is a brief overview of the four main components of a web page: Structure, Design, Functionality and Content.
Structure
Think of the ‘Structure’ of a website as the skeleton of a human body – it is made up of bones that help to define our basic shape. This principle can be applied to web documents. They are a series of various interlinking elements, forming the backbone of the Web. These documents are formed using languages such as HTML to create the basic skeletal structure.
Design
Now that you have the foundation and structure of your website, you need to make it look good. This is where a User Interface developer will use a language like CSS (Cascading Style Sheets) to help your internet browser to determine the colours, layouts and fonts that the web page should be displayed in. CSS also helps to ensure that your website is scaling to various different screen sizes like mobile phones and laptop screens. This all adds to the overall positive user experience.
Functionality
A website can look good, but basic functionality will not cut it in this day and age. Users want to interact with web pages and it is in our best interest to let them. The longer they are on your website or webpage, the longer the impression will last.
To make a webpage interactive, developers use a language like JavaScript to control things like image sliders and parallax effects.
Content
There is a common saying that fits perfectly: “Content is King!”
You can have the best ‘looking’ website online and that may give a great first impression, but the content is what keeps the users coming back. And, quality content is what gets you to the top of the Google search results. Content helps Google understand what your website or webpage is all about, thus, helping it to rank you better. The more Google knows, the more they like you. The more they like, the higher you are listed on Google pages.
You don’t have to just stop at text content. Images are just as important to Google. If you give your images the appropriate ‘alt’ tags, you will be giving Google even more of the good stuff for ranking.
Conclusion
These are the 4 main components of a basic webpage’s anatomy. However, there are other languages like PHP and MySQL for dynamic, database driven websites – but that is a story for another day.