-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtemplate.html
70 lines (60 loc) · 3.99 KB
/
template.html
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
<!-- ALERT!!! You'll need a basic understanding of code to make changes to this file. If you don't fit this description, then please close this file! -->
<!-- ONLY CHANGE CODE THAT HAS A COMMENT ABOVE IT! -->
<!-- This file is a template for other pages. It supports pc and mobile. Remove this comment when creating a new page! -->
<!DOCTYPE html>
<html>
<head>
<title> NWRESD Rainier Trail </title>
<link rel="stylesheet" href="style.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<!-- This is where you change the colors of the page. Change the hex codes below to give the page a little bit of flair! -->
<script id="page colors">
document.documentElement.style.setProperty("--background_1", "#D9D9D9");
document.documentElement.style.setProperty("--background_2", "#AFAFAF");
document.documentElement.style.setProperty("--borders_text", "#000000");
document.documentElement.style.setProperty("--link", "#364E72");
</script>
<nav>
<script src="nav.js"></script>
</nav>
<main>
<!-- This is the map picture, a good way to know where you are. Change this to reflect such. -->
<section id="map">
<!-- This is the map's image, this is where you change the map as said above. -->
<img id="map-image" src="assets/placeholder.jpg" />
<!-- This is the item in front of the map, change this to a picture of the page's topic as visual info. -->
<img id="item" src="assets/test_image.png" />
</section>
<section id="content">
<!-- This is the title. This changes dependintg on what the page is about. -->
<header>
<h1> Hello </h1>
</header>
<article>
<!-- This is the paragraph. It holds all the info a viewer may need to know about the page's topic. -->
<p>
The given sentence serves as an illustrative placeholder text, analogous to Lorem Ipsum commonly used in the design and typesetting industry.
It is a temporary, filler statement employed to showcase the appearance and layout of written content without conveying any specific meaning.
In the context of demonstrating a visual design, this sentence helps convey the structure and
format while allowing the focus to remain on the overall presentation
rather than the semantic content. </br></br>
In the realm of graphic design, such placeholder text is invaluable,
facilitating the evaluation of various design elements such as font choice, spacing, and alignment.
Designers often use this technique to create mockups and prototypes, providing clients or employers with a preview of the final
product before committing to the actual content. </br></br>
Moreover, the use of placeholder text streamlines the design process by allowing designers to concentrate on layout and aesthetics initially,
deferring the task of content creation until later stages. This separation of concerns enhances workflow efficiency, enabling designers to iterate rapidly and make
adjustments without being encumbered by the specifics of the textual content.
</p>
<!-- This is the attatchment. Add a link inbetween the href that links to more info about the page. -->
<a href="">Learn More</a>
</article>
</section>
</main>
<footer>
Northwest Regional Educational Service District 2024 <span style="color: #252525;">|</span> Designed by Mischa Larkins
</footer>
</body>
</html>