Our Little Church DIY:
HTML Semantic Elements

In this training, I will be referring you to w3schools.com in many situation, since they already wrote a good reference.

HTML Semantic Elements

Please study HTML Semantic Elements. We will then study how Our Little Church uses Semantic Elements.

HTML Comments

Comments are used to help the developers communicate with each other. Please study HTML Comments.

PHP Include Files

In order to have the Header, Navigation Menu, and Footer; be consistent, we break them into their own file. In order to include these files into HTML, we use PHP. Please study PHP Include Files.


<!DOCTYPE html>
<!--
 * This is the Written For Christ DIY Home web-page, for Our Little Church.
 * Author: John Fischer III of Written For Christ in 2021.
 * Updated: 
-->

<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <?php include("view/head.php"); ?>
        ...
    </head>
    <body>
        <?php include("view/header.php"); ?>
        <?php include("view/nav.php"); ?>
        ...
        <?php include("view/footer.php"); ?>
    </body>
</html>

Reviewing the file:

The first line of the file is the DOCTYPE set to HTML. Next are the comments for the file description. Now we have the first <html> with a little detail including the language; and the closing </html> is at the end.

The Head of the HTML starts and ends with an <head> tag. The Head contains the details such as the links for the CSS files, JavaScript files, Title tag, and Meta tags. Since most of the files used in the Head are the same, there is an head.php file in the view directory, included using PHP.

The Body of the HTML starts and ends with the <body> tag. The Body contains the Header (header.php file), Navigation Menu (nav.php), and Footer (footer.php) Semantic Elements. These files are also within the view directory. The ... is where the Article Semantic Elements is located.