How to not mix presentation with logic?

Question

I use PHP quite a bit, and whenever I see a "PHP-hate" thread on some forum or even popular PHP-related discussions here, I usually see something along the lines of:

PHP is too messy/sloppy/crappy, because you have a tangled web of presentation and logic.

Then I see the PHP-Defenders replying to some version of the above saying that is isn't necessarily true. I got to thinking "How is this possible...?" and "What counts as mixing presentation with logic?" I couldn't figure it out, so now I'm here.

Which of these is the best practice? Or is there an even better way that I'm not aware of?

<?php
    if(!function()) {
        echo '<div id="results">The result is a lie.</div>';
        }
?>

Or

<div id="results">
    <?php
        if(!function()) {
            echo 'The result is a lie.';
            }
    ?>
</div>

I know the above examples don't really look like a big deal, but after browsing through web apps of mine, I realized it was all kind of messy (because I was mixing HTML and PHP), so I was hoping there was a good way to develop while keeping things nice and neat.

Answer 1

Maybe you want to look at a template engine, like smarty. That can separate it for you.

Linkage: http://www.smarty.net/

Some (hopefully balanced) additions seeing the rather large comment-section below:

There seems to be a lot of discussion on smarty. There are two extra camps in this as far as I can tell,

one says: Template engine, ok, but smarty is not the best; use (insert your choice here). e.g.: twig or dwoo.

and another one says: Do not use a seperate template engine! As PHP is perfectly capable of doing this itself. Examples from the comments include:

Use Zend_View and Savant

Answer 2

Think of logic and presentation where the logic is a type of electrical socket and the presentation is a light bulb. Now you can have a number of sockets in your house, some with different sized threads. You can also have a bunch of light bulbs, of different colors, some cheap ones, some expensive ones. The point is that one light bulb could go into one or more socks, and one socket can accept more than one bulb, but you can only match one bulb to one socket at a time.

So if you have a really nice bulb (or really nice html template) you want to be able to move that bulb around to where you need it (or apply the same logic). And if one day you decide you want to use a blue light bulb, you can simply change the bulb, you don't have to install a whole new electrical socket just to change the color.

Getting back to logic and presentation, if you have the common case where you have a form on a web page, sometimes you show that form the first time a user loads the page, and sometimes you want to show it after the user has filled in some of the inputs, but maybe there were errors or missing information. In this case the logic would either do nothing, just show the form, or try to process the form, find the error, and then display the form revealing the errors.

You can do this with mixed logic and presentation in the same file, sure, but what happens when more than one person starts to edit your script? Maybe the script breaks and they don't know what to do so they comment out some important section to get it working again. That is like someone going to change a bulb and then deciding to rewire your light switches. But sometimes when you are confronted with bad wiring there is no other way to fix the problem, the problem goes from a simple "Please change the light bulb" to "Make the lights work." In a properly designed system, where components are isolated in a sensible way, things are usually easier to fix.

In other words, mixing logic and presentation is like hardwiring your lightbulbs using bare wire, and then connecting the wires to the mains without even a circuit breaker for safety.