Understanding Websites: A Developer’s Perspective

Most people today take out their phone, or fire up their computer and look up information on the internet without thinking twice about what’s involved in making it work. We’re exploring some of the most important concepts involved and how information is delivered to you on the World Wide Web. Parts of this article may be a little complex, but stay with us, we’ll do our best to make it as easy to understand as possible.

Web Browsers

It’s important to point out there are several different software packages out there that can be used to load webpages including familiar names like Edge (formally Internet Explorer), Chrome, Firefox and Safari. These programs interpret the information sent from a website’s server and display it nicely on your computer, mobile, or tablet screen. Collectively, they allow you to browse webpages on the internet, and for that reason are usually called web browsers, or sometimes just browsers.

A Basic Webpage

A webpage consists of three key parts: HTML, CSS, and Javascript. These all work together to bring the amazing webpages to life on your screens.

HTML – Layout Land

Before talking about how the information flows back and forth, we should first talk about the webpage itself. What you see when you load a page isn’t just a jumble of text on the screen, right? There are layouts, fonts, colors, images, and maybe even videos that need to be arranged to appear on the page. All of this together is more than just letters and numbers; it’s called hypertext, and the language used to build it is called Hypertext Markup Language. You may recognize this more formally by its acronym: HTML. This HTML is the form in which information is sent from the website’s server to your browser.

CSS – Style Central

HTML alone isn’t the only thing that makes up a webpage. There is usually some styling for the page that is loaded in a different form. This styling is put together by using a set of rules that apply to elements of a webpage to format them correctly. These rules can overwrite each other as they are read sequentially into the browser, and for that reason the name given to these style rules is Cascading Style Sheets, or more commonly, CSS.

Javascript – Interactive Interwebs

There is one last major piece of the webpage puzzle, and that comes in the form of javascript. Javascript is a scripting language which is used by web browsers to make a webpage interactive. If you’ve ever clicked on a webpage and instead of loading a new page, the element moved or expanded to show additional information, that is done via javascript. Slideshows, tool tips, and pop-up boxes are all done with javascript and help make the interaction with a single page a more dynamic experience.

Getting the Data to Your Screen

When we talk about getting the webpage data to you, we usually refer to the protocol, or method, used to transfer it. This transfer protocol is what delivers all of that hypertext to you, and though you may not realize it, it’s probably a pretty familiar string of letters. It’s called Hypertext Transfer Protocol, and it’s in every web address you use with the abbreviation HTTP.

Wrapping It All Up

We’ve gone over the basic components of a webpage and how it gets delivered to you, but it should come as no surprise that it’s much more involved than what we’ve outlined here. But, having an understanding of the basic components helps a great deal when talking about what is a webpage and what it takes to put one together.

If you want to learn more about updating the HTML, CSS, or Javascript on your website (because now you know exactly what those mean), email us at inquiry@mediag.com or drop us a comment on Facebook or Twitter (@MediaG).