CSS unlimited

… prepared for cut and splice across browser-land.

For every single page that grows up in my editor(s), a number of CSS combinations are tested to see what will carry the specific article best. Most are built with, and on top of, pre-arranged markup and CSS created a decade or more ago. With bits and pieces of newer code that is found to work acceptable in latest browser versions, added in where I find sensible uses for them.

Browsers offer better support these days, but otherwise not much has changed in 20+ years.
I may be old-fashioned, but who cares as long as everything works as intended.

The more flexible the design techniques, the better chance I'll find combinations that will work across the entire range of apps and devices my pages may end up on. So, while the “norm” is to rely almost entirely on complete styling for elements that are repeated, I prefer to style elements “less complete” and have ranges of “modifiers” at hand.

Whitespace do for instance play an essential role in web design, and much of the seemingly superfluous modifier-styling is for pulling and pushing elements horizontally and vertically, to make them line up in certain ways relative to each other. All very simple, but somewhat similar effects can be achieved in different ways with slightly different outcomes and effects on their neighbors, which means there are many lines of code only for varying margins, paddings, relative offsets, width and height, in the main stylesheets.

That the entire CSS combo must work well in conditional elastic layouts, means I have used lots of what looks like “duplicates” of the same “modifier” classes, with different values that kick in at certain window/screen widths, along with changes in font-sizes, line-heights, and so on. The short class names I use, for the most part only hints at what they do – not much “semantics” in my selector naming conventions.
All in all a rather complex and sort of messy CSS, intended to make all visual alignments look simple and “just right” across the widest possible range of screens.

My main work is of course centered around arranging content for easy access, and being easy on the eyes to anyone who happens to pass by. The old “content is king” mantra still goes.

splicing it together

A short line of gibberish in the form of classes…
<p class="ha-6 pob5"><span class="ha-6b tlc tac cf1 cfs2 tsy20 bup6 sh"> … </span> … </p>
… ended up as the “overshooting container inside another container”, presented in the section above. Prioritizing flexibility over clarity at the code-level one might say, and with styling to go with the medium, and added content, it displays exactly as intended.

Styling for several media, screen-sizes and paper-width in turn, can sometimes be a little tricky and require added classes. I prefer that slight overstyling technique over going for some form of “one size fits all” styling, as, to be honest: one size rarely ever fits much of anything all that well in web design, unless the layout is kept extremely simple.

Some seriously overdone CSS selector chains here and there for improved control and ease of manipulating the content carrying HTML, and otherwise written as compact as possible without making it totally unreadable for myself. I won't receive any prices for well-formed and easy-to-read stylesheets, but luckily browsers don't mind as long as the code is machine-readable and correct.

variations over basic designs

Everyone who has been in the trade for a while has developed a set of individual and somewhat unique working methods. A couple of decades have shaped mine, and although I am unable to describe them in much details, they work.

Instead of restyling the site every few months or couple of years and follow trends, I draw on a huge collection of CSS styles to create variations as new pages are added on site, and may also update design details on older pages along with current content. As the basic layout stays the same across the site in reflection of my personal taste, more frequent visitors should not become confused.

I do from time to time receive email-comments from people in the business who can do it all so much better, at a price of course. I won't argue, but I have yet to be presented with design examples or methods that suit me better than what I have.

I don't know the actual number of usable CSS combinations those rather large main stylesheets behind this site contain, and as I add and modify details whenever I feel the need, I'll probably never find out. Number of available combinations is in the thousands, and that will have to do on a live test-/play-/info-site like mine.
I import or link to extra stylesheets as/when needed. A simplified browser targeting stylesheet is for instance linked in to this page, just for the fun of it.

The total load of regular and irregular stylesheets has been significantly reduced over the years, as old and obsolete browsers in need of separate stylesheets for workarounds have dropped to insignificant levels.
Not many Internet Explorer versions left in the wild by now, and Mozilla and Chromium based browsers – covering nearly the entire web browser landscape – don't need any extras in order to behave acceptable and render web pages more or less identical, as long as they get their regular updates.
What the few other rendering engines one may be able to list up as we write the year 2021 are doing, is not something I pay much attention to these days. They are either up to the task, or they fail.

bling be gone…

Mastering most tricks of the trade, does not mean one has to show off with all that many “smart design” solutions at every opportunity. KISS variants of visual designs tend to cover most ground and work for most visitors, and also last the longest on a web of everchanging trends.

Most browsers released today include built-in or added options for presenting pages in their plainest and most primitive form – more or less as simple html formatted documents stripped of actual design and what is deemed “irrelevant content”, which means I won't have to go very far down the “undesigned” or “vanilla” routes when designing mine.
What end-users with these “CSS strippers” at hand choose to do with my carefully crafted web designs, is entirely outside my sphere of control, and interest.

