Hi everyone
WHAT:
=====
I greatly respect OpenBSD; while I don't have OS tech level expertise
to contribute - I do have some design skills and wanted to contribute
to the community and project.
So I created a new CSS (stylesheet) for OpenBSD.org
It can be viewed at:
https://www.openbsd.design/cvs/www/index.html
WHY:
====
I wanted to attempt to accomplish the following:
- Responsive. Currently, the site is not responsive and difficult to
read
on a mobile device. Like /index.html, /lyrics.html and /support.html
- Simplify the color palette. There's many different colors competing
for
attention (and causes distraction) on the website for vary choices of
headline, table, background, etc colors.
- Make code samples or inline KBD easier to distinguish.
- Size images correctly for better reading of content.
- Bring an updated freshness to the overall site, while not losing its
original great character.
CHANGE:
=======
Note: with the exception of adding a ViewPort to /index.html,
*no* HTML pages were changed. Only the OpenBSD.css file &
inclusion of 3 web fonts.
The changes to the website include:
- a new OpenBSD.css stylesheet
- include of a <meta name="viewport"> tag on /index.html
(in order to make /index.html have a responsive layout)
- Added 3 web fonts that are OFL1.1 licensed & attributed in CSS
Lato normal and bold for body text
Domine for headings
- Adding puffy to the footer of all pages except for /index.html
(I thought this was a nice playful way to bring some character
to the overall website.)
- Restyled Dark Mode colors as well (not just Light Mode)
- Hid the server rack photo on /index.html
While I appreciate the image, I thought it might be too distracting.
- Any links to cvsweb, I styled as monospace font.
DESIGN PRINCIPLES:
==================
I searched through the mailing list and found 2 previous attempts
of individuals showing a new design concept for openbsd.org.
The principles I stood by is:
- HTML should not be changed, the structure and content of the
site is already great. The only change should be to the CSS
file. Note: as previously mentioned, I did need to update
/index.html to add a missing ViewPort so the page would be
responsive.
- The design change should apply the ENTIRE website hosted
on www.openbsd.org, which this does.
- Kept the same recognizable layout.
I saw examples in the past where individuals made substantial
structural changes for no apparent reason.
- The design update should focus making content the main feature,
since OpenBSD is known for having such great documentation.
NEXT STEPS:
===========
I've never posted to an OpenBSD mailing list, so please be kind.
1. I'd welcome feedback.
Note, I've updated both Light Mode and Dark Mode.
https://www.openbsd.design/cvs/www/index.html
2. I purchased the domain https://OpenBSD.design and would like to
transfer this to the proper party to own/maintain.
Please email me direct so I can do so.
3. I need to make a diff, but for some reason - I'm running into
issues doing so and I think it's related to the introduction
of the 3 new font files. Any suggestions beyond what's
documented at https://www.openbsd.org/faq/faq5.html#Diff
I hope this design update is welcomed with open minds.
Looking forward to reading feedback.
-mlp
