Personal Web Site

Motivation

  • Flexibility and independence: Nowadays most universities provide personal websites to their academics together with the required permissions to publish and edit individual content. Despite the restrictions imposed by content management and cooperate design it usually works fine for most things. However, changing workplace implies always the complete loss of these “personal” websites. An alternative are platforms such as Research Gate. But, as the name indicates, these platforms focus on research and are not intended to host, for instance, teaching material or software projects.
    Universities work usually with specific platforms to manage courses and course material. Access to courses, however, is limited to members of the very university. A personal website makes it easier to share courses or teaching material without such limitations.

  • Curiosity: I have been interested in developing a website for quite a while but somehow there were always other things to do first. A Covid-19 quarantine period of two weeks was necessary to finally start this project. Looking back, I can confirm that one learns a lot not only about websites and web technologies but also about platforms such as github. It was definitely worth the effort.

Technicalities

At the beginning I thought that generating the site wont be a big deal. There are sites like Wix.com and WordPress which offer the creation of free websites just by clicking around after choosing one of their many appealing themes. However, ‘free’ is relative. Certain features are just not available without paying.

The use of really free alternatives, on the other hand, requires at least a minimum knowledge about HTML, CSS, Markdown, etc., which implies learning. Hence, as almost always in life, learning not only generates opportunities to save money but it usually helps to establish freedom and independence.

Since, programming is anyway part of the job and HTML is just another language, it seemed as if a couple of days should be enough to finish a first version. I was wrong.

While reading Jon Duckett’s book “HTML & CSS Design and Build Websites” (John Wiley & Sons, Inc., 2011), I became aware of the complexity of the issue. After trying out a couple of things, I finally decided to work with the static website builder Jekyll to generate the site. After that, github was an almost obvious choice for hosting the page.

The main reason to use Jekyll and not Hugo was the theme provided by Matthew Kirby for Jekyll based on the Minimal Mistakes theme. But, even with such a nice and not too complex theme at hand, it took more than a week to finish a satisfying version of the website.

After having a version which worked fine locally, the next challenge was to make it work on github because a number of links were broken. Eventually, the following adjustments solved these issues:

  • Set baseurl: “/” and url: “https://uwemuehlich.github.io” (in my case, of course) in the site settings part of “_config.yml”.
  • Suppose, in the root directory of the site there is a folder “file” which contains “image.png”. To embed the image use {{site.url}}{{site.baseurl}}/files/image.png to define the link, for instance,
    src=”{{site.url}}{{site.baseurl}}/files/image.png” alt=”centered image” />
    witin an HTML paragraph environment.