How WordPress works

WIP - Check back soon

In this article we look at how a website using WordPress works. Although the focus will be on WordPress we will also discuss in general how websites function behind the scenes.

In its simplest form a website consists of a client (The Web Browser running on the person viewing the website's computer) and a Web Server (an application running on the remote computer that is hosting the website.) When the client requests a Web page, the Web Server reads files (stored in a folder that the application has access to known as a Web Space) and sends out the contents using the Hyper Text Transfer Protocol (HTTP).

On a static site the files would sent would typically be:

Hyper Text Markup Language is text that contains not only the written contents of the Website but also information on how that information is to be displayed. The Web Browser takes the information in the HTML file and uses it to render a page as the Website designer intended it to be viewed.

HTML files will often reference images and other media resources. When a Web Browser loads a HTML page that page will then tell the browser to request additional resources that are part of the page. The images are still transferred using the Hyper Text Transfer Protocol which is able to transfer data other than text. The HTML tells the browser to request these additional resources and where to display them on the web page.

CSS stands for Cascade Style Sheet. CSS files would be referenced by the HTML as an additional resource in the same way as described above. CSS contains information on the styling and layout of the page. Layout and style information can be contained within the HTML itself (this is known as inline styling) and inline styling is still used, however having all the style information in HTML can be inefficient and messy. CSS style sheets allow layout and style information to be stored in an organised way, the same styles can be referenced multiple times by elements within the HTML.

Javascript (not to be confused with Java) is a programming language that is often used within web pages. Although Javascript can run on the server it is more commonly used as a front end scripting language. Front end means that the Javascript is run (executed) on the end users computer; in this case the script is executed by the website users browser. Like CSS the Javascript is usually contained in a separate file to the HTML (but again like CSS can be written inline in the same file as the HTML) the HTML tells the browser to request the Javascript and on request the Server sends it as text to the browser. It is then down to the browser to actually run the script.

Javascript can alter the page based on the users interactions, it is often used for adding animation and flare to websites.

Javascript (as a front end script) is great for web site owners as it saves load on the server. Because all the server does is send the text of the Javascript files out it does not put much stress on it. It is the browser that does the hard work running the script.

Because Javascript when used as a front end script is run on the website users computer not the website owners (the server) it has limitations. You couldn't run an online shop entirely on front end Javascript as the website users could alter how much they are paying by changing how the script determining their bill is run!

In the 90s most websites were static content sites. Although they can still be great for some purposes they have some limitations.

• A lot of websites require processes that can't be done completely at the front end. For example user logins, shopping carts and comment boards all require scripts to be run on the back end (on the server.)
• Editing a static content page would usually involve directly editing the HTML, CSS, Javascript etc. and so would not be quick or easy and would require a reasonable level of technical competence.

So the solution is to have a Dynamic Website with a database.

Broadly a dynamic website is a site where there is a scripting language that is run on the server (at the back end.) There are a lot of different scripting languages that can be run on the back end of a website, we will focus on a PHP which is one of the most common programming languages used on the web.

So what makes up a dynamic website?

PHP is a recursive acronym (the first P in PHP stands for PHP) so in full it stands for PHP Hypertest Pre-Processor.

While this guide focuses on WordPress it also gives a general overview of how a modern PHP based website with a database functions.