How to Define HTML Headers and Create Footers
The HTML5 header element is typically the first element after the beginning of the body element in an HTML5 web page. A footer element is placed at the end of an HTML5 page. It holds “end of page” stuff, like navigation bars (which should be enclosed in HTML5 <nav> tags, within the header).
Don’t confuse the <header> element, which we are introducing here, with the <head> element. The <head> element is used to define parts of your HTML document that will not show up in a browser (like the page title). On the other hand, the <header> element defines content that does appear in your page, within the body of the page.
A header element encloses all the content that goes at the top of a web page. You use HTML elements like <p>, <h1>, and so on to define content within the header element.
Here’s how the HTML5 code would look for a simple, basic HTML5 header:
<body>
<header>
<h1>Header Content Goes Here</h1>
</header>
</body>
This snippet includes an <h1> tag (and some placeholder text) within the header.
Don’t expect the footer element to look like much of anything until a CSS style is defined. Even without a defined style, HTML5 footers demarcate content to facilitate SEO.
The following code provides an example of a footer element after the closing of an article, and before the closing <body> tag:
</article>
<footer> <h5>Page footer content goes here</h5></footer>
</body>
Web Design & Development Glossary
AJAX
asynchronous JavaScript and XML. A technique used in web page development.
Web Design & Development Glossary
API
application programming interface. A set of rules programs use to communicate with each other.
Web Design & Development Glossary
color stop
A special element that indicates a color to be added to a gradient.
Web Design & Development Glossary
FTP
File Transfer Protocol. A network protocol useful for transferring files in a client-server relationship.
Web Design & Development Glossary
HTML
HyperText Markup Language. The predominant language for building web pages.
Web Design & Development Glossary
HTTP
HyperText Transfer Protocol. The primary networking language for the Internet.
Web Design & Development Glossary
PHP
PHP Hypertext Processor. A scripting language that works well within HTML.
Web Design & Development Glossary
socket
A technology that allows remote computers to maintain a persistent connection in order to communicate with each other.
Web Design & Development Glossary
sprite
An graphic object on a web page that will be manipulated in real time.
Web Design & Development Glossary
SQL
Structured Query Language. A programming language useful in managing relational databases.
Web Design & Development Glossary
stateless protocol
An Internet procedure that completely breaks the connection between the client and the server after a transaction, meaning that the next transaction will require an entirely new connection.
Web Design & Development Glossary
Telnet
A network protocol useful in interactive, text-oriented communications.
Web Design & Development Glossary
W3C
World Wide Web Consortium. The organization that sets international standards for the World Wide Web.
