In the last chapter, you saw how to create headings of various sizes in HTML:
<h1>I'm an h1 heading!</h1>
<h2>I'm an h2 heading!</h2>
<h3>I'm an h3 heading!</h3>
<h4>I'm an h4 heading!</h4>
<h5>I'm an h5 heading!</h5>
<h6>I'm an h6 heading!</h6>Each "h" number, from 1 to 6, produces a different heading size.
Creating paragraphs is much easier. There's only one default type of paragraph! You've already seen the tag you use for paragraphs in this course. It's simply <p>, verbally known as a "p" tag.
To combine headings and paragraphs in a real-life example, let's recreate the beginning of the Wikipedia article about polar bears as seen below:
Take note of a few things before we start creating and structuring this text ourselves:
The first heading, "Polar bear," is larger than the section subheading "Naming and etymology"
There is a clear line break between each paragraph.
By correctly selecting our HTML elements, we can recreate the above heading and paragraphs structure exactly.
To begin, we'll need the raw text:
Polar bear
From Wikipedia, the free encyclopedia
The polar bear (Ursus maritimus) is a carnivorous bear whose native range lies largely within the Arctic Circle, encompassing the Arctic Ocean, its surrounding seas and surrounding land masses. It is a large bear, approximately the same size as the omnivorous Kodiak bear (Ursus arctos middendorffi).[3] A boar (adult male) weighs around 350–700 kg (772–1,543 lb),[4] while a sow (adult female) is about half that size. Although it is the sister species of the brown bear,[5] it has evolved to occupy a narrower ecological niche, with many body characteristics adapted for cold temperatures, for moving across snow, ice and open water, and for hunting seals, which make up most of its diet.[6] Although most polar bears are born on land, they spend most of their time on the sea ice. Their scientific name means "maritime bear" and derives from this fact. Polar bears hunt their preferred food of seals from the edge of sea ice, often living off fat reserves when no sea ice is present. Because of their dependence on the sea ice, polar bears are classified as marine mammals.[7]
Because of expected habitat loss caused by climate change, the polar bear is classified as a vulnerable species, and at least three of the nineteen polar bear subpopulations are currently in decline.[8] However, at least two of the nineteen subpopulations are currently increasing, while another six are considered stable.[9] For decades, large-scale hunting raised international concern for the future of the species, but populations rebounded after controls and quotas began to take effect.[10] For thousands of years, the polar bear has been a key figure in the material, spiritual, and cultural life of circumpolar peoples, and polar bears remain important in their cultures. Historically, the polar bear has also been known as the white bear.[11]
Naming and etymology
Constantine John Phipps was the first to describe the polar bear as a distinct species in 1774.[1] He chose the scientific name Ursus maritimus, the Latin for 'maritime bear',[12] due to the animal's native habitat. The Inuit refer to the animal as nanook (transliterated as nanuq in the Inupiat language).[13][14] The Yupik also refer to the bear as nanuuk in Siberian Yupik.[15] The bear is umka in the Chukchi language. In Russian, it is usually called бе́лый медве́дь (bélyj medvédj, the white bear), though an older word still in use is ошку́й (Oshkúj, which comes from the Komi oski, "bear").[16] In Quebec, the polar bear is referred to as ours blanc ("white bear") or ours polaire ("polar bear").[17] In the Norwegian-administered Svalbard archipelago, the polar bear is referred to as Isbjørn ("ice bear").
The polar bear was previously considered to be in its own genus, Thalarctos.[18] However, evidence of hybrids between polar bears and brown bears, and of the recent evolutionary divergence of the two species, does not support the establishment of this separate genus, and the accepted scientific name is now therefore Ursus maritimus, as Phipps originally proposed.[1]This text currently has no HTML applied to it.
Let's start with the first line, "Polar bear." Since this is the title of the article, it makes sense to put this in an <h1> tag.
The first line in this example would then become:
<h1>Polar bear</h1>There's another heading in this article to tackle: "Naming and etymology", which is a subheading. It is larger than the surrounding text but not as a big as the page title. Since it's still an important indicator of the content that will follow, let's put it in an <h2>?
<h2>Naming and etymology</h2>By creating headings with <h1> and <h2> tags, the page already gains a lot of helpful structure:
However, on Wikipedia itself, there are separated paragraphs per section. Even though there are empty lines in our HTML code right now that separate each paragraph, they count for nothing - the program can't see them!
This is because HTML collapses whitespace. Even if we add 5 blank lines between simple lines of text, HTML will still collapse them all onto one another:
Text 1
Text 2
In other words, when writing HTML, you must manually create the meaning you want your content to have by wrapping it in the proper element tags. Because you want paragraphs, you must add <p> tags. You cannot just add line breaks in your code between text that you want to appear as separate paragraphs.
You would then go ahead and throw some <p> tags around each paragraph, such as:
<p>From Wikipedia, the free encyclopedia</p>Adding a <p> opening tag and a </p> closing tag turns each text block into a paragraph. With the code below, we'd have exactly the result we want:
2 headings, the first of which ("Polar bear") is bigger than the other
Clearly separated paragraphs
<h1>Polar bear</h1>
<p>From Wikipedia, the free encyclopedia</p>
<p>The polar bear (Ursus maritimus) is a carnivorous bear whose native range lies largely within the Arctic Circle, encompassing the Arctic Ocean, its surrounding seas and surrounding land masses. It is a large bear, approximately the same size as the omnivorous Kodiak bear (Ursus arctos middendorffi).[3] A boar (adult male) weighs around 350–700 kg (772–1,543 lb),[4] while a sow (adult female) is about half that size. Although it is the sister species of the brown bear,[5] it has evolved to occupy a narrower ecological niche, with many body characteristics adapted for cold temperatures, for moving across snow, ice and open water, and for hunting seals, which make up most of its diet.[6] Although most polar bears are born on land, they spend most of their time on the sea ice. Their scientific name means "maritime bear" and derives from this fact. Polar bears hunt their preferred food of seals from the edge of sea ice, often living off fat reserves when no sea ice is present. Because of their dependence on the sea ice, polar bears are classified as marine mammals.[7]</p>
<p>Because of expected habitat loss caused by climate change, the polar bear is classified as a vulnerable species, and at least three of the nineteen polar bear subpopulations are currently in decline.[8] However, at least two of the nineteen subpopulations are currently increasing, while another six are considered stable.[9] For decades, large-scale hunting raised international concern for the future of the species, but populations rebounded after controls and quotas began to take effect.[10] For thousands of years, the polar bear has been a key figure in the material, spiritual, and cultural life of circumpolar peoples, and polar bears remain important in their cultures. Historically, the polar bear has also been known as the white bear.[11]</p>
<h2>Naming and etymology</h2>
<p>Constantine John Phipps was the first to describe the polar bear as a distinct species in 1774.[1] He chose the scientific name Ursus maritimus, the Latin for 'maritime bear',[12] due to the animal's native habitat. The Inuit refer to the animal as nanook (transliterated as nanuq in the Inupiat language).[13][14] The Yupik also refer to the bear as nanuuk in Siberian Yupik.[15] The bear is umka in the Chukchi language. In Russian, it is usually called бе́лый медве́дь (bélyj medvédj, the white bear), though an older word still in use is ошку́й (Oshkúj, which comes from the Komi oski, "bear").[16] In Quebec, the polar bear is referred to as ours blanc ("white bear") or ours polaire ("polar bear").[17] In the Norwegian-administered Svalbard archipelago, the polar bear is referred to as Isbjørn ("ice bear").</p>
<p>The polar bear was previously considered to be in its own genus, Thalarctos.[18] However, evidence of hybrids between polar bears and brown bears, and of the recent evolutionary divergence of the two species, does not support the establishment of this separate genus, and the accepted scientific name is now therefore Ursus maritimus, as Phipps originally proposed.[1]</p>
In the next chapter, let's see how to add text that looks bold and italicized to add even more meaning and structure to your web content. You'll then have the opportunity to do an interactive exercise that puts the concepts from the past two chapters together.
