Óscar's Web Home

Thoughts of a scientist, dancer & fountain pen writer

Website redo and blog migration

Today my website experienced a complete redo with a new design. The previous presentation was established to mimic my blogger site. That required a great amount of effort because I like simple things and to simplify the blogger theme was quite challenging, I not always get CSS do what I want. Also the web site could be seen in web browser but gave already problems in mobile phone browsers, and doing the translation of the blogger site version for mobiles was an unwanted challenge.

Now the decision is different. I’ll keep a very simple website, easy to understand in its code base and simple to update. Then the most notorious change is just dropping blogger integration and keeping the blog statically generated within the tools available from GitHub Pages. To start simple, I continued with a static website generated by Jekyll, but now including the blogging section. This starting template also looks good on small screens, and I understand the code to edit both of the templates.

Jekyll now has a start-up template, which is pretty much what you see now. I added a few changes to recover what I feel were fancy parts of the previous layout as the main content being in a shadowed container, and the link menu being hover responsive. But, I’m not a graphical designer and some stuff just doesn’t look nice yet. I also fight with CSS a lot. In the end, I managed to get my wish done and simplified a few things in the code, and understood how it’s working.

Importing the blogger post was really easy because I didn’t have many anyway and I could do it manually.

What did I learn this time?

  • Unless you have a clear picture of the end output, don’t mess with CSS
  • I can import icons from Font Awesome, instead of redrawing them for the website. I did the redrawing because Jekyll sends sample icons. But after checking some websites inner workings I found Font Awesome to rescue me. That’s why I love open source, you can see how stuff is done and build from there.
  • Together with Jekyll is SASS, and it is a great help for writing my CSS code.

What has yet to be done?

  • Add content of course
  • Link my open source work into this website
  • Test other tools for web design. Having a blog requires also people being able to comment on posts. During this redo I discovered other tools in GitHub Pages that shall be included later on.
  • Anything that is good, has to be redone. Because on the way I learn and that changes my perspective on how to do things better. That is the course/joy of an iterative leaning process.