Static and dynamic web pages




Static and dynamic web pages.

In the first years of the web, all web pages used to be static.

Static pages are so called because they never change.

Every time a browser requests the page, the web server simply sends the page file back. And every time, the page received by the browser is exactly the same.

You can easily recognize static web pages because they have the .html or .htm extension.


1. The client (the web browser) asks the web server for the HTML page.

2. The web server simply sends the file back.


Today, however, most web pages change depending on when and by who the page is viewed.

For example, when you open a webmail service homepage (like Gmail), the result is different compared to when someone else opens the same page (each user sees its own emails).

Another example is a daily news homepage, which is different depending on the time of the day and on what the latest news are.

In these cases, the page file is not a static file, but it is a dynamic file created in real time by the remote server when the browser requests it.

These dynamic pages are created with a server-side language like PHP.




How a dynamic web page works.

When your web browser requests a static web page, the server simply sends the page file back. The page file on the server is the exact same file received by your browser.

But when your browser asks for a dynamic web page, the server behaves differently.

On the server, dynamic page files contain server-side code.

The web server does not send the file back to the browser. Instead, it executes the server-side code contained in the page file.

The result from this code execution is then sent back to the browser.

In other words, the server-side code tells the web server how to build the web page file for the client browser.


This is what happens with PHP pages, too.

PHP pages, or PHP scripts, have the .php extension and contain PHP server-side code that is executed by the server.

The result from this process is usually a "virtual" web page file, complete with client-side code (HTML, CSS and JavaScript). This is what is actually sent to the browser.

In other words, the page that the browser receives is not a real file, but a virtual file created in real time by the PHP script.


PHP uses dynamic data and programming logic to create the page.

For example, a webmail client page recognizes the user who is requesting the page, retrieves the user's messages and finally creates the HTML page specific for that user.




Let's compare static and dynamic requests again.

When your browser requests a static page, like www.yoursite.com/page.html, this is what happens:

  1. The server gets the page.html file and sends it back to the browser.
  2. Your browser receives the file, reads its content and displays the page.


When your browser requests a dynamic PHP page, like www.yoursite.com/page.php, this is what happens:

  1. The server gets a client requests for a PHP file:

  1. The server executes the page.php script using the PHP interpreter, and gets the output from the script execution.

  1. The server sends this output to the browser. Your browser receives the reply and handles it just like a normal web page file.


The PHP execution happens on the server. For this reason, PHP is called a server-side language.

Note that the client web browser never sees the PHP code. It only receives the output from the PHP execution.

As you will see in the next lesson, you can install the web server on your local computer and connect to it with your browser.

In this case, the server-side (the web server) and the client-side (your browser) are on the same physical computer. However, they are still logically separated. Your browser will see the HTML, CSS and JavaScript code, but the PHP code will only be seen and executed by the web server process.



Lesson recap.

  • A web page is a file containing client-side code: HTML, CSS and JavaScript. The browser receives this file from the web server, reads it and displays the page on screen.
  • Client-side languages, also called front-end languages, are the languages used in web page files. They are executed by the browser.
  • Server-side languages, also called back-end languages, are executed by the web server.
  • The client browsers never see the server-side code. They only receive the output from the server-side code execution.




Complete and Continue  
Discussion

0 comments