Resources to Help You Learn GitHub Pages

GitHub Logo

The SESYNC Cyber Team has compiled some resources, including tutorials and examples, on how to use GitHub Pages. Most of them are based in Markdown and Jekyll. Markdown is a “lightweight markup language,” meaning a way to write a text document with minimal formatting codes that can be rendered into a document such as a webpage. Jekyll is a “gem” written in the Ruby language (to be cute, but confusing, they call packages in Ruby “gems”) that turns documents written in Markdown into (static) HTML sites with nice layouts. It isn’t necessary to use Markdown and Jekyll to use GitHub Pages, but Jekyll has built-in support for GitHub Pages so everything integrates pretty well. This means GitHub takes care of converting your human-readable files (like Markdown) to HTML, including all of the relative link paths to navigate your website based on configuration files. Hugo is an alternative to Jekyll.

Pros and Cons of GitHub Pages


  • Free, no ads!
  • You can customize it however you want.
  • You can use your page to demonstrate your skill in website creation to potential employers, because they can look at the underlying code on your repo.


  • It seems like the main weakness of GitHub Pages and associated templates is that they don’t look that great on smartphone screens. There might be some ways around this but it is something to be aware of.
  • It takes more initial learning time than point-and-click interfaces for creating sites, especially if you really want to customize things.

Tutorials for beginners

Some more basics & tips

Templates for personal sites

These are focused on academic personal sites but could be used for other purposes. Lots more templates are out there.

Example sites that use GitHub Pages