How to Add a Web Page and Link To It
Copy and paste the following code into a new page in the text editor and save it as page1.html in the htdocs folder
👉Windows users:Be sure when saving page1.html that you set the All files filter. If you don't, Notepad will likely save it as page1.html.txt and you'll get a File Not Found message when you try to view it.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Page 1</title>
<meta name="description" content="page1.html">
<meta name="keywords" content="page1.html">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
max-width: 100dvw;
color: dodgerblue;
background-color:whitesmoke;
font-family: Helvetica , arial , freesans, sans;}
h1 {
font-size : 2.25rem;
text-align: center
}
p {
font-size: 1.5rem;
text-align: center
}
</style>
</head>
<body>
<h1>This is Page 1</h1>
</body>
</html>
🔴 Save as page1.html
Change the line of code in red in myfirstpage.html to add the linked page.
<nav>
<a href="#">Home</a>
<a href="page1.html">Page 1</a>
<a href="#">Page 2</a>
<a class="hide" href="#">Page 3</a>
</nav>
🔴 Save myfirstpage.html
👀 Preview Changes
Click the link on myfirstpage.html that you added for page1.html.
👉Note: You should begin to test the web page with the Emulator Tool.
At this point you should also be checking your code in the W3C Validator.
Need something more advanced? Check out our Web Development Resources page for some more advanced tutorials and reference guides for HTML5, CSS3, Responsive Design and SEO.