My thoughts on modern day HTML/CSS approaches and other rants.

HTML/CSS has come a long way in such a short period of time. Since 1996 it has constantly been upgraded, modified, and even repaired, since then we are now in the world of mobile design first. In 2020 the amount of mobile user were an astounding 4.32bn And for the layman, that simply means more people are on their smartphones, tablets and laptops than on traditional desktops devices, so will HTML and CSS stop there? Not at all. I'd like to suggest VR, Projection, and holographic technologies are emerging and will be in our homes eventually. What do they have in common? No boundaries!

How will HTML/CSS join us in this unknown venture into screen less world? Where design is no longer constricted by surrounding containers. Wouldn't that be great!? never having to write:

<body id="wrapper">

<div class="main__container">

     <div class="content__container">

          <div class="child__container">

              <p> What was I writing again</p>

          </div><!-- CHILD CONTAINER -->

    </div><!-- CONTENT CONTAINER -->

   </div><!-- WHICH CONTAINER IS THIS? -->

</body><!-- Kill ME -->

HTML/CSS is the styling the hierarchy of content. I would even argue that it is an art. Understanding where the eye flows, where the hand's mouse movement tends to flow, and the other Fitts Law design principles come into play. CSS is not just a wrestling match with the box model, but an immersive dive in understanding the balance of color vs grid vs easability vs experience.

According to some data, we have that --> link of viewports many dimensions to watch for. We as developers are subject to these tech companies that create new viewports and redefining how we digitally view the world. For example Samsung designed a big phone, It's a tv but built with the mobile user in mind with, both landscape and portrait functions. Why? ...moving right along!

I want to know who is responsible for allowing anyone to design any viewport! W3C, members of A LIST APART and some select others over at 5by5 podcasts were among those that helped guide and direct browser developers to create standards and best practices for web developers and designers. These evolved into mobile first, grid design, the wonderful flexbox and now the marvel of grid containers. IF the great and powerful W3C bless it.

Enter preprocessors, an amazing way to build for scale and a variable based class system. In the least..
nest >
---nest >
------nest some more >
-------------and more nesting of CSS and its pretty neat!

Then you gotta compile it, and figure out where, in the browser dev tools, is your code go back and forth to edit the the dang selectors, re-render and compile and use much computer resources to make the button have a hover color.

"Styling a button is the hardest thing in frontend" ~ Pedro Duarte, Co-developer of Modulz

HTML/CSS Libraries like React JS, Angular JS and other JS's'ss's seen > here build HTML with integrated JavaScript into the site, using components. A data driven world now requires a modular approach to building websites. Yes! We are still creating HTML and CSS files seperatley, Which is great practice, However we are, also, Javascripting our CSS within our components, yes! inline styling is the new #000000 ... smh.

In a recent project, my team and I faced this very dilemma. We inherited an application that had, not one, not two, but 4 methods of CSS styling . Craco with Less CSS, Ant design, stylized components and even inline styling. I felt as if I was bloated whenever we'd run the compiler. The issue was, and always be, lack of documentation and education. The who and why we have allowed these styling methods to happen for this long.

Pro-tip, use one framework for CSS.
Second pro-tip read the documentation.
Third Pro-tip: EDUCATE THE TEAM on how to use the framework.

Avoid frustrated developers who are trying to work on their logic. CSS is the last thing on their mind, and will inline style if there are deadlines, and if documentation is not available.

Fortunately, styling frameworks, which expedite the ease and flow for developers, are starting to emerge. Which can be built upon. One that is starting to gain momentum is RADIX, where developers are now being considered to have a better experience with styling. Which is great! We also have to consider CSS and JavaScript, dealing with runtime and re-renders at the cost of memory and system requirements.

But overall there is nothing like writing static CSS to define your digital idea with good old fashion HTML frameworks and libraries come and go but HTML/CSS is forever!.