-
Notifications
You must be signed in to change notification settings - Fork 0
/
siteplanrafting.html
128 lines (109 loc) · 5.02 KB
/
siteplanrafting.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
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
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="utf-8" />
<title>Site Plan</title>
<link type="text/css" rel="stylesheet" href=styles/siteplanrafting.css />
</head>
<body>
<header>
<h1>White Water Rafting Site Plan</h1>
<h2>Sean Porter</h2>
<h2>WDD 130-01</h2>
<!-- In the header above, add the name of your site, your name and class number. For example if you are in section 3 you would put WDD 130-03 -->
</header>
<main>
<!-- ------------------------Steps 2-5------------------------------ -->
<hr />
<h2>Overview</h2>
<h3>Purpose</h3>
<p>Our purpose is to connect White Water Rafters with White Water Rafts. We want to help people have a fun experience from simple family-friendly trips to more adventurous white water rafting</p>
<!-- change this -->
<h3>Audience</h3>
<p>White Water Rafters who want to use our service to White Water Raft, and people who are generally interested in the art that is white water rafting.</p>
<!-- change this -->
<hr />
<h2>Branding</h2>
<h3>Website Logo</h3>
<!-- Replace this with some sort of logo for your site. A logo can be as simple as the name of your site in a nice font :) -->
<img src="https://byui-wdd.github.io/wdd130/rafting_images/dryoarlogo.png" alt="Logo image" />
<hr />
<h2>Style Guide</h2>
<!-- ------------------------Steps 6-9------------------------------ -->
<h3>Color Palette</h3>
<!-- The colors you choose for a website are one of the most important decisions you will make. Follow the instructions on the activity in Canvas then return and replace the color codes below with the hex color codes (the 6 digit numbers that show at the bottom of each color) for the colors you have chosen below. You should have at least 2 colors but do not have to fill in all 4 if you do not need them. -->
<!-- Copy and paste the URL to your finished palette below. Replace the href value that is there with yours. Make sure to paste it into both the href value and the content text of the <a> tag -->
<p>Palette URL:</p>
<a href="https://coolors.co/palette/c9e4ca-87bba2-55828b-3b6064-364958"
target="_blank">https://coolors.co/palette/c9e4ca-87bba2-55828b-3b6064-364958</a>
<table class="colors">
<tr>
<th>Primary</th>
<th>Secondary</th>
<th>Accent 1</th>
<th>Accent 2</th>
</tr>
<!-- Replace the numbers in the boxes below with your hex color codes. Then switch to the site-plan.css file and change your colors there as well. -->
<tr>
<td class="primary">C9E4CA</td>
<td class="secondary">87BBA2</td>
<td class="accent1">55828B</td>
<td class="accent2">3B6064</td>
</tr>
</table>
<!-- ------------------------Steps 10-12------------------------------ -->
<h3>Typography</h3>
<!-- Choose a font for your paragraphs (body copy) and headlines. What font(s) have you chosen? Think also about which of your colors above you might use for background and font colors. -->
<h4>
Heading Font: Sofia Sans
<!-- change this -->
</h4>
<h4>
Paragraph Font: Roboto Condensed
<!-- change this -->
</h4>
<h3>Normal paragraph example</h3>
<p>
The best Whitewater Rafting in Colorado, White Water Rafting Company
offers rafting on the Colorado and Roaring Fork Rivers in Glenwood
Springs. Since 1974, we have been family owned and operated, rafting the
Shoshone section of Glenwood Canyon and beyond.
</p>
<h3>Colored paragraph example</h3>
<p class="colored">
Trips vary from mild and great for families, to trips exclusively for
physically fit and experienced rafters. No matter what type of river
adventures you are seeking, White Water Rafting Company can make it
happen for you.
</p>
<!-- ------------------------Step 13------------------------------ -->
<h3>Navigation</h3>
<!-- Think about how you want your navigation bar to look. In the site-plan.css file change the colors to your colors to get the look you desire. -->
<nav>
<a href="#">Home</a>
<a href="#">Page2</a>
<a href="#">Contact Us</a>
</nav>
<hr />
<h2>Site Map</h2>
<div class="sitemap">
<div class="sm-home">Home</div>
<div class="sm-page2">
[Rivers]
<!-- this page will have a name later -->
</div>
<div class="sm-page3">Contact Us</div>
<div class="top"> </div>
<div class="left"> </div>
<div class="right"> </div>
</div>
<hr />
<h2>Wireframes</h2>
<!-- Create an additional wireframe for your site. List it here below the Home page wireframe. -->
<h3>Home</h3>
<img src="https://byui-wdd.github.io/wdd130/rafting_images/wireframe_home.png" alt="home page wireframe" />
<h3>Rivers</h3>
<img src="images/pg2_siteplan.png" alt="page 2 wireframe"
</main>
</body>
</html>