anish2210 · Harshit015 · Oct 18, 2023
diff --git a/project1/audio/Successful_Startup.mp3 b/project1/audio/Successful_Startup.mp3
diff --git a/project1/default.html b/project1/default.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+		<meta charset="utf-8">
+		<title>Web Project 1</title>
+		<link rel="stylesheet" href="style.css">
+</head>
+
+<body>
+	<header>
+		<h1 style="text-align:center;">Computer Building</h1>
+	</header>
+	<nav style="text-align:center;">
+	<hr>
+		<a href="default.html">Home</a> - <a href="page1.html">Page 1: Components</a> - <a href="page2.html">Page 2: Building</a> - <a href="page3.html">Page 3: Startup</a> - <a href="../home.htm">Homepage</a>
+	<hr>
+	</nav>
+
+	<main>
+		<img src="images/StockComp.jpg" width="800" height="500" Title="Finished Example" alt="Finished Example" class="center">
+		<h2 style="text-align:center;">Introduction</h2>
+		<div style="width: 1000px; text-align: center; margin:0 auto;">
+		<p>There are many reasons why you might want to build your own computer. One might be that you want to save some money for get the most bang for your buck. Another reason is that you plan on using you computer very often and want something more tailored to you. Either way building a computer can be very beneficial not only for the reasons above but also to get a greater understanding of computers and the components that are within. Either way this general guide with help you to gain a far better understanding of how computers work and what you need to do to build one.</p>
+
+		<p style="text-align:center;">The topics I will be going over include the components of a computer on page one and how those can affect the computer itself and things you need to be careful of including common mistakes. On the second page for actually putting it together I give the reader some resources they can use to learn and some helpful tips for that. Additionally, there is a video on page two that goes over the important aspects of building a computer On the final page I go over what comes after the computer and things that are related to computers that can improve your experience.</p>
+		</div>
+	</main>
+
+	<footer>
+		<p>EDUCATIONAL ONLY, NO COMMERCIAL VALUE. | CONTACT: <a href = "mailto:[email protected]">[email protected]</a></p>
+	</footer>
+
+</body>
+</html>
diff --git a/project1/images/StockComp.jpg b/project1/images/StockComp.jpg
diff --git a/project1/images/cpu1.jpg b/project1/images/cpu1.jpg
diff --git a/project1/images/gpu1.jpg b/project1/images/gpu1.jpg
diff --git a/project1/images/harddrive1.jpg b/project1/images/harddrive1.jpg
diff --git a/project1/images/motherboard1.jpg b/project1/images/motherboard1.jpg
diff --git a/project1/page1.html b/project1/page1.html
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+		<meta charset="utf-8">
+		<title>Components (Sight)</title>
+</head>
+
+<body>
+	<header>
+		<h1 style="text-align:center;">Components</h1>
+	</header>
+
+	<nav style="text-align:center;">
+		<a href="default.html">Home</a> - <a href="page1.html">Page 1: Components</a> - <a href="page2.html">Page 2: Building</a> - <a href="page3.html">Page 3: Startup</a> - <a href="../home.htm">Homepage</a>
+	</nav>
+
+	<main>
+		<h2 style="text-align:center;">Contents</h2>
+		<p style="width: 1000px; text-align: center; margin:0 auto;">There are many components that go into a computer such as GPU, CPU, RAM, and motherboards to name a few. Each of these components has an important role to play. CPU and GPU being the most expensive components but also the ones that mainly determine <i>how fast</i> a computer can run There are other secondary components that can affect speed such as having a Harddrive versus an SSD because an SSD is much faster. Its also important to note not that many other components are still very important such as Motherboards and RAM as without a enough RAM or a good motherboard the system can bottleneck causing drops in performance.</p>
+	<div style="text-align:center;">
+		<table style="margin:auto; border:2px solid #000; background-color:LightSkyBlue;">
+			<tr>
+				<td style="border:1px solid #000;">Cpu Example</td>
+				<td style="border:1px solid #000;">Gpu Example</td>
+			<tr>
+			<tr>
+				<td><img src="images/cpu1.jpg" alt="Example Cpu"
+					title="Example Cpu" height="250" width="250"></td>
+				<td><img src="images/gpu1.jpg" alt="Example Gpu"
+					title="Example Gpu" height="250" width="250"></td>
+			</tr>
+			<tr>
+				<td style="border:1px solid #000;">Harddrive Example</td>
+				<td style="border:1px solid #000;">Motherboard Example</td>
+			<tr>
+			<tr>
+				<td><img src="images/harddrive1.jpg" alt="Example Harddrive"
+					title="Example Harddrive" height="250" width="250"></td>
+				<td><img src="images/motherboard1.jpg" alt="Example Motherboard"
+					title="Example Motherboard" height="250" width="250"></td>
+			</tr>
+		</table>
+	</div>
+		<p style="width: 1000px; text-align: center; margin:0 auto;">Continuing on there are other components that can also cause problems is not properly vetted such as Power Supply. If you don't get a high enough wattage Power Supply then your components simply wont have enough power to run properly. Another component is the cooler as some CPUs can be overclocked to increase speed and without a good enough Cooler the computer may overheat and shutdown. Additionally, you have to consider what your putting all the components into as without a large enough case you won't be able to even put the thing together in the first place. All of these components and more are an essential part in designing the best computer for you. </p>
+
+	</main>
+
+	<footer>
+		<p>EDUCATIONAL ONLY, NO COMMERCIAL VALUE. | CONTACT: <a href="mailto:[email protected]">[email protected]</a></p>
+	</footer>
+
+</body>
+</html>
diff --git a/project1/page2.html b/project1/page2.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+		<meta charset="utf-8">
+		<title>Building (Motion)</title>
+</head>
+
+<body>
+	<header>
+		<h1 style="text-align:center;">Building</h1>
+	</header>
+
+	<nav style="text-align:center;">
+		<a href="default.html">Home</a> - <a href="page1.html">Page 1: Components</a> - <a href="page2.html">Page 2: Building</a> - <a href="page3.html">Page 3: Startup</a> - <a href="../home.htm">Homepage</a>
+	</nav>
+	<main>
+		<h2>Resources</h2>
+		<p>Getting down to actually picking out, buying, and building the computer there are many resources for you to use. One very important resource to take note of is <a href="https://pcpartpicker.com/" title="Pcpartpicker">Pcpartpicker</a> This site gives easy assess to tons of information for you to use. It allows know any problems in incompatibility for the parts you picked out and lets you see a price breakdown of the parts you've picked out so far and the total. Additionally, this site breaks down price via retailer so you know who is offering the best price. For someone who knows nothing about computers this is a great place to start.</p>
+		<p>Continuing on information about how to specifically put together each part can be learned in multiple ways. One way is to use the manual that the computer parts come with another is to watch the video example below. Even just googling what component does what and what each of the specifications mean on each components can teach you a rather large amount of information. It is always recommended to research thoroughly before going through with a purchase to ensure that you don't have to spend time sending parts back, which is why the least recommend way of learning how to build a pc is through the manuals they come with as you should large have an idea of what your doing before committing to a purchase. Although, once you have gone through with a purchase that doesn't mean you shouldn't go through the manual if you get a little lost.</p>
+		<h3><small>Video Example</small></h3>
+		<p><iframe width="560" height="315" src="https://www.youtube.com/embed/IhX0fOUYd8Q" border="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe></p>
+	</main>
+
+	<footer>
+		<p>EDUCATIONAL ONLY, NO COMMERCIAL VALUE. | CONTACT: <a href="mailto:[email protected]">[email protected]</a></p>
+	</footer>
+
+</body>
+</html>
diff --git a/project1/page3.html b/project1/page3.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+		<meta charset="utf-8">
+		<title>Startup (Sound)</title>
+</head>
+
+<body>
+	<header>
+		<h1 style="text-align:center;">Startup</h1>
+	</header>
+
+	<nav style="text-align:center;">
+		<a href="default.html">Home</a> - <a href="page1.html">Page 1: Components</a> - <a href="page2.html">Page 2: Building</a> - <a href="page3.html">Page 3: Startup</a> - <a href="../home.htm">Homepage</a>
+	</nav>
+
+	<main>
+		<h2>Final Steps</h2>
+		<figure>
+			<figcaption>What your looking to hear after pressing the power button.</figcaption>
+				<audio controls>
+				<source src="audio/Successful_Startup.mp3" type="audio/mpeg">
+				Your browser does not suppport the audio element.
+				</audio>
+		<p>After you've put together your computer and confirmed it works and all components are properly in place there are only a few final steps to complete. You need to buy a cd key for the windows Operating System of your preference, or if you prefer Linux, that is free to download. so after booting up your Operating System from a Flashdrive or a disk there are only a few steps remaining. First you need to update any drives for your computers GPU primarily and any others that are also available. You need to get an anti-virus software, a password, and of course a new background picture. </p>
+		<p>This concludes my guide from building a computer of course there were somethings that I didn't cover that can modify your experience when using a computer drastically, such as headphones, DAC, AMPs, and multiple monitor setups to name a few things that can enhance your experience when using a computer. Naturally of course you can't forget a good chair and desk.</p>
+	</main>
+
+	<footer>
+		<p>EDUCATIONAL ONLY, NO COMMERCIAL VALUE. | CONTACT: <a href="mailto:[email protected]">[email protected]</a></p>
+	</footer>
+
+</body>
+</html>
diff --git a/project1/style.css b/project1/style.css
@@ -0,0 +1,5 @@
+.center{
+	display: block;
+	margin-left: auto;
+	margin-right: auto;
+}