Setting Up Your Screen for HTML

Follow these steps carefully • Year 7 Computing

What you are going to do: You are going to open two things at the same time and put them side by side: on the left, your HTML file open in Notepad so you can type your code — and on the right, the reference sheet open in Edge so you can look things up.
Part 1 — Open your HTML file in Notepad
1

Find your HTML file in the folder your teacher has told you to use. It will be called something like mypage.html and will have a small orange Edge icon on it.

2

Right-click on the file. A menu will appear.

Windows 11 only: If you see “Show more options” at the bottom of the menu, click that first to see the full list of options.
3

Hover your mouse over “Open with”. Another small menu will slide out.

4

Click Notepad from the list.

Can’t see Notepad? Click “Choose another app” and then scroll down to find Notepad in the list.
5

Notepad should open and you will see your HTML code as plain text. If you see lots of strange symbols, ask your teacher before continuing.

Part 2 — Open the reference sheet in Edge
6

Go back to the folder. Find the file called html_reference.html.

7

Double-click on html_reference.html. It should open automatically in Microsoft Edge.

Opens in the wrong programme? Right-click the file, choose Open with, then click Microsoft Edge.
8

You should now see the colourful reference sheet in Edge. You will use this to look up tags while you code.

Part 3 — Put them side by side
9

Click on your Notepad window to make it the active window (click anywhere on it so it comes to the front).

10

Hold down the ⊞ Windows key and press the ← Left Arrow key.

Notepad will snap to the left half of your screen.

11

Your computer may show you a list of other open windows on the right side. If you see Microsoft Edge appear, click on it and it will snap into place on the right.

If nothing appears on the right side: Click on the Edge window in your taskbar (the bar at the bottom of the screen), then hold ⊞ Windows and press → Right Arrow. Edge will snap to the right.
12

You should now have Notepad on the left and Edge on the right. If either window is too small to read comfortably, drag the dividing line between them left or right to resize them.

✓ You’re all set! Use the reference sheet on the right to look up tags, then type your code in Notepad on the left. When you want to check how your page looks in the browser, save your file in Notepad (Ctrl + S), then open your own HTML file in a new Edge tab.