head in HTML
testYourself HTML1042
The HTML <head> element contains machine-readable information (metadata) about the document, like its title, scripts, and style sheets.
Title
The HTML <title>
element defines the title of the document that is shown in a browser's title bar or a page's tab. It can only contain text and tags are ignored.
<title>Webdevelopment</title>
Stylesheets
The HTML <head> element can contains style information for a document, or part of a document. It could be internal and external CSS.
The internal stylesheets represented by <style> tag allow placing your CSS declarations inside the HTML code.
<style>
body {
color: #fff;
}
</style>
the external styles are added by link tag:
<link rel="stylesheet" type="text/css" href="style.css" />
Scripts
No matter if we want to add an internal or external JavaScript code, we always use <script>
tag.
external JavaScript code:
<script src="app.js"></script>
internal Javascript code:
<script>
function awesomeFunc() {}
</script>
Favicon
The <header>
tag allows you to set the favicon. The favicon is displayed in the browser tab containing each open page, and next to bookmarked pages in the bookmarks panel.
<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon" />
Meta
The HTML <meta>
element represents metadata that cannot be represented by other HTML meta-related elements (e.g. <link>
, <title>
, <style>
, <script>
) .
keywords and description:
<meta name="keywords" content="javascript, css, html" />
<meta name="description" content="The page about webdevelopment" />
Specifying a great description is useful as it has the potential to make your page appear higher in relevant searches performed in search engines. The description is also used on search engine result pages.
The charset
attribute declares the page's character encoding (UTF-8 is the most used).
<meta charset="UTF-8" />
- https://developer.mozilla.org/en-US/docs/Web/HTML/Element/style
- https://developer.mozilla.org/en-US/docs/Web/HTML/Element/script
- https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta
- https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link
- https://developer.mozilla.org/en-US/docs/Web/HTML/Element/title