How I Built My Personal Website with GitHub Pages (and How You Can Too)

April 2026 · Website building

For years, I relied on LinkedIn as my main professional profile. But I wanted a space I could fully control: a simple personal website where I could showcase projects, experiments, and ideas. GitHub Pages turned out to be the easiest way to get started.

In this post, I walk through the same approach I used for teoyongsong.github.io. If you have been thinking about sharing your work online, this is a lightweight and free path.

Step 1: Create Your GitHub Pages Repository

Log in to GitHub and create a repository named yourusername.github.io.
Make it public so others can access the site.
You can initialize with a README, but the key file is index.html.

Step 2: Draft Your HTML Page

Your site can start as a digital business card. Mirror your professional basics: headline, about, experience, projects, and contact details.

<!DOCTYPE html>
<html>
<head>
  <title>Your Name</title>
</head>
<body>
  <h1>Your Name</h1>
  <h2>Job Title | Industry</h2>
  <p>Short professional tagline (from LinkedIn headline)</p>

  <h3>About</h3>
  <p>Paste your LinkedIn “About” summary here.</p>

  <h3>Experience</h3>
  <p>Company – Role – Duration</p>

  <h3>Projects</h3>
  <ul>
    <li>Project 1</li>
    <li>Project 2</li>
  </ul>

  <h3>Contact</h3>
  <p>Email: yourname@example.com</p>
</body>
</html>

Step 3: Add Some Style

Add a style.css file to improve readability and visual structure.

body {
  font-family: Arial, sans-serif;
  background: #f4f4f4;
  color: #333;
  line-height: 1.6;
}

h1, h2 {
  text-align: center;
}

Then link it in your HTML head:

<link rel="stylesheet" href="style.css">

Step 4: Deploy with GitHub Pages

Push your files (index.html, style.css, images) to the main branch.
Go to your repository: Settings → Pages.
Under Source, select main branch and save.
Your site goes live at https://yourusername.github.io.

Step 5: Share Your Work

Once the site is live, use it as a portfolio, project showcase, or blog. Mine is at teoyongsong.github.io. It is not perfect, but it is a start, and that is the point.

If you have built something, even a small one, share it. Sometimes the most valuable thing is not polish, but the courage to publish your work.

Closing Thought

A GitHub Pages site is more than a webpage. It is a statement that your ideas deserve a home. Start simple, keep it practical, and let your projects speak for themselves.