Design Inspiration
I got inspired by aspects of the following websites:
A minimalistic approach
The website is very simplistic by design. Some articles that promote the idea of simplicity in web design:
Color scheme
The website has a minimalistic grayscale color palette. The only colors on the website are found in code blocks. Other websites that use grayscale color scheme are:
Breadcrumb navigation
I was visiting the mellow.dev website once and immediately loved the breadcrumb navigation on top of the screen. I believe this is a great implementation of flexible navigation. It not only functions as a ‘go back to top’ button but also allows for navigation up one or multiple levels.
Link styling on hover
Since the website uses a grayscale color scheme, I found the default blue text
color for <a>
links didn’t match the design. To make links stand out, I added
external link icons and underlined the link text. Additionally, I inverted
the text and background colors on hover. I was inspired to use this color
inversion technique by Bradwoods garden and
wiki.xxiivv.com.
Tables
The table design is copied from Bradwoods garden.
Lorem ipsum
When visiting gwern.net I stumbled upon a sandbox page. Gwern Branwen, the developer of gwern.net, explained he uses it as a testing playground. I thought this was pretty handy and decided to implement my own lorem ipsum playground to quickly check if I did not break any of the features of the website.