diff --git a/css/style.css b/css/style.css
new file mode 100644
index 0000000000000000000000000000000000000000..6cb1a3fa6d5a8cd3766caaaa25c1b9a7526a8e6d
--- /dev/null
+++ b/css/style.css
@@ -0,0 +1,60 @@
+ /*styling for the navigation bar*/
+.nav-bar {
+ background-color: #000000;
+ text-align: center;
+ }
+ .nav-bar > li:hover {
+ background-color: royalblue;
+ }
+ .nav-bar > li {
+ display: inline-flex;
+ padding: 20px 20px;
+ }
+ .nav-bar > li > a {
+ color: white;
+ text-decoration: none;
+ font-size: larger;
+ }
+
+/*formatting the intro header*/
+.title {
+ background-image: url(../images/header.jpg);
+ color: whitesmoke;
+ background-size: cover;
+ font-size: 1.5em;
+ text-align: center;
+ padding: 40px 40px;
+}
+
+/*stuff to format the site properly*/
+* {
+ margin-left: 0;
+}
+html {
+ font-size: 20px;
+ font-family: Arial, Helvetica, sans-serif;
+ color: black;
+}
+body {
+ width: 100%;
+ min-height: 100vh;
+}
+main {
+ padding:5vh;
+}
+
+/*image adjustments*/
+#figure-1 {
+ float: right;
+ height: 350px;
+ width: 300px;
+ padding-left: 20px;
+}
+#donald {
+ float: left;
+ height: 300px;
+ width: 275px;
+ padding-right: 20px;
+}
+
+
diff --git a/html/index-biography.html b/html/index-biography.html
new file mode 100644
index 0000000000000000000000000000000000000000..d926c8ba1ca76b56510b5a451ad3123633de92f9
--- /dev/null
+++ b/html/index-biography.html
@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+
+<html lang="en">
+
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <link rel="stylesheet" href="..\css\style.css">
+ <title>Donald Knuth</title>
+</head>
+
+<body>
+
+ <nav>
+ <ul class="nav-bar">
+ <li><a href="index-home.html">Home</a></li>
+ <li><a href="index-biography.html">Biography</a></li>
+ <li><a href="index-reflection.html">Personal Reflection</a></li>
+ <li><a href="index-references.html">References</a></li>
+ </ul>
+ </nav>
+
+ <header>
+ <h1 class="title">Donald Knuth's Biography</h1>
+ </header>
+
+ <main>
+
+ <figure>
+ <img id="donald" src="../images/knuth.jpg" alt="A picture of Donald Knuth"></img>
+ </figure>
+
+ <header>
+ <h2>Donald Knuth</h2>
+ </header>
+
+ <article>
+ <p>I’ll be focusing on Donald Knuth in this biography, if for no other reason than finding him very charming
+ on a podcast once (Fridman 2019). That’s not to imply his contributions aren’t worthy enough to warrant choosing him however,
+ as Knuth is widely known for writing one of the most comprehensive and seminal compendiums in computer science,
+ <i>The Art of Computer Programming</i>, among other things.</p>
+
+ <p>Knuth is a retired American professor, currently 84 years old, a church organist and father, with a bachelors,
+ masters and doctorate in mathematics (The Editors of Encyclopaedia Britannica 2009). In spite of this, his most notable contributions, culminating in receiving
+ the illustrious Turing Award (Walden 2019), have been in computer science. He manged to cross this admittedly small gap from
+ mathematics to computer science after being introduced to the IBM 650 – a really early consumer computer – while
+ studying for his bachelor's degree, deciding that he could write the assembly and compiler code better than IBM.</p>
+
+ <p>Not only did he manage it, but also went on to spend his summers writing compilers for major companies, gaining
+ such a reputation that he was commissioned to write a book about them (Knuth 1997); one book quickly became several. In these
+ books, currently five with plans for more, Knuth perspicaciously attempts to present all that there is to know about
+ programming and algorithms, covering theory, applicability and problem solving. It’s this that received the previously
+ mentioned Turing Award, as the content was and still is considered to be widely brilliant and informative. So technical
+ are its contents that Bill Gates has since claimed you should “send [him] a resume” if you’re able to understand it (Weinberger 2017), and
+ Knuth described it as “the most important project of [his] life” (Knuth 1999). </p>
+
+ <p>To accompany these books, he created the TeX computational typesetting system, which presents mathematical and computational
+ formulae in a uniform and sophisticated fashion that simply didn’t exist at the time he created it (Schechter 2005). Meaning, aspiring computer
+ scientists and mathematicians now had the ability to present much higher-quality written work. Furthermore, due to Knuth’s
+ personal disdain for patents (Knuth and Wayback Machine 2015), it was created open-source allowing people to access and develop on it freely, leading to the
+ now popular LaTeX (an updated version of TeX), that’s still dominant today, 44 years later.</p>
+
+ <p>By making high-quality written work more accessible, and creating a detailed, curriculum-guiding explanation of its most
+ complex concepts, Knuth has pushed computer science forwards and cemented himself a place in its history.</p>
+ </article>
+
+ <footer>
+ <br>
+ <p>Full reference list <a href="index-references.html">here</a></p>
+ </footer>
+
+ </main>
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/html/index-home.html b/html/index-home.html
new file mode 100644
index 0000000000000000000000000000000000000000..7da009e8d194b6abd2f0415bd4008c63eed64e2f
--- /dev/null
+++ b/html/index-home.html
@@ -0,0 +1,86 @@
+<!DOCTYPE html>
+
+<html lang="en">
+
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <link rel="stylesheet" href="..\css\style.css">
+ <title>Computational Thinking</title>
+</head>
+
+<body>
+
+ <nav>
+ <ul class="nav-bar">
+ <li><a href="index-home.html">Home</a></li>
+ <li><a href="index-biography.html">Biography</a></li>
+ <li><a href="index-reflection.html">Personal Reflection</a></li>
+ <li><a href="index-references.html">References</a></li>
+ </ul>
+ </nav>
+
+ <header>
+ <h1 class="title">What is Computational Thinking?</h1>
+ </header>
+
+ <main>
+
+ <header>
+ <h2>What is Computational Thinking?</h2>
+ </header>
+
+ <figure>
+ <img id="figure-1" src="../images/algorithm.jpeg" alt="A flowchart for creating a website biography."></img>
+ </figure>
+
+ <article>
+ <p>Computational thinking is, pretty simply, an advanced mental tool that we can use to assess and solve problems.
+ We can take almost any problem - from organising a bachelor party, to specific computational problems. While useful
+ in both circumstances, it’s going to be infinitely more valuable to me in terms of my Computing course, so it’ll be
+ best to pull an illustrative example from there. </p>
+
+ <p>Imagine I’ve been tasked to create a website that provides a brief biography of an influential politician. I can’t
+ just create one on the spot, because there’s things I need to work out first. Such as: who am I going to pick? how
+ should it be formatted? how do you even make a website? etc. By taking a step back to <b>decompose</b> the project into smaller
+ pieces I’m making the overall project more manageable – at least I’m giving the way I approach it some structure.
+ </p>
+
+ <p>Once you’ve got your smaller problems, it’s worth checking to see if you’ve encountered any of them already.
+ I’ve made plenty of websites before, and written biographies before, so there is very likely going to be some similarities
+ when making this one. For example, in terms of formatting the website, I know that I’ve previously had problems with image
+ alignment, so I could look at how I’ve previously solved that and apply a similar fix. This process is <b>pattern recognition</b>. </p>
+
+
+ <p>Once you’ve got your problems, and you know which ones you’ve solved before, you can start to make sure that you focus on
+ the ones important to your project so that you aren’t wasting time. Consequently, the next step is <b>abstracting</b> all the strictly
+ relevant problems to focus on, to make sure that your head doesn’t explode trying to focus on a hundred unimportant things.
+ I’ve never had to worry about the font for example, so I can ignore that problem. </p>
+
+ <p>This brings us on to the very last step in computational thinking, formulating a reliable step-by-step solution to all of these problems.
+ There’s a bunch of ways to structure this <b>algorithm</b>, pseudocode and algorithms are common. A rough algorithm for creating the biography
+ might look something like <i>Figure 1</i>. It’s worth noting that ensuring repeatability by evaluating your algorithm is arguably one of the most
+ important parts of computational thinking, as it's indicative of a successful use of the process.</p>
+
+ <header>
+ <h2>How important is computational thinking?</h2>
+ </header>
+
+ <p>The importance of computational thinking to a career and academic course are very similar, as much benefit of computational thinking is
+ directly linked to improving your critical thinking skills. Knowing how to approach a problem is just as important as knowing how to solve it,
+ something that employers and students alike can sympathise with strongly. This is only exaggerated when you consider the specific applicability
+ to computational careers and studies, as you’re able to break projects into simple instructions that could be translated directly to a computer.</p>
+
+ <p>In terms of explicit applications of computational thinking to my course, I have a specific assignment in my software engineering module that
+ requires me to look at a problem, and then create a solution and business plan in response to it. In this case, problem decomposition will be
+ incredibly important at several stages, as building a business plan relies almost entirely on the ability to discriminate problems/ solutions/ target
+ audiences etc. in order to create a competent and modular plan. Furthermore, remembering pattern recognition and abstraction techniques will be perfect
+ when considering comparative companies and solutions – the business plan itself being a literal step-by-step plan to solve a problem.</p>
+ </article>
+
+ </main>
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/html/index-references.html b/html/index-references.html
new file mode 100644
index 0000000000000000000000000000000000000000..45b68800b30d53ea471345a16759925c4a28f383
--- /dev/null
+++ b/html/index-references.html
@@ -0,0 +1,71 @@
+<!DOCTYPE html>
+
+<html lang="en">
+
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <link rel="stylesheet" href="..\css\style.css">
+ <title>References</title>
+</head>
+
+<body>
+
+ <nav>
+ <ul class="nav-bar">
+ <li><a href="index-home.html">Home</a></li>
+ <li><a href="index-biography.html">Biography</a></li>
+ <li><a href="index-reflection.html">Personal Reflection</a></li>
+ <li><a href="index-references.html">References</a></li>
+ </ul>
+ </nav>
+
+ <header>
+ <h1 class="title">References</h1>
+ </header>
+
+ <main>
+
+ <header>
+ <h2>Biography References</h2>
+ </header>
+
+ <section>
+ <ol id="bibliography">
+ <li>Fridman, L. 2019. Donald Knuth: Algorithms, Complexity, and The Art of Computer Programming | Lex Fridman Podcast #62. Available at: https://www.youtube.com/watch?v=2BdBfsXbST8 [Accessed: 2 November 2022].</li>
+ <br>
+ <li>Knuth, D. 1997. The Art of Computer Programming. Vol. 1. Addison-Wesley.</li>
+ <br>
+ <li>Knuth, D. 1999. Knuth: Retirement. Available at: https://www-cs-faculty.stanford.edu/~knuth/retd.html [Accessed: 2 November 2022].</li>
+ <br>
+ <li>Knuth, D. and Wayback Machine 2015. Wayback Machine. Available at: https://web.archive.org/web/20150924040943/http:/www.groklaw.net/images/G308Knuth.pdf [Accessed: 2 November 2022].</li>
+ <br>
+ <li>Schechter, E. 2005. Introduction to TeX. Available at: https://math.vanderbilt.edu/schectex/wincd/intro_to_tex.htm [Accessed: 2 November 2022].</li>
+ <br>
+ <li>The Editors of Encyclopaedia Britannica 2009. Donald Knuth | Biography & Facts | Britannica. Available at: https://www.britannica.com/biography/Donald-Knuth [Accessed: 2 November 2022].</li>
+ <br>
+ <li>Walden, D. 2019. Donald E. Knuth - A.M. Turing Award Laureate. Available at: https://amturing.acm.org/award_winners/knuth_1013846.cfm [Accessed: 2 November 2022].</li>
+ <br>
+ <li>Weinberger, M. 2017. Bill Gates Once Said “definitely send me a resume” If You Finish This Fiendishly Difficult Book. Available at: https://www.businessinsider.in/bill-gates-once-said-definitely-send-me-a-resume-if-you-finish-this-fiendishly-difficult-book/articleshow/58795297.cms [Accessed: 26 April 2022].</li>
+ </ol>
+ </section>
+
+ <header>
+ <h2>Images Used</h2>
+ </header>
+
+ <section>
+ <ol id="bibliography">
+ <li>Hélardot, C. and Unsplash 2018. JavaScript in progress. Available at: https://unsplash.com/photos/95YRwf6CNw8 [Accessed: 2 November 2022].</li>
+ <p>Permission for use with the Unsplash License</p>
+ <li>Appelbaum, J. 2005. KnuthAtOpenContentAlliance.jpg. Available at: https://sco.m.wikipedia.org/wiki/File:KnuthAtOpenContentAlliance.jpg [Accessed: 2 November 2022].</li>
+ <p>Licensed under the Creative Commons Attribution-Share Alike 1.0 Generic license.</p>
+ </ol>
+ </section>
+
+ </main>
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/html/index-reflection.html b/html/index-reflection.html
new file mode 100644
index 0000000000000000000000000000000000000000..ba5f7e1d2dcc3acd94c6fd52aec68cd3aeebba55
--- /dev/null
+++ b/html/index-reflection.html
@@ -0,0 +1,72 @@
+<!DOCTYPE html>
+
+<html lang="en">
+
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <link rel="stylesheet" href="..\css\style.css">
+ <title>Personal Reflection</title>
+</head>
+
+<body>
+
+ <nav>
+ <ul class="nav-bar">
+ <li><a href="index-home.html">Home</a></li>
+ <li><a href="index-biography.html">Biography</a></li>
+ <li><a href="index-reflection.html">Personal Reflection</a></li>
+ <li><a href="index-references.html">References</a></li>
+ </ul>
+ </nav>
+
+ <header>
+ <h1 class="title">Computational Thinking - A Reflection</h1>
+ </header>
+
+ <main>
+
+ <header>
+ <h2>A Reflection on What I've Learned</h2>
+ </header>
+
+ <article>
+ <p>Throughout my module, there’s been many valuable and insightful skills that I’ve learned and internalised - not
+ just in terms of computational thinking. After all, many more topics have been considered, from HTML/CSS to providing
+ a background to programming. Each one is worthy of its own discussion, and has contributed something unique to the
+ learning.</p>
+
+ <p>Of course, coding and engagement with computational ideas is going to be at the core of the rest of my module, so learning
+ how to engage with these things is going to be just as important as the actual engagement with the subject itself, owing
+ to the wide range of languages and ideas that are going to be looked at. Consequently, engaging with computational thinking
+ in general was incredibly important in terms of the rest of my learning outcomes.</p>
+
+ <p>My first opportunity to put this into practice was in exploring HTML and CSS. I’d never made a website before, or even engaged
+ much with coding, and it showed. On the first website I made for example, I had no idea how to work CSS, had hot-linked every
+ image, used no semantic HTML and I’d spent most of my time simply trying to get it to work – it was a mess. An important mess,
+ too, as learning how to engage with these new concepts would be indicative of my engagement with later languages like Python.
+ To this end, learning about specific web and research tools – like MDN and Stack Overflow – has made independent learning in
+ this regard much easier, and will no doubt be relied upon when I approach future problems. </p>
+
+ <p>Outside of the obvious utility in using HTML/CSS to create websites, the most impactful aspect of this topic personally, similar
+ to that of computational thinking, was training myself mentally to engage with a separate English language that has its own set
+ of rules and customs. This was really crucial to the engagement with the introduction of programming later introduced in the module.</p>
+
+ <p>Another topic, data representation and number systems, followed on in the trend of the previous two topics by having much of their
+ utility deriving from their relevance as a foundation for future learning. Here, I learned the way a computer interprets data internally,
+ specifically in relation to numbers, which helped explain certain behaviours and errors that a computer might run in to.</p>
+
+ <p>While the first half of the module taught me how to approach computational ideas, the latter half gave me much more hands-on experience
+ that directly translated to other modules in my course – specifically in CMT120. After already having looked at things such as iteration
+ and branching generally it became much easier to apply these concepts to direct languages like Python and JavaScript. Rather than starting
+ from scratch, I had the background required to focus instead on the correct way of phrasing these concepts within the language. Loops in
+ particular had been looked at plenty within Computational Thinking, and have been used constantly within JavaScript and Python
+ tasks to varying degrees.</p>
+ </article>
+
+ </main>
+
+</body>
+
+</html>
\ No newline at end of file
diff --git a/images/algorithm.jpeg b/images/algorithm.jpeg
new file mode 100644
index 0000000000000000000000000000000000000000..7c9a0b4a8719869d8b5cfaff9d47a47f19c195f0
Binary files /dev/null and b/images/algorithm.jpeg differ
diff --git a/images/header.jpg b/images/header.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..4bc4aa82b8b727785f9932d71810896dbe375285
Binary files /dev/null and b/images/header.jpg differ
diff --git a/images/knuth.jpg b/images/knuth.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..f35fed9faba26028e2ac9fc096e64614d9864929
Binary files /dev/null and b/images/knuth.jpg differ