Back to the Basics: How Do Websites Work?
Posted on April 30, 2018
Many web developers could tell you that they dream in 1’s and 0’s or that counting sheep is really just an iterative loop that increases the value of a variable. To us, it’s easy. To the average person, getting a website up on the internet is magic.
So, let’s go back to the basics and explain what’s involved in building a website and getting it out there on the internet for the world to see. Curious about how the web came to be? Check out the interesting timeline of events from thehistoryoftheweb.com!
It All Starts with HTML
Hypertext Markup Language (HTML) is the basis of how websites are formed. Essentially, it’s a coding language with a specific collection of tags that allow web developers to tell browsers how to display, or render, elements on a page. HTML files are created on a computer by using the .html or .htm file extension, with the homepage usually being named “index.html”. Developers can use a variety of different text editor applications, based on their personal preferences, to write code in. Web browsers can then read the HTML code and display the web page to the user. As the holy bible of web development, The World Wide Web Consortium (W3C) establishes a set of standards and guidelines that tell developers how to effectively structure and organize their websites and HTML documents.
Styles on Styles on Styles
On it’s own, HTML doesn’t look very exciting when displayed in the browser. The next step would be to apply a variety of styles to your website that are defined in your CSS (Cascading Style Sheet). Like HTML, CSS uses a collection of code, or properties, that tell the browser how to display something. CSS is used to apply things like fonts, colors, backgrounds, positioning, and a whole lot more to your HTML code. Think of it like the paint to your canvas. You might want to set a background color for a boxed element in your HTML document. CSS uses a set of properties and values that tell the browser to change the background color value of the box.
A Touch of JavaScript
After all of the website’s styles are in place, there may be special functionality that web developers need to incorporate into the website that isn’t achievable with just HTML and CSS. Knowing a bit of JavaScript can allow developers to add an extra layer of functionality and interactivity to the website. JavaScript is also useful when you need something to happen based on specific actions the user has made on the site, such as when a button is clicked or a certain part of the page has scrolled into view.
Taking It All Online
Once a web developer builds a website, it’s time to look into purchasing a domain and hosting for the website. There are a variety of different companies offering these services, but BlueHost or Namecheap are often recommended in the industry. Depending on the domain name you want for your website, you can usually find one for a relatively decent price. Once that’s all purchased, it’s simply a matter of connecting to the hosting server, transferring the website’s files through FTP (File Transfer Protocol) software, and making sure the DNS (Domain Name Server) records are all set to point to the hosting environment.
And That’s It!
While this is just a very basic example, websites can grow and extend beyond the basics by implementing JavaScript libraries, databases, content management systems and other tools that improve how websites are built.
Don’t forget: Your website is like a living, breathing entity that requires upkeep and maintenance. As a digital platform for your business, your website requires on-going content marketing and SEO in order to stay relevant in search results such as Google.