Limited Entertainment

Web design assets for the hasty ones

It doesn’t take too much time and knowledge to design a simple-to-code, lightweight, easy-to-maintain website, blog or portfolio. You can achieve pretty good results by simply using some CSS framework and/or static sie generator and following along their respective documentations. Inspired by this talk at Erfa Essen (in German) I compiled a bunch of resources for easy, low-level web design purposes. Basically no JavaScript knowledge’s required, only a bit of HTML and CSS.

Web design assets

CSS templates

If you really just want to use a template and fill it with your content, or if you want to get a professional-looking website template to modify, here’s some starting points:

  • HTML5Up - Customizable website templates in HTML5 + CSS3 (looks really slick and »up-to-date«)
  • IBM’s Carbon Design System - very nice-looking alternative to Material Design; you can find a lot of website elements on their CodePen, ready to be copy-pasted

CSS frameworks

Developing your own design and style system for a website can take a very long time and you might end up with a whole lot of custom CSS rules, media queries etc. for the single components of your page. From my experience, using a CSS frameworks will enhance this process quite a bit as those often come with a lot of defaults that just work visually and allow you to focus on certain aspects of your designs. Frameworks like Tailwind will also limit your choices with regards to sizes, spacing etc., which I find helpful in coming up with a consistent design. However, for most of these frameworks you will need to dedicate some time learning the syntax.

  • awesome-css-frameworks list - find a whole lot more here
  • Bulma - »a free, open source framework that provides ready-to-use front-end components that you can easily combine to build responsive web interfaces«
  • Fomantic-UI - an active fork of the seemingly deprecated Semantic-UI
  • Sakura - »a minimal classless css framework / theme«
  • Tailwind - I find this one quite accessible

fun stuff

Colours, shapes, etc.

Website builders

If you really don’t want to do any coding at all, you can try one of these no-code website builders. They all offer free tiers with certain limitations; usually, you can only host one page and only on their servers/domains.

Static Site Generators

Blogging

  • ʕ•ᴥ•ʔ Bear - a nice and simple blogging platform
  • Blot - let’s turn a folder into a website easily
  • Hexo - »A fast, simple & powerful blog framework«
  • Hugo - very powerful and fast once you have got a grip on it, but not exactly easy to learn for beginners
  • Paper.wf

Hosting and Domains

Content management systems

If you want to have your own CMS and run a blog or something, you can get some affordable managed webspace from Uberspace for example. They offer a bunch of options along with step-by-step guides for setting up a CMS on their servers over at their Uberlab CMS collection. As for honorable mentions I also recommend this super light-weight CMS:

  • Lichen - »the simplest possible CMS for the web that is friendly enough for non-technical users«

other useful assets

random stuff

  • Dither Me This - create dithered versions of your images
  • hekate2’s button maker - get old school 88x31 buttons for your website
  • htmx let’s you use features like AJAX, caching, WebSockets, animations etc. directly in HTML
  • Quartz (by Jacky Zhao) - sort of a boilerplate for a digital garden based on Hugo and Obsidian (optional)
  • textcraft - let’s you generate flashy word art

awesome lists