That I personally tend to ignore most disturbing factors on web sites I visit, have of course had an effect on my own design work in that I am hesitant to include stuff that is not part of or in direct support of the actual content. I could of course have made mine a lot plainer than what they are, but what the heck; I like visual divisions.

CSS only

Back in 2013 I decided to test out CSS only for functionality. This site itself did not need much – only the Addendum open/close function on wider screens relied on JavaScript (some older pages still do), and I could have left it at that. However, as the HTML/CSS solution was so simple and reliable, taking it into non-essential areas followed naturally.

Usefulness of “functional CSS” may be questionable – as with all things and techniques in web design, but it is best not to ask any questions beyond what user-agents will do when fed the content carrying code. So far so good, and knowing that all is working as intended is all that matters to me.

sincerely georg; sign

Hageland 24.jul.2021
last rev: 26.jul.2021

side notes.

Aha!

All in good fun, as always when I pull up the revamped browser targeting image. Not all that many individual browser engines to target these days, but the old hacks still work as expected on the few that are left.
And even better: apparently there is no longer any need to hack my way into, or past, any of them for real. That may change…

What browsers do on our devices apart from decoding more or less carefully craftet code and lining up content as intended on our screens, is still very much a big unknown to most users. Only hope that not too many users end up as sorry losers in the ongoing “marketing technology vs. privacy” wars. Choice of browser can make a real difference…

cutting ties to the past‥?

Let us for a moment pretend that web design has entered a new phase, and that all the old design methods are obsolete. Nothing can be further from the truth, but let us not disturb those new to the trade with simple (and old) facts.

Pixel dencity has most definitely increased over the years, resulting in greatly improved picture quality on smaller screens than what we had when I started.
May be time for something worthwhile to look at? I have heard social networking services like Instagram was good for sharing what some thought were good ones once upon a time. Those were the days…

OK, so everyone and their dog can put something they insist on sharing with others in digitized forms, up on the world wide web these days. Not unlike what they could 20 or so years ago, but there are more ready-made platforms to spread stuff on now, and more are being launched as the older ones lose users and fade into oblivion. A continuous line from the first boom to the latest bust, and so on and so forth as history repeats itself.

what about the future‥?

Most likely more of the same for a while, until all venues are exhausted and nobody can be bothered with any of it anymore. Nothing new under the sun, despite numerous reports about the opposite.

HTML, CSS, JavaScript and other basics will last for a while, infiltrated as they are in each other, and more so because of the enormous amounts of info already released on them. Alternatives will be introduced though, and over time most of what we have now – tools and languages – will be replaced. Almost strange so many of these primitives have lasted this long.

Hopefully web standards will have enough of a collaborative effect on the world wide web of things, to keep the evolution of the internet more or less on the same tracks for all serious parties involved. No need to outsmart each other to the point of outsmarting ourselves.
We do after all have to play on the same, basic, platforms if we want to communicate with each other, and that won't change all that much in the foreseeable future.

The browser wars back in the mid 1990s onward, demonstrated how out of sync the world wide web can become, and I do not think many front-end coders or end-users want to repeat the experience. As always; we will see where it ends up this time around.

Attempts at predicting the future of the world wide web and the internet as a whole, will nevertheless be nothing but somewhat educated guesswork. Same for me as for all others who make such attempts, just look around…
What I am pretty sure of though, is that big business will keep on trying to exploit us via the world wide web, and that political forces of all shapes and sizes will keep on trying to control us via same. Privacy and personal freedom will continue to be under attack. Too much money and power at stake to leave us alone.

what about right now‥?

Glad all the serious chapters in web design are behind me, and that I can focus entirely on having fun with code while writing what's on my mind. That pretty much covers what I may still be interested in contributing from my tiny corner of the world wide web, until it closes.

As end-user I find the world wide web OK for everyday use, but only because my choices of user-agents, apps and extensions allow me to use it the way I want without being disturbed too much by ads and other uninteresting stuff.
Does not hurt in this context that I don't really trust any of the many players out here, and rely on experience and my own fact-checking rather than statements – legal and otherwise. Trustworthiness is better checked every few posts – regardless of sources, to avoid wasting time on nonsense.

Often it may take a little too long for my patience to confirm or disprove all the more or less serious statements and arguments one find inside or attached to various documents and postings all across the world wide web, but luckily there are shortcuts past and out of the many echo chambers for those of us who do not like to waste too much time on sorting our way through more or less nonsensical word collections. No need to take a stand on everything at the internet.

This word (and code) collection is mine, and wether it is nonsensical or not is for others to decide. What I think about any of the matter, does not matter to anyone but me. Kind of fun to play ignorant in a world of experts…
… or was that another way round‥?