I used DWol's post as the ground for redesign due to its article look from the beginning

Tufte CSS seemed a good addition to Hubski, so I went on to experiment with the design. The main feature of Tufte CSS' markup is the sidenotes and margin notes. Check out the latter (with a bit of styling, made from DWol's parethesis comments):

Overall, it's a concise design, following the philosophy behind what Hubski currently shows. It gives the post a clean, thoughtful look without distracting the user. Tufte CSS also makes all images and inline videos responsive by default.

Under the hood, there are some changes to the HTML structure of the parts shown: redundant elements removed, some class names changed (like removing the dash and the number from all `cdot` circles), some CSS optimization done (like showing `cdot`s per number of votes). I've talked to mk about optimizing Hubski's HTML before but had no reply. It's okay: I know mk's a busy man — which is why I offered to do the spring cleaning myself.

Feel free to check out the codepen itself: it contains a number of CSS experiments that could also be introduced into Hubski's design, either directly or as a separate theme. Like...



mk:

Very sharp!

It is true. I am buried atm. I get to Hubski work intermittently, and have a priority list. CSS spring cleaning is lower on it. That said, I’d use this. It’d be a great style option.


posted by FirebrandRoaring: 136 days ago