Stage 2: Building Your List of Nations

STEP 1

Review: What You Built in Stage 1

In Stage 1, you built the foundation of your HTML page. Your code editor already has what you created - a page with <h1>, two <h2> headings, and <p> paragraphs about Minnesota's Tribal nations.

Look at the preview panel → and you should see your page. In this stage, we'll make it even better by adding lists to organize the 11 Tribal nations.

💡 Did You Know?

Lists are one of the most common HTML elements on the web - menus, navigation, search results, and shopping carts are all built with lists!

STEP 2

Two Kinds of Lists

HTML has two main types of lists:

Unordered list <ul> - creates bullet points. Use this when the items could be listed in any order - like a list of nations, ingredients, or features.
Ordered list <ol> - creates numbered items automatically. Use this when the sequence matters - like steps in a recipe, ranked results, or historical events in order.

Both types use <li> (list item) for each entry. The <li> tags always go inside the <ul> or <ol> - never floating on their own.

🔠 List Structure

Think of <ul> or <ol> as a container, and each <li> as one item inside that container. The browser automatically adds bullet points or numbers - you don't have to type them yourself!

STEP 3

List the Four Dakota Nations

Let's add a <ul> under your Dakota <h2> to list the 4 Dakota communities.

Shakopee Mdewakanton

Scott County

Prairie Island

Goodhue County

Lower Sioux

Redwood County

Upper Sioux

Yellow Medicine County

👉 Add this AFTER your Dakota <p> tag: <ul>
  <li>Shakopee Mdewakanton Sioux Community</li>
  <li>Prairie Island Indian Community</li>
  <li>Lower Sioux Indian Community</li>
  <li>Upper Sioux Community</li>
</ul>

Watch the preview → four bullet points should appear under your Dakota heading. We're using <ul> here because these nations are all equally important - there's no ranking or sequence. A numbered list would imply one nation is "first," which isn't what we mean.

STEP 4

List the Seven Anishinaabe Nations

Now do the same for the 7 Anishinaabe communities.

White Earth Nation

Northwestern MN

Red Lake Nation

Northern MN

Leech Lake Band

North-central MN

Fond du Lac Band

Northeastern MN

Bois Forte Band

Northeastern MN

Grand Portage Band

Cook County

Mille Lacs Band

Central MN

👉 Add this AFTER your Anishinaabe <p> tag: <ul>
  <li>White Earth Nation</li>
  <li>Red Lake Nation</li>
  <li>Leech Lake Band of Ojibwe</li>
  <li>Fond du Lac Band of Lake Superior Chippewa</li>
  <li>Bois Forte Band</li>
  <li>Grand Portage Band of Lake Superior Chippewa</li>
  <li>Mille Lacs Band of Ojibwe</li>
</ul>

STEP 5

Use an Ordered List for a Fun Fact

Use <ol> when the order matters. Let's add a quick-fact section with a numbered list.

👉 Add this AFTER your Anishinaabe </ul> tag: <h2>Quick Facts</h2>
<ol>
  <li>Minnesota has 11 federally recognized Tribal nations.</li>
  <li>4 nations are Dakota, and 7 are Anishinaabe (Ojibwe).</li>
  <li>Each nation is sovereign - they have their own government.</li>
  <li>Tribal nations existed in Minnesota long before statehood in 1858.</li>
</ol>

Notice the numbers appear automatically - you don't type "1.", "2.", "3." yourself. <ol> handles that for you. If you add or remove an item later, the browser renumbers everything automatically too.

🎯 ul vs. ol - When to Use Each

Use <ul> for things where order doesn't matter - like a list of nations (no nation is "first"). Use <ol> for steps, rankings, or timelines where sequence is meaningful. Choosing the right one makes your page more accurate and easier for screen readers to describe.

STEP 6

Make It Your Own!

Try adding your own list item. You could add:

A fifth quick fact you know about MN Tribes
A <li> with the name of a Tribal nation you'd like to learn more about
A new <ul> with a list of questions you have about the Tribes

🌟 Stage 2 Complete!

You've learned <ul>, <ol>, and <li>. In Stage 3, we'll nest lists inside other lists to build even richer structure!