forked from CodeYourFuture/HTML-CSS-Coursework-Week1
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
103 lines (103 loc) · 5.28 KB
/
index.html
File metadata and controls
103 lines (103 loc) · 5.28 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, shrink-to-fit=no"
/>
<title>Aquatic macroinvertebrates</title>
<link
href="//fonts.googleapis.com/css?family=Roboto:400,500,300"
rel="stylesheet"
type="text/css"
/>
<link rel="stylesheet" href="css/style.css" />
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
</head>
<body>
<!-- Add your HTML markup here -->
<!-- Remember: Use semantic HTML tags like <header>, <main>, <nav>, <footer>, <section> etc -->
<header>
<nav>
<ul>
<li><a class="nav-link" href="#what">What are aquatic macroinvertebrates?</a></li>
<li>
<a class="nav-link" href="#why">Why are they important?</a> </li>
<li>
<a class="nav-link" href="#id">How to identify them</a>
</li>
</ul>
</nav>
<div>
<h1>Aquatic macroinvertebrates</h1>
<p>
A short introduction to the world of aquatic macroinvertebrates.
</p>
</div>
</header>
<main>
<section>
<article id="what">
<h3>What are aquatic macroinvertebrates?</h3>
<figure>
<img alt="The River Teme close to Burrington Bridge - geograph.org.uk - 1438724"
src="https://upload.wikimedia.org/wikipedia/commons/1/1d/The_River_Teme_close_to_Burrington_Bridge_-_geograph.org.uk_-_1438724.jpg">
<figcaption>River Teme near Burrington Bridge.</figcaption>
</figure>
<p>
Aquatic macroinvertebrates are small organisms that have no internal skeletal system and live part or all of their lives
in water. They are ubiquitous in freshwater ecosystems around the world and are found in both lotic systems—systems of
flowing water, such as streams, rivers and springs, as well as in lentic systems—systems with standing or still waters,
such as lakes and ponds.
</p>
<p>
They comprise a
rich and diverse group of organisms that includes insect larvae, worms, snails, crayfish, and other crustaceans, such as
clam shrimp, fairy shrimp, and water fleas. They also include many invertebrate species that are typically associated
with terrestrial habitats, but spend some portion of their life as aquatic organisms (for example butterflies and moths
in the family Pyralidae).
</p>
<a class="links" target="_blank" href="https://www.nps.gov/articles/aquatic-macroinvertebrates-introduction.htm">Learn more</a>
</article>
<article id="why">
<h3>Why are they important?</h3>
<figure>
<img src="https://upload.wikimedia.org/wikipedia/commons/0/0d/Stonefly_nymph_%285787610055%29.png" alt="a stonefly">
<figcaption>An example of aquatic macroinvertebrate: a stonefly larva.</figcaption>
</figure>
<p>
Because different types of macroinvertebrates tolerate different stream conditions and levels of pollution, their
presence or absence is used to indicate clean or polluted water. For example, most larvae of caddisflies, mayflies, and
stoneflies cannot survive in polluted water so streams with these bugs are assumed to have good water quality. The
absence of these organisms in a water body, however, does not necessarily indicate that the water quality is poor. Other
natural factors, such as temperature and flow, also come into play.
</p>
<a class="links" target="_blank" href="https://extension.usu.edu/waterquality/learnaboutsurfacewater/propertiesofwater/aquaticmacros">Learn more</a>
</article>
<article id="id">
<h3>How to identify them</h3>
<figure>
<img src="https://3jgs2o4a02n22u73bi2gnd3l-wpengine.netdna-ssl.com/wp-content/uploads/macro-key-cover-one-logo-border-560x421.jpg" alt="key front page">
</figure>
<p>
If you want to identify an aquatic macroinvertebrate you found in a stream, you can use this
<a class="links" target="_blank"
href="https://3jgs2o4a02n22u73bi2gnd3l-wpengine.netdna-ssl.com/wp-content/uploads/StroudWebsiteMacroKeyFNL.pdf">identification key</a>
from Stroud Water Research Center.
This key is an example of a dichotomous key — at each step you choose between two mutually exclusive statements about a
characteristic. The key starts with the choice between “jointed legs” and “no jointed legs.” After you make that choice
you move to the next pair of choices in the key. Follow the page reference (e.g. “Go to Slide 3”) to jump to the next
part of key. Continue until you arrive at an identification.
</p>
<p>
Another very good interactive key, although for North America, is at <a class="links" target="_blank" href="https://www.macroinvertebrates.org/">macroinvertebrates.org</a>
</p>
</article>
</section>
</main>
<footer>
Copyright for this content rests with the original authors (referenced in links).
</footer>
</body>
</html>