A small practice website makes it easier to understand what an HTML change actually does. You can edit one link, break one path, and inspect the result without a theme or plugin generating hundreds of other elements.
Use dummy content and keep this project separate from production. The objective is to connect the file you edit with the response and page you inspect.
Download the minimal HTML practice project. It includes the two pages, stylesheet, optional script, and setup instructions used for this exercise.
Create the project folders
Create a folder called seo-practice with this structure:
seo-practice/
index.html
about.html
assets/
css/site.css
js/site.js
images/
fonts/
The folder names are a convention for the exercise. A real CMS may separate theme assets from uploaded media and generated files. Learn where a resource comes from before changing or deleting it.
Use a plain-text editor intended for code. Save files with their real extensions, and check that the editor has not produced index.html.txt. Keep indentation readable so nested elements are easier to follow.
Add a minimal page
Put this in index.html:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>SEO practice home</title>
<link rel="stylesheet" href="/assets/css/site.css">
</head>
<body>
<h1>SEO practice website</h1>
<p>A local project for inspecting page output.</p>
<a href="/about.html">About this project</a>
</body>
</html>
Create about.html with a similar structure and a link back. Add a simple CSS rule so you can see when the stylesheet loaded.
Serve it through a local web server
Opening an HTML file directly can demonstrate basic markup, but a local server gives you HTTP URLs and more realistic path behaviour. If Python 3 is installed, run this from inside the project folder:
python3 -m http.server 8000 --bind 127.0.0.1
Open http://127.0.0.1:8000/. Stop the server with Ctrl+C when finished. Binding to the loopback address keeps this exercise available locally. The command is a development convenience, not a production hosting setup.
Practise one change at a time
Change the page title, save, and reload. Inspect the source to confirm the new value. Then change the link to a nonexistent filename and inspect the destination’s response in Network. Restore it before the next experiment.
Add an image with a deliberate wrong path. Compare the successful document with the failed image request. Next, add a simple script or style and observe how the page changes when its resource is unavailable.
Use a repeatable exercise sequence
Work through head metadata, content structure, and crawlable links. For each change, record what you expected and what the browser actually received. Use real status responses rather than inferring success from the appearance of the page.
A static local project does not simulate a full WordPress application, database, CDN, or Google’s indexing system. It gives you a small environment for learning the markup and request mechanics first.
My developer SEO training uses practical checks like these to connect implementation with browser output. For wider teams, SEO and AI training can include exercises appropriate to the systems they actually maintain.