-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathfor_educators.html
330 lines (306 loc) · 16.7 KB
/
for_educators.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
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
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="shortcut icon" href="img/favicon.png" type="image/x-icon" />
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="styles/all.css" media="all">
<link rel="stylesheet" type="text/css" href="styles/announcementBanner.css" media="all">
<link rel="stylesheet" type="text/css" href="styles/foreducators.css" media="all">
<link rel="stylesheet" type="text/css" href="styles/header.css" media="all">
<link rel="stylesheet" type="text/css" href="styles/footer.css" media="all">
<meta name='twitter:card' content="summary">
<meta name='twitter:title' content="Social Media TestDrive">
<meta name='twitter:description' content="Welcome to the Social Media TestDrive official website!">
<meta name='twitter:image' content='https://dhpd030vnpk29.cloudfront.net/squareLogo.png'>
<meta property='og:url' content='https://socialmediatestdrive.org/'>
<meta property='og:title' content="Social Media TestDrive">
<meta property='og:description' content='Welcome to the Social Media TestDrive official website!'>
<meta property='og:image' content='https://dhpd030vnpk29.cloudfront.net/squareLogo.png'>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-145467622-3"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag('js', new Date());
gtag('config', 'UA-145467622-3');
</script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-BVBF8VW9D6"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag('js', new Date());
gtag('config', 'G-BVBF8VW9D6');
</script>
<title> TestDrive for Educators</title>
</head>
<body>
<header>
<nav class="navbar navbar-light">
<a href="index.html" class="logoLinkContainer">
<img src="img/testDriveLogo.svg" width="110px" height="110px" class="d-inline-block align-top testDriveLogo" alt="Social Media TestDrive Logo">
<span class="navbar-brand fancy d-none d-md-inline-block align-middle">
Test<span class="brand">Drive</span>
</span>
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ml-auto">
<li class="nav-item d-sm-block d-lg-none">
<a class="nav-link" href="index.html">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="modules.html">Modules</a>
</li>
<li class="nav-item active">
<a class="nav-link" href="for_educators.html">For Educators</a>
</li>
<li class="nav-item">
<a class="nav-link" href="for_parents.html">For Parents</a>
</li>
<li class="nav-item">
<a class="nav-link" href="for_researchers.html">For Researchers</a>
</li>
<li class="nav-item">
<a class="nav-link" href="testdrive_studies.html">TestDrive Studies</a>
</li>
<li class="nav-item">
<a class="nav-link" href="faq.html">FAQ</a>
</li>
<li class="nav-item">
<a class="nav-link" href="team.html">Team</a>
</li>
<li class="nav-item">
<a class="nav-link alignItemsCenter" href="donate.html">
<!-- Free, open source bootstrap icon: megaphone fill -->
<!-- Copied HTML from: https://icons.getbootstrap.com/icons/heart-fill/ -->
<!-- Altered the width, height, and fill -->
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="#0093EC" class="bi bi-suit-heart-fill donationHeart" viewBox="0 0 16 16">
<path
d="M4 1c2.21 0 4 1.755 4 3.92C8 2.755 9.79 1 12 1s4 1.755 4 3.92c0 3.263-3.234 4.414-7.608 9.608a.513.513 0 0 1-.784 0C3.234 9.334 0 8.183 0 4.92 0 2.755 1.79 1 4 1z" />
</svg>
<b>Donate</b>
</a>
</li>
</ul>
</div>
</nav>
</header>
<main>
<div class='container-fluid'>
<!-- Temporary Announcement Banner -->
<!-- Comment out when no longer needed -->
<!-- <div class="row align-items-center announcementBanner">
<div class="col-12 d-flex align-items-center"> -->
<!-- Free, open source bootstrap icon: circle fill -->
<!-- Copied HTML from: https://icons.getbootstrap.com/icons/circle-fill/ -->
<!-- Altered the width, height, and fill -->
<!-- <svg xmlns="http://www.w3.org/2000/svg" width="50" height="50" fill="#E94B68" class="bi bi-circle-fill topLeftCircle" viewBox="0 0 16 16">
<circle cx="8" cy="8" r="8" />
</svg> -->
<!-- Free, open source bootstrap icon: megaphone fill -->
<!-- Copied HTML from: https://icons.getbootstrap.com/icons/megaphone-fill/ -->
<!-- Altered the width, height, and fill -->
<!-- <svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" fill="white" class="bi bi-megaphone-fill topLeftIcon" viewBox="0 0 16 16">
<path
d="M13 2.5a1.5 1.5 0 0 1 3 0v11a1.5 1.5 0 0 1-3 0v-11zm-1 .724c-2.067.95-4.539 1.481-7 1.656v6.237a25.222 25.222 0 0 1 1.088.085c2.053.204 4.038.668 5.912 1.56V3.224zm-8 7.841V4.934c-.68.027-1.399.043-2.008.053A2.02 2.02 0 0 0 0 7v2c0 1.106.896 1.996 1.994 2.009a68.14 68.14 0 0 1 .496.008 64 64 0 0 1 1.51.048zm1.39 1.081c.285.021.569.047.85.078l.253 1.69a1 1 0 0 1-.983 1.187h-.548a1 1 0 0 1-.916-.599l-1.314-2.48a65.81 65.81 0 0 1 1.692.064c.327.017.65.037.966.06z" />
</svg> -->
<!-- Announcement Banner Text -->
<!-- <p style="word-break: break-word; white-space: normal;">
<span class="largeText boldText">NOW recruiting!</span> Help us learn how well Social Media TestDrive works! As a thank you, you will receive a
<span class="boldText">$75 Amazon egift card</span>. Contact
<a href="mailto:[email protected]" target="_top" class="customHyperlink">[email protected]</a> to learn more! You can also find more information
<a href="Social Media TestDrive research opp.pdf" target="_none">here</a>.
</p>
</div>
</div> -->
<!-- Content Row 1 -->
<div class="row align-items-center paddedRow">
<div class="col-md-6">
<h1>Teach digital citizenship skills and online prosocial behaviors</h1>
<h4>
Social Media TestDrive prepares young people for real-life experiences in the digital world through learning and practicing within a realistic social media simulation. Our modules are aligned with
<a href="https://www.commonsense.org/education/digital-citizenship/curriculum" target="_none">
Common Sense Education's Digital Citizenship Curriculum.</a>
</h4>
<a href="testdriveguide.pdf" target="_none" style="text-decoration:none;">
<button type="button" class="nicelyRoundedButton" style="margin:3px 6px 3px 0;">
View the educator guide
</button>
</a>
<a href="/webinars.html" target="_none" style="text-decoration:none;">
<button type="button" class="nicelyRoundedButton" style="margin:3px 0 3px 0;">
View the training
</button>
</a>
</div>
<div class='col-md-6'>
<img class="educators_image" src="img/educators_1.svg" alt="">
</div>
</div>
<!-- Content Row 2 -->
<div class="row align-items-center paddedRow">
<div class="col-md-6 order-2 order-md-1">
<img class="educators_image" src="img/educators_2.png" alt="">
</div>
<div class='col-md-6 order-1 order-md-2'>
<h1>Social media education for today’s youth</h1>
<h4>
Social Media TestDrive provides a simulated experience of realistic digital dilemmas and scenarios that young people may encounter as they enter the social media world.
</h4>
</div>
</div>
<!-- Content Row 3 -->
<div class="row align-items-center paddedRow">
<div class="col-md-6">
<h1> A space for reflection and open conversation</h1>
<h4>
Social Media TestDrive helps you lead open, meaningful conversations with your students about social media.
</h4>
<h4>
Use the reflection and quiz questions at the end of each module to evaluate students' understanding of key social media concepts and to spark individual or group discussions.
</h4>
</div>
<div class='col-md-6'>
<img class="margined-left educators_image" src="img/educators_3.png" alt="">
</div>
</div>
<!-- Content Row 2 -->
<div class="row align-items-center paddedRow">
<div class="col-md-6 order-2 order-md-1 text-center">
<img width="80%" src="img/newsletters.svg" alt="">
</div>
<div class='col-md-6 order-1 order-md-2'>
<h1>Regular newsletters with our latest news</h1>
<h4>
The Social Media TestDrive team regularly sends newsletters to educators who are using TestDrive with the latest news about Social Media TestDrive.
</h4>
<h4>
Our past newsletters can be found <a href="/webinars.html#newsletters" target="_blank">here</a>.
</h4>
<h4>To join our e-mail listserv and receive future newsletters, click the button below, then press "Send" to join.
</h4>
<a href="mailto:[email protected]?Subject=Join" target="_blank" style="text-decoration:none;">
<button type="button" class="nicelyRoundedButton">
Sign up
</button>
</a>
</div>
</div>
<!-- Testimonials (to be included later, need to sort out permissions)-->
<!-- <div class="row align-items-center" style="padding-bottom:2em;">
<div class="col d-flex justify-content-center">
<h1>Real teachers, real impact</h1>
</div>
</div>
<div class="row align-items-center">
<div class="col-sm-4 d-flex justify-content-center">
<div class="testimonialPanel">
</div>
</div>
<div class="col-sm-4 d-flex justify-content-center">
<div class="testimonialPanel">
</div>
</div>
<div class="col-sm-4 d-flex justify-content-center">
<div class="testimonialPanel">
</div>
</div>
</div> -->
<!-- Got More Questions Section -->
<div class="container-fluid">
<!-- Title -->
<div class="row justify-content-center">
<div class="col text-center">
<h1> Do you have more questions? </h1>
</div>
</div>
<!-- Subtitle -->
<div class="row justify-content-center">
<div class="col-sm-8 col-md-8 col-lg-4 text-center">
<h4>
Check out our
<a href="testdriveguide.pdf" target="_none">Educator Guide</a> and
<a href="/faq.html">FAQ</a> for more details about how educators can use Social Media TestDrive, or contact us using the e-mail below.
</h4>
</div>
</div>
<!-- Button -->
<div class="row addPaddingBottom justify-content-center">
<div class="col d-flex justify-content-center">
<a href="mailto:[email protected]" target="_top">
<button type="button" class="nicelyRoundedButton">
Contact us
</button>
</a>
</div>
</div>
</div>
<!-- Join List-serv Section -->
<!-- <div class="container-fluid"> -->
<!-- Title -->
<!-- <div class="row paddedTop justify-content-center">
<div class="col text-center">
<h1> Want to find out more? </h1>
</div>
</div> -->
<!-- Subtext -->
<!-- <div class="row justify-content-center">
<div class="col-sm-8 col-md-8 col-lg-4 text-center">
<h4 class="listServSubtext">
You can join our e-mail listserv to hear the latest news about Social Media TestDrive.
</h4>
<h4>
Click the button below and press "Send" to join.
</h4>
</div>
</div> -->
<!-- Join List-serv Button -->
<!-- <div class="row addPaddingBottom justify-content-center">
<div class="col d-flex justify-content-center">
<a href="mailto:[email protected]?Subject=Join" target="_top" class="customHyperlink">
<button type="button" class="nicelyRoundedButton">
Sign up
</button>
</a>
</div>
</div>
</div> -->
</div>
</main>
<footer class="page-footer footerVerB">
<div class="container-fluid">
<div class="row align-items-center footerRow">
<div class="col-auto mr-auto">
<p class="footerLeftItem">Copyright © 2025 Social Media TestDrive</p>
</div>
<div class="col-auto">
<a href="press.html" class="footer-link">Press</a>
</div>
<div class="col-auto">
<a href="terms.html" class="footer-link">Terms & Copyright</a>
</div>
<div class="col-auto">
<a href="privacy.html" class="footer-link">Privacy Policy</a>
</div>
<div class="col-auto">
<a href="mailto:[email protected]" target="_top" class="footer-link">
Contact Us
</a>
</div>
</div>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
</body>
</html>