-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathTypes.html
More file actions
219 lines (204 loc) · 12.2 KB
/
Types.html
File metadata and controls
219 lines (204 loc) · 12.2 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
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8" data-comment="Specifies the character encoding"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge" data-comment="For IE compatibility"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0" data-comment="Configures viewpoint for responsive design"/>
<meta name="mobile-web-app-capable" content="yes" data-comment="Behave more like a native iOS app when added to the home screen"/>
<meta name="theme-color" content="#ccccc7" data-comment="Used by Chrome, Firefox OS, and opera to change the browser address bar"/>
<meta name="msapplication-TileColor" content="#00aba9" data-comment="Used by windows 8, 8.1, and 10 for the start menu tiles"/>
<meta http-equiv="refresh" content="360" data-comment="Meta tag to refresh the page every 360 seconds=1Hour"/>
<title>Types of Ecosystem</title>
<!-- Custom CSS & JS files-->
<link rel="stylesheet" href="../Style/Types.css" data-comment="Custom Stylesheets"/>
<link rel="stylesheet" href="../Style/style.css" data-comment="Custom Stylesheets"/>
<!-- <script src="./app.js" defer data-comment=" Custom JavaScript"></script> -->
<!-- Favicon -->
<link rel="icon" href="../img/logo.png" type="image/svg+xml" data-comment="Favicon for modern browsers (SVG format)"/>
<link rel="icon" href="../img/logo.png" type="image/x-icon" data-comment="Favicon fallback target older browsers like IE 10 and lower (ICO/PNG format)"/>
<link rel="apple-touch-icon" href="../img/logo.png" data-comment="Favicon for Apple Touch Icon (iOS home screen)"/>
<link rel="mask-icon" href="../img/logo.png" color="#193860" data-comment="Favicon for Safari pinned tabs (macOS)"/>
<!-- SEO Meta Tags -->
<meta name="author" content="Piyush Anand" data-comment="Author of Web Page"/>
<meta name="description" content="Learn about the major types of ecosystems including terrestrial, aquatic, and human-made ecosystems. Explore forests, grasslands, deserts, tundra, freshwater, marine, agricultural, urban, industrial, and greenhouse ecosystems." data-comment="Description of web page for SEO"/>
<meta name="keywords" content="types of ecosystems, terrestrial ecosystems, aquatic ecosystems, human-made ecosystems, forest ecosystem, grassland ecosystem, desert ecosystem, tundra ecosystem, freshwater ecosystem, marine ecosystem, agricultural ecosystem, urban ecosystem, industrial ecosystem, greenhouse ecosystem" data-comment="Keywords of web page for SEO"/>
<meta http-equiv="Content-Security-Policy" content="frame-ancestors 'self';" data-comment="Prevents from being embedded in an iframe to avoid clickjacking attacks"/>
<meta name="robots" content="index, follow" data-comment="To tell crawlers to crawl in this page"/>
<link rel="manifest" href="../manifest.json" data-comment="An information file for Browser and Progressive Web Apps"/>
<link rel="canonical" href="https://pr2309.github.io/CHE110_Project/Pages/Types.html" data-comment="tells the main link of site avoiding multiple ranking of sublinks"/>
<!-- SEO Multilingual Versions Tags -->
<link rel="alternate" hreflang="en" href="https://pr2309.github.io/CHE110_Project/Pages/Types.html"/>
<link rel="alternate" hreflang="x-default" href="https://pr2309.github.io/CHE110_Project/Pages/Types.html"/>
<!-- <link rel="alternate" hreflang="hi(main_Language_code)" href="URL_of_main_site"/> -->
<!-- OpenGraph Meta Tags - For Social Media Previews -->
<meta property="og:title" content="Types of Ecosystem – Terrestrial, Aquatic & Human-made" data-comment="Title of your webpage"/>
<meta property="og:description" content="Explore different ecosystem types including land-based, water-based, and human-made ecosystems. Learn about forests, oceans, agriculture, urban systems, and more." data-comment="Short description of your page"/>
<meta property="og:url" content="https://pr2309.github.io/CHE110_Project/Pages/Types.html" data-comment="site_url"/>
<meta property="og:type" content="website" data-comment="website_content_type"/>
<meta property="og:site_name" content="Ecosystem Project" data-comment="site_name"/>
<meta property="og:image" content="https://pr2309.github.io/CHE110_Project/img/TypesBG.webp" data-comment="preview_image_link - visble when shared"/>
<meta property="og:image:alt" content="Types Page Banner" data-comment="Alternate text if preview isn't displayed"/>
<meta property="og:image:width" content="1200" data-comment="width of preview image 1200px recommended"/>
<meta property="og:image:height" content="630" data-comment="height of preview image 630px recommended"/>
<meta property="og:locale" content="en_US" data-comment="language and region: here English(United States)"/>
<meta property="og:locale:alternate" content="en_IN" data-comment="language and region: here English(India)"/>
<!-- <meta property="og:locale:alternate" content="hi_IN" data-comment="here Hindi(India)"/> -->
<!-- Twitter Meta Tags - For Twitter Previews -->
<meta name="twitter:card" content="summary_large_image" data-comment="Tells the type of presentation, eg: summary, summary_large_image, app, player"/>
<meta name="twitter:title" content="Types of Ecosystem – Terrestrial, Aquatic & Human-made" data-comment="Title for Twitter card"/>
<meta name="twitter:description" content="Understand terrestrial, aquatic, and human-made ecosystems with examples like forests, deserts, oceans, agriculture, urban and industrial ecosystems." data-comment="Description for Twitter card"/>
<meta name="twitter:image" content="https://pr2309.github.io/CHE110_Project/img/TypesBG.webp" data-comment="preview image url"/>
<meta name="twitter:image:alt" content="Types Page Banner" data-comment="Alternate text if preview isn't displayed"/>
<meta name="twitter:image:width" content="1200" data-comment="width of preview image 1200px recommended"/>
<meta name="twitter:image:height" content="630" data-comment="height of preview image 630px recommended"/>
<!-- <meta name="twitter:site" content="@YourTwitterHandle" data-comment="Twitter handle of website"/> -->
<!-- <meta name="twitter:creator" content="@YourTwitterHandle" data-comment="Twitter handle of content creator"/> -->
</head>
<body>
<header>
<h1><strong>Ecosystem</strong></h1>
<h3><i>Types of Ecosystem</i></h3>
</header>
<nav id="navbar">
<ul>
<li><a href="../index.html">Home</a></li>
<li><a href="./Benefits.html">Benefits</a></li>
<li><a href="./Hazards.html">Hazards</a></li>
<li><a href="./Types.html">Types</a></li>
<li><a href="./Prevention.html">Prevention</a></li>
<li><a href="./Key-Terms.html">Key Terms</a></li>
<li><a href="./About.html">About</a></li>
</ul>
</nav>
<button id="idBtn" title="All Types">🗒</button>
<ul id="idList">
<li><a href="#navbar" title="Back to navigation">Index</a></li>
<li><a href="#terrestrial-ecosystems" title="Land Based">Terrestrial Ecosystem</a></li>
<li><a href="#aquatic-ecosystems" title="Water Based">Aquatic Ecosystem</a></li>
<li><a href="#human-made-ecosystems" title="Anthropogenic">Human-made Ecosystem</a></li>
<li><a href="#comparison" title="Comparison of Ecosystem Types">Ecosystem Comparison</a></li>
<li><a href="#footer" title="Author and Credits">Credits</a></li>
</ul>
<main>
<section id="terrestrial-ecosystems">
<h2>Terrestrial Ecosystems <code>[Land-Based]</code></h2>
<p>Terrestrial ecosystems are land-based ecosystems that include various types of forests, grasslands, deserts, tundra, and more. These ecosystems are home to a wide variety of flora and fauna, and their composition and diversity depend on factors such as climate, soil type, and topography.</p>
<ul>
<li id="Forest" title="Forest Ecosystem">
<a href="./Forest-Ecosystem.html">
<span>Forest Ecosystem</span>
<img src="../img/ForestBG.webp" alt="Forest Ecosystem" loading="lazy" />
</a>
</li>
<li id="Grassland" title="Grassland Ecosystem">
<a href="./Grassland-Ecosystem.html">
<span>Grassland Ecosystem</span>
<img src="../img/GrasslandBG.webp" alt="Grassland Ecosystem" loading="lazy" />
</a>
</li>
<li id="Desert" title="Desert Ecosystem">
<a href="./Desert-Ecosystem.html">
<span>Desert Ecosystem</span>
<img src="../img/DesertBG.webp" alt="Desert Ecosystem" loading="lazy" />
</a>
</li>
<li id="Mountain" title="Mountain Ecosystem">
<a href="./Mountain-Ecosystem.html">
<span>Mountain Ecosystem</span>
<img src="../img/MountainBG.webp" alt="Mountain Ecosystem" loading="lazy" />
</a>
</li>
<li id="Alpine" title="Alpine Ecosystem">
<a href="./Alpine-Ecosystem.html">
<span>Alpine Ecosystem</span>
<img src="../img/AlpineBG.webp" alt="Alpine Ecosystem" loading="lazy" />
</a>
</li>
<li id="Tundra" title="Tundra Ecosystem">
<a href="./Tundra-Ecosystem.html">
<span>Tundra Ecosystem</span>
<img src="../img/TundraBG.webp" alt="Tundra Ecosystem" loading="lazy" />
</a>
</li>
<li id="Polar" title="Polar Ecosystem">
<a href="./Polar-Ecosystem.html">
<span>Polar Ecosystem</span>
<img src="../img/PolarBG.webp" alt="Polar Ecosystem" loading="lazy" />
</a>
</li>
</ul>
</section>
<section id="aquatic-ecosystems">
<h2>Aquatic Ecosystems <code>[Water-Based]</code></h2>
<p>Aquatic ecosystems include a range of freshwater and marine ecosystems, such as lakes, rivers, wetlands, estuaries, coral reefs, and the open ocean. These ecosystems support a diverse array of aquatic life, including fish, invertebrates, and various types of algae and plants.</p>
<ul>
<li>
<a href="./Freshwater-Ecosystem.html">
<span>Freshwater Ecosystems</span>
<img src="../img/FreshwaterBG.webp" alt="Freshwater Ecosystem" loading="lazy" />
</a>
</li>
<li>
<a href="./Marine-Ecosystem.html">
<span>Marine Ecosystems</span>
<img src="../img/MarineBG.webp" alt="Marine Ecosystem" loading="lazy" />
</a>
</li>
<li>
<a href="./Estuarine-Ecosystem.html">
<span>Estuarine Ecosystems</span>
<img src="../img/EstuarineBG.webp" alt="Estuarine Ecosystem" loading="lazy" />
</a>
</li>
</ul>
</section>
<section id="human-made-ecosystems">
<h2>Human-made Ecosystems <code>[Anthropogenic]</code> </h2>
<p>Human-made or anthropogenic ecosystems are created by human activities such as agriculture, urbanization, and deforestation. These ecosystems often have a simplified structure and lower biodiversity than natural ecosystems, but they can still support a range of plant and animal species.</p>
<ul>
<li>
<a href="./Agricultural-Ecosystem.html">
<span>Agricultural Ecosystems</span>
<img src="../img/AgriculturalBG.webp" alt="Agriculture Ecosystem" loading="lazy" />
</a>
</li>
<li>
<a href="./Aquaculture-Ecosystem.html">
<span>Aquaculture Ecosystems</span>
<img src="../img/AquacultureBG.webp" alt="Aquaculture Ecosystem" loading="lazy" />
</a>
</li>
<li>
<a href="./Greenhouse-Ecosystem.html">
<span>Greenhouse Ecosystems</span>
<img src="../img/GreenhouseBG.webp" alt="Greenhouse Ecosystem" loading="lazy" />
</a>
</li>
<li>
<a href="./Urban-Ecosystem.html">
<span>Urban Ecosystems</span>
<img src="../img/UrbanBG.webp" alt="Urban Ecosystem" loading="lazy" />
</a>
</li>
<li>
<a href="./Industrial-Ecosystem.html">
<span>Industrial Ecosystems</span>
<img src="../img/IndustrialBG.webp" alt="Industrial Ecosystem" loading="lazy" />
</a>
</li>
</ul>
</section>
<section id="comparison">
<h2>Comparison of Ecosystem Types</h2>
<p>
Terrestrial ecosystems exist on land and are influenced by climate and soil.<br/>
Aquatic ecosystems are water-based and depend on factors such as depth and salinity.<br/>
Human-made ecosystems are created and maintained by humans and usually have lower biodiversity.
</p>
</section>
</main>
<footer id="footer">
<p>©2023 All Rights Reserved<br/>Piyush Anand, Baibhav Sinha, Khushi Sinha.</p>
</footer>
</body>
</html>