Minimalism

Less is more

My idea was to have a very basic layout. Nowadays people know how to use websites, but I'd like to achieve intuitivity through simplicity. The website should be straight forward and focused solely on content: As simple as possible.

Instead of making buttons or working with borders or boxes I decided to focus on smaller things: One background color and two colors for text is all I need. Images would just float on the right of the text without any decoration. I chose a simple font and a style inspired by the linux shell.

Focusing content

The bright orange highlights what's important: the content. The blue blends more into the grey backround and while still being clearly noticeable steps back a bit compared to the text. Width and height of the content box are limited to never have too much text at once on screen. The user should always have a good overview and never be overwhelmed.

I wanted links to be subtle and chose to use a plus and automatically add it to links. To further indicate them though they change color on hover similar to the menu; they're only but clearly highlighted when the user is interested.

Stripped down

In order to have no distraction whatsoever I decided not to show scrollbars. The content is still scrollable and I hope that the website is intuitive enough to sacrifice functionality in favor of simplicity.

Text is justified for readability, the site is responsive except for images yet. For the portfolio and an alternative layout as well as for future links I chose to use a drop-down menu.

Instead of cluttering the main menu, the drop-down menu is labeled 'more' and expands when hovering. A click opens the respective link in a new tab, hence a plus again for indication. The label gets overlayed by the drop-down menu to limit options.

Little things

I tried to pay attention to detail in every aspect. The connection to the main site is secure (https) and there is a .htaccess file so that the URL always resembles the menu item. The portfolio and the alternative site are on subdomains to clearly differentiate them. There's also a simple custom error page and favicon. Because the plus before links and the underscore for headlines are added via CSS they won't get selected when selecting text.

Every link opens in a new tab. Images change their opacity when hovering and are clickable as well.