Khaled Garbaya avatar

Khaled Garbaya

Software engineer and a web development instructor

Amal Nasri avatar

Amal Nasri

Electronic engineer and a foodblogger

Build a website with just HTML

In this therapy, Amal builds her own website with just HTML. We'll be using visual studio code as the main editor along with the live server extension to have auto refresh whenever we change something in the website and save.

Show Notes

Downloading visual studio code

Download visual studio code, it's an opensource and free code editor by Microsoft. You use this link.

Writing your first HTML file

Every website is a folder with a files in it. The first entry point is usually called index.html.

  • Create a Folder called website or call it anything you want.
  • Drag the folder into the visual studio code window
  • Click the new file icon
  • hit cmd+s, ctrl+s on windows, to save the file and name it 'index.html'
  • type '!' and hit tab, usually the key with the following . The code editor will generate a basic html page for you
  • Create a another html page called page1.html and repeat the previous steps
  • Use the <a> element to define a link.
  • Use the href attribute to define the link address.
  • In index.html set the href attribute to page.html
  • To link page1 back to index .html add a <a> tag and set the href to index.html

More HTML tags

  • <h1> to <h6> for headings
  • <img> tag to display and image
  • <p> for parapraph

Visual studio code: