Magento 2 Experten — Hyvä Theme, Tailwind CSS & SEO aus einer Hand ›

Creating and Opening Your First HTML File

Creating and Opening Your First HTML File

~8 Min. Lesezeit Zuletzt aktualisiert am August 8, 2026

Now it gets concrete: we'll create your very first HTML file. In VS Code, click the small "New File" icon on the left (or right-click the folder name > "New File") and name the file index.html.

Tipp: The name index.html isn't required, but it's a very important habit: almost every web server automatically displays the file named index.html when someone visits a web address without a specific file name. That's why the home page of a website is almost always called that.

Writing the first content

Now write exactly this one line into your new, empty file:

index.html
<h1>Hi, I'm Finn!</h1>

That's already valid HTML! <h1> means "a big heading starts here" and </h1> means "the heading ends here". Now save the file with Ctrl+S (Windows/Linux) or Cmd+S (Mac).

Opening the file in your browser

Now comes the exciting moment: open the my-website folder on your computer (not in VS Code, but in your normal file explorer or Finder) and double-click index.html. Your browser opens automatically and shows your very first website: a big heading reading "Hi, I'm Finn!".

Tipp: Alternative in VS Code: right-click index.html on the left, then "Open with Default Browser" or similar (the exact wording depends on your operating system). Some people also install the free "Live Server" VS Code extension, which reloads the page automatically every time you save - handy, but not necessary to work through this tutorial.

The workflow you'll repeat from now on

You'll keep repeating exactly these three steps throughout this tutorial:

  1. Write or change code in VS Code.
  2. Save with Ctrl+S or Cmd+S.
  3. Reload the page in your browser (F5 or the circular arrow button) to see the change.

Try it right now: change the text in your file to <h1>Welcome to my website!</h1>, save, and reload the page in your browser. The text should have changed instantly.

Achtung: If your browser shows the raw text <h1>Hi</h1> with angle brackets instead of an actual heading, you probably didn't save the file as index.html, but as something like index.html.txt instead. Check the tab at the top of VS Code to make sure it really says index.html.