Basic Overview

Browsers & HTML

Typically web pages are written in Hypertext Markup Language (HTML) which is a standardised coding system for tagging text files to instruct browsers how to display their content in terms of font, colour, and layout.  HTML often uses Cascading Style Sheets (CSS) which is a coding language that helps organise the style tags in a reusable format (i.e. a set of style tags is defined in one place but can be applied to content elements across the site).

Browsers can interpret and display HTML/CSS documents.  HTML documents can include JavaScript, which is a programming language used for more complex tasks.  Browsers can also display a range of other resource types like PDF documents and images.  Browser plugins can be installed to display additional specific resource types.  If the resource is not a type that the browser can display, it will open the dialogue for you to download the file onto your computer.

Browsers can be used to display an HTML file that is stored on your computer but usually your browser is sending requests over a network (the Internet or a local Intranet) to retrieve web pages or documents from a remote server, the host web-server.

Web Links & URLs

A web link is some text or a graphic displayed in a document or web page that you can click on to open another document or web page.  The link contains a URL (Universal Resource Locator) that is not displayed in the document or web page.  On some applications or browsers, the link URL is displayed while you have your mouse pointer over the link.  A URL for the home page of a website might look like this:

http://www.my-site.com

This comprises the protocol (http) and the host name (www.my-site.com).  The URL for a page other than the home page will include the page name like this:

http://www.my-site.com/my-page.html

If the website is organised in a folder structure on the host server, then the URL needs  to identify the folder that the page is in and so could look like this:

http://www.my-site.com/my-folder/my-page.html

Some web pages, like search pages, allow you to enter text that is processed and the result returned.  In this case the URL needs to include the search text:

http://www.my-site.com/my-folder/my-page.php?my-parameter=my-value

When you click on any such link, your browser sends a request to the host which responds with the requested resource for your browser to display.

Web Server

Your browser uses a URL to send a request for a document to the host web server.  If the requested document is HTML, the web server will return the HTML to the browser to display.  (This is a very simplified version of what happens; for example, it does not address caching which is the subject of another post).

Back to the Browser

Current versions of HTML and CSS are powerful enough to allow the web developer a great deal of freedom in their design.  JavaScript can be used to develop additional functionality within a web page.  You can develop almost anything in terms of the design and user interface that is presented to the user in a browser.  This is fine for web pages with a known fixed content, but it is not so good for dynamic content.

A good example of dynamic content is the results page you get when you do an Internet search.  Dynamic content requires processing that includes reading and writing to files or databases on the server.  Similarly Content Management Systems like WordPress, store page content (text, images, etc.) in a database.  The web page is a template that needs to retrieve content for display.  Giving the browser direct access to the server database or write access to server files would create a number of problems.

The main problem is that from the point of view of the server, the browser is not to be trusted.  While the HTML and JavaScript downloaded from the server might be written to ensure the integrity of how such functions are carried out, the server would have no way of knowing that requests were indeed coming from the downloaded page.  Other problems with doing all the processing on the browser would be the impact on the performance of the browser and the increased network traffic.

Browsers are excellent at displaying pages and that is really all they should be asked to do.  Processing for dynamic content and providing access to server resources is better handled on the server; and PHP provides this capability.

PHP & Databases

Hypertext Preprocessor (PHP) is a scripting language designed for web development.  When the web server gets the request for a document, it determines if the requested document is to be returned to the browser or if something else needs to happen first.  If the document is a PHP file, the server submits it to the PHP interpreter.  The PHP interpreter goes through the file, executing any PHP scripts it finds, and returns the output, which should be well formed HTML, to the web server which sends it back to the browser to display.

WordPress is written almost entirely in PHP and stores content and configuration data in a relational database.  For example, this post is not stored as a file; rather it is stored as data in the database.  When you browse to this page, WordPress uses PHP to retrieve the data from the database and construct the HTML web page.  You can use the View Source facility of your browser to see the HTML, CSS, and JavaScript that the WordPress PHP generates for this web page.

Leave a Reply

Your email address will not be published.