Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Multiple <head> and <body> tag

Tags:

html

css

php

I am trying to create a very simple web application, basically to understand the best practices of coding in HTML5, CSS and JavaScript.

My application has 3-4 pages and each one is using same menu header. So I want to make it reusable by writing it in a separate file (either PHP or HTML).

head.php (it is to be made reusable):

<!DOCTYPE html>
<html>
<head>
    <link href="../../css/headermenu.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<ul id="menu">
    <li><a href="#" class="home">Home<span></span></a></li>
</ul>
<p> 
</p>
</body>
</html>

front.php:

<?php
    include ("$_SERVER[DOCUMENT_ROOT]/page/common/head.php");
?>

HTML markup (dirty code):

<!DOCTYPE html>
<html>
<head>
    <!DOCTYPE html>
<html>
<head>
    <link href="../../css/headermenu.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<ul id="menu">
    <li><a href="#" class="home">Home<span></span></a></li>
</ul>
<p> 
</p>
</body>
</html></head>
<body>
    <div>
    </div>
    <p>
    </p>
</body>
</html>

I have following questions:

  1. head.php has both <body> and <head> tag. So where should I write these PHP lines to include it? (in <head> or <body>) (I don't want to have multiple <head>s and <body>s in the final page)

  2. What are the other best practice I should follow? (any link to references welcome)

I have already read w3schools.

like image 526
user811602 Avatar asked Dec 15 '22 23:12

user811602


1 Answers

In my opinion it would be a good idea to read about templating systems or have a look how frameworks/CMS handle this.

Doing it your way, you can't completly avoid repeating e.g. the closing head tag </head> in every content.php.

So this is just an idea:

head.php

<?php
    // Some other includes / requires,
   // code snippets...
?>
<!DOCTYPE html>
<html>
    <head>

        <!-- site-wide stylesheets -->
        <!-- & js-files -->
        <link href="css/main.css" rel="stylesheet" type="text/css"/>
        <script type="text/javascript" src="my/global/scripts.js"></script>

content.php

<?php
    include ($_SERVER['DOCUMENT_ROOT'] . '/page/common/head.php');
?>

    <!-- put page specific scripts &     
    <!-- styles here -->
    <link href="my/pages/css/style.css" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" src="my/pages/js/scripts.js"></script>
</head>
<body>
    <div id="container">
        <!-- content start -->
        <div id="content">
            <h1>title</h1>
            <p>Your content</p>
        </div>
        <!-- end of content div -->
<?php
    include ($_SERVER['DOCUMENT_ROOT'] . '/page/common/foot.php');

foot.php

        <div id="foot">
               copyright etc
        </div> 
    </div> <!-- end of container div -->
</body>
</html>
like image 91
toesslab Avatar answered Jan 02 '23 22:01

toesslab