New site design #
I finally decided on a design for this site and developed the main page. I designed the layout in Adobe XD so that I could eliminate the guesswork when in development. The site is built with 11ty static site generator for quick development and content publishing and a fast front-end. I plan to continuously improve the website.
I still need to adjust a few things (typography, consistent spacing, mobile-friendly, etc) but at least I have something up.
Modern brutalist web design #
I was experimenting with some brutalist web designs for my site and decided against it. At least for now. I admire some of the minimalist approaches to it but I pondered to myself "Is it too extreme that non-designers may not understand". Also if executed incorrectly, it would appear that there is a problem with the site instead of thinking everything was purposefully designed.
I feel some of the brutalist design is about irony and a simplified version of the web. However, there is a modern approach to some of these sites with high interactivity, offset grids, transitions, lots of animations and quality content.
I appreciate the Safari Riot website. When looking at it you can see, based on their clients, that they are well-known enough to be on bleeding edge of design and their website doesn't have to generate new client leads for them. It becomes more of an art piece to show off their work.
Tailwind CSS #
I started looking at Tailwind CSS, although I did not use it on this site, I am interested to start messing around with it. I have a few performance concerns since every class is essentially 1 CSS style and property. They recommend using PurgeCSS alongside it to remove CSS classes that are not used on your website. There are a few case studies of larger projects that show how small the production CSS can be. 
Benefits I see #
- Quickly develop sites with a higher focus on markup rather than having CSS or SASS files open
- I could use this for quickly developing landing pages or prototypes to test.
- A Twitter user had mentioned that it's really easy to share markup with other users of Tailwind since the CSS classes are the same in all projects.
- Setup config, components, and theme up and not have to worry about editing styles while developing markup
- Less worrying about creating unique and re-usable CSS class names
- Able to minify Tailwind CSS with PurgeCSS
- Lots of configuration options including the ability to prefix all the classes so you can use your own CSS without interference
- A developer could switch between projects easily without having to look over a new CSS or SASS file to figure out class and component names.
Concerns #
- It works against other CSS patterns such as object-oriented CSS and BEM.
- A developer would need to learn and memorize the syntax and formatting for names of all the classes, properties, and values.
- I still have some performance concerns and wonder if you can develop smaller CSS with other patterns (or does the tiny difference matter)