How does PHP interact with HTML and vice versa?

Question

I'm learning how the internet and websites work. I think I understand how .php files get processed by the PHP processor:

Browser requests webpage ending in .php and sends request to server for that webpage.
Server asks 'can I find that page?'
If server does not find it, server sends back error.
If server finds page, server asks 'does file extension end in .html or .php'?
If it ends in .html, server send page back to browser.
If it ends in .php, hand page to PHP processor.
PHP processor scans the page, line by line. It build a processed HTML page.
If it finds HTML, it passes that on as part of the processed HTML page it is building.
If it finds PHP scripts, the PHP processor may or may not output HTML.
When the PHP processor is done, the processed page is handed to the web server for sending to the browser.

Does HTML still provide structure to a .php file, the same way HTML provides structure to a webpage that also uses CSS? When I say structure I mean divisions, and head and body sections. Structure as in the bare bones skeleton of the webpage. It seems that on some web pages, there's more PHP than there is HTML. Sometimes there's the bare minimum HTML, and the rest is PHP and Javascript, is this the way webpages were made to be?

In summary, a web page that has PHP code in it needs be have a .php extension. Once the PHP processor encounters <? PHP or <?, the server sends the code to the PHP processor (this wording is probably redundant). The output of the PHP processor can be anything.
Anything includes:

• Css
• HTML
• Javascript?
• XML?
• XHTML?
• Images
• Sound?
• Video?
• Animations such as flash?

Apparently forcing content type may be needed, but it can be done.
HTML is WYSIWYG.
To control and manipulate a web page after it has reached the user's browser, Javascript can be used. With the advent of mobile devices and a few different types of browsers, jQuery was invented to make the developing Javascript programs easier.

Answer 1

HTML is the language of the web. It is a markup language which means that the only thing we can use it for is to "markup" documents, i.e. design how content will look to the end user.

Imagine we had a page that showed the user the date.

We could use some HTML to do that:

<p>Sunday 26 August 2012</p>

But say we wanted to keep that page up to date. We'd have to go and manual change the date manually everyday. Because HTML is static, it can't be changed dynamically.

Perhaps it would be useful to be able to generate automatically adding the correct date to the page, depending on when the page is loaded.

That is where PHP comes in. PHP is a scripting language, and while it can be used for lots of things, one of its main uses is to generate HTML dynamically. So instead of writing in today's date - what we could do is use some PHP and say.

<p><? echo date("l j F Y");?></p>

This will print out for me "Sunday 26 August 2012" today, "Monday 27 August 2012" tomorrow, and so on.

I'd need to save this new version of my page as page.php instead of page.html, because I need my server (which is set up use the PHP) to send the page to PHP interpreter. It will look for the special <?php or <? and try to process what ever it finds. In this case it spits out the correct text for the date on my page and adds it to the page before sending it to the user.

We can do lots of cool stuff with PHP. It is "server side" technology, meaning that it does its work on the server and then sends us the finished page with all the dynamic content added.

Sometimes we might want to control and modify a page after it has reached the user's browser. For this we will need some "client side" technology, i.e. code that runs in the user's browser. And the most common client side language of choice is javascript.

Again we can do a lot with Javascript, but most often we use it in web pages to allow us to control elements of a HTML page after it has reached the user.

We might want to hide something on a page and then only show it once a user has clicked a button. We can do that with javascript.

Now because Javascript is "client side" technology, i.e. it runs in your browser it can actually be quite hard to use, because you will have to write code that works in a variety of different browsers, and now on mobile phones too! To make this job easier, very smart developers have taken a lot of the pain out of using javascript to control elements in web pages by creating libraries and frameworks to use. One of the most popular of these is the jQuery framework. I think jQuery is the most fun thing to learn, because it allows you to do all of the "cool stuff" in webpages - make stuff fade in, make stuff fade out, play sounds, move elements around etc etc

---

I hope this helps you work out how different technologies can help you achieve different things.

The TL;DR version of this would be:

HTML & CSS - sets out how your pages are going to look.

PHP - helps you to generate HTML dynamically.

JavaScript - helps you make your pages more interactive and can respond to clicks or other actions of your user.

Answer 2

The most important thing to understand is the difference between HTML and PHP. In HTML you write your code, upload it, and the user’s will subsequently download that page along with all the code. The user’s browser interprets this code and shows the user the page as you intended it (hopefully). In other words HTML is sort of what you see is what you get, in the sense that all the code goes to the user and is interpreted by the browser.

With PHP it works a bit differently because you don’t actually download the code the author wrote. What happens is that if you want to download a php page the code in that file is first processed by the server, and you download the output of the code, as opposed to the whole code as is. This in turn will be HTML just as before, this is why you never see PHP code in the source of a webpage.

With PHP the goal is to use the processing powers of the server to build (usually) dynamic webpages. A very basic example is showing the correct greeting for the time of day on a webpage.

Answer 3

Slight change...

PHP processor scans the page, character by character.
Until a <? PHP is found this text is sent directly to the web server in a type of copy mode.
(this text may be HTML, XML, JavaScript, or anything else).
Once in a <? PHP is found the input is directed to PHP, which does whatever it will with it.
Any standard "print" output from PHP is sent to the outgoing http stream.
Once a ?> is found the stream reverts to the original copy mode.

PHP has the ability to send HTML, CSS, JavaScript, or anything else. You may need to force content type, but it can be done.

Answer 4

There's nothing really special about PHP. The basic difference is between static files and dynamic files written in a programming language.

Static files are simply sent directly by the server to the browser. These aren't just HTML, this is also done for image files. And when you download applications or PDF, the same mechanism is used -- it might be a ZIP file, an EXE, a disk image (common for Mac downloads).

In the case of dynamic files, the file is executed in some way, and the output it produces is sent to the browser. The dynamic file can be in any language -- it could even be a binary compiled executable. However, scripting languages have generally been most popular, simply because they tend to be easier to write web applications in. And as a result, there are lots of libraries that have been written to support web applications -- it's a positive feedback situation. In the early days of the web, Perl was probably the most common language; we didn't have the plethora of scripting languages that we do now.

What makes PHP somewhat special is that it was designed specifically for scripting web pages. In all other languages, you have to write explicit commands to produce any output. The PHP processor simply outputs the file contents verbatim until it encounters the <?php marker (there are also some other markers that it recognizes). Then it starts executing the program until it sees ?>, at which point it reverts to verbatim output.

Another way to think of it is that anything outside is treated as if it were a big echo statement. In fact, this model is necessary to understand that you can actually switch modes in the middle of a statement. You can do:

<?php
if(something){
    ?>
    some text
    <?php
} else {
    ?>
    some other text
    <?php
}

This is obviously a silly way to output just one line, but imagine if it were a huge block of text. Basically, PHP's design allows you to write a normal HTML web page, and then embed programming code where you need it to produce dynamic content.

And while it's most common for PHP scripts to output HTML, they don't always. It's not uncommon to have a PHP script that outputs images. It might do it by using a database to store the image or the location of an image file. It also has built-in and library functions that can generate image data on the fly. For instance, if you go to a web site that produces graphs, those graphs could have been produced by a PHP script.