This repository has been archived by the owner on Jul 30, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
144 lines (128 loc) · 5.42 KB
/
index.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
<!DOCTYPE html>
<html>
<head>
<title>Cryptology</title>
<meta name='viewport' content='width=device-width, initial-scale=0.1'>
<link href='./css/bootstrap.css' rel='stylesheet'>
<link href="./index.css" type="text/css" rel="stylesheet">
<script src='./jquery-3.3.1.min.js'></script>
</head>
<body>
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="collapsed navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-9" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-9">
<ul class="nav navbar-nav">
<li class="active"><a href="./index.html">Home</a></li>
<li><a href="./Pigpen.html">The Pigpen Cipher</a></li>
<li><a href="./Caesar.html">The Caesar Cipher</a></li>
<li><a href="./Monoalph.html">The Monoalphabetic Cipher</a></li>
<li><a href="./Homophon.html">The Homophonic Cipher</a></li>
<li><a href="./Viginere.html">The Viginere Cipher</a></li>
<li><a href="./Completed.html">Contact Us</a></li>
</ul>
</div>
</div>
</nav>
<div class='jumbotron'>
<div class='container-fluid bg1 text-center'>
<div class='row'>
<br><h1>Cryptology</h1></br>
</div>
<p class='lead'>Are you ready to explore the art of secret writing?</p>
<p class='lead'>Are you smart enough to crack the code?</p>
<p class='lead'>Click below to discover how to make and break some of the worlds most popular, and fiendish ciphers!</p>
<form method="get" action="./Pigpen.html">
<button class='btn btn-info btn-lg' type="submit">Ready to get started?</button>
</form>
</div>
</div>
<div class='container'>
<div class="container col-sm-6">
<p> Throughout history, the need to communicate in secret has been imperative in times of war, political scandal, and even in love affairs. Sometimes
the safety of a nation, or the outcome of a war depended on a message successfully reaching the rightful recipient, without being found
by enemies. Over the years, people have come up with cleverer and cleverer ways of securing their message, always trying to stay a step ahead
of the cryptanalysts, who would search for weaknesses and find techniques to exploit these.</p>
<p>In this website, we have picked some of our favourite ciphers and invite you to learn a little about the history and the structure of the cipher!
If you are up for a challenge, we have included a ciphertext at the bottom of each page, which we invite you to have a go at. The ciphers get
increasingly more challenging so don't worry if you get stuck! If you manage to solve the last two, let us know (as they are very difficult), and we
will add you to our hall of fame!</p>
<p>We hope you enjoy our website as much as we liked making it!</p>
</div>
<div class="container col-sm-6">
<table class="table">
<th>Leaderboard</th>
<tr></tr>
<td>1st</td>
<td></td>
<tr></tr>
<td>2nd</td>
<td></td>
<tr></tr>
<td>3rd</td>
<td></td>
<tr></tr>
<td>4th</td>
<td></td>
<tr></tr>
<td>5th</td>
<td></td>
<tr></tr>
<td>6th</td>
<td></td>
<tr></tr>
<td>7th</td>
<td></td>
<tr></tr>
<td>8th</td>
<td></td>
</table>
</div>
</div><br><br>
<div id='AboutUs' class='text-center'>
<div class='container-fluid'>
<h2 class='wsite-content-title center'>About us</h2><br><br>
<div class='row'>
<div class='col-sm-6'>
<img class='img-circle' src='./Images/Katie.png'>
<blockquote>
<p>Hi, I'm Katie! I am currently in my 3rd year at the University of Glasgow studying Maths.</p>
</blockquote>
</div>
<div class='col-sm-6'>
<img class='img-circle' src='./Images/Amy2.png'>
<blockquote>
<p>Hello, my name is Amy and I have been studying Economics with Maths at Glasgow University for a year. I love it!</p>
</blockquote>
</div>
</div>
</div>
</div>
<div id='Thanks' class= 'text-center'>
<div class='container-fluid'>
<h2 class='margin'>Special Thanks and Sponsors</h2><br><br>
<div class="container row">
<div class="col-sm-10 col-md-6">
<div class="thumbnail">
<img src="./Images/Code First Girls.png" alt="CFG">
<div class="caption">
<h3>Code First: Girls</h3>
<p>Code First: Girls aims to deliver free community coding courses to female university students all over the UK and from this we
were able to learned how to make our own website using a variety of different programming languages.
Using the skills that had been taught and our joined passion for puzzles and numbers we decided to create this website
from which people can learn about the world of cryptology.</p>
<p><a href="https://www.codefirstgirls.org.uk/" class="btn btn-primary" role="button">Find out more about their amazing work here</a></p>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>