It’s no secret that internet design evolves at a fast tempo. Not solely do the traits change, however so do the instruments and applied sciences we use. We’re continually beneath stress to maintain up.
That’s why I discover my workflow a bit ironic. Sure, I understand change is part of the occupation. And but I have a tendency to stay with a well-known strategy to every problem.
Nowhere is that this extra obvious than in relation to utilizing CSS. It looks like each few years, some revolutionary new function will get loads of consideration. And whereas I discover it fascinating, I’m often not an early adopter.
Maybe there’s no hurt – supplied the methods I exploit work as meant. However inevitably, a undertaking comes alongside that pushes my current data to the bounds. And it’s often then, after a interval of frustration, that I lastly dig in and be taught one thing new.
For those who’ve ever discovered your self in an identical scenario, this text is for you. Collectively, we’ll have a look at why it’s necessary to maintain up with the newest CSS methods. And even when your present options work adequately, there are nonetheless causes to put money into studying.
New Options Are Usually Simpler to Keep
Utilizing older CSS options to create a posh format historically has meant resorting to hacks. That’s not all the time a foul factor, as it may be a good way to be taught the interior workings of the language.
The draw back is that cobbling collectively a format utilizing CSS floats and clearfixes is neither steady nor elegant. There aren’t any ensures that these methods will maintain up over time. In case your content material wants change, for instance, you may discover that the format merely breaks.
It’s value noting that floats and clearfixes happened at a time when CSS didn’t have a easy technique for creating multicolumn layouts. Again then, these have been among the many few acceptable options.
Nonetheless, the additions of each Flexbox and CSS Grid have been game-changers. They’re designed particularly for a lot of these layouts and have some extent of responsiveness in-built. As well as, they sometimes require much less code than these old-school hacks.
Taken collectively, this could lead to code that’s a lot simpler to keep up over the long run.
Use of Legacy Browsers Is Plummeting
Among the many major causes not to undertake fashionable CSS has been spotty assist in legacy browsers. For those who wanted to cater to these utilizing the likes of Web Explorer or outdated variations of Safari, you’d be forgiven for not leaping on the newest options.
Fallback options have been doable, however they could even be a hack in their very own proper. They have been additionally another piece of code to keep up.
This wasn’t an enormous downside for visible results like border-radius, the place the browser simply ignores what it doesn’t perceive. However approximating newfangled layouts in outdated browsers might be very difficult. It usually saved me from desirous to implement a function comparable to CSS Grid.
However utilization for these technological fossils has change into minuscule. Web Explorer has been (partially) retired by Microsoft and is in use by lower than half a % of customers. Comparable numbers have been reported for legacy variations of Safari as nicely.
That’s to not say providing a strong fallback isn’t useful. However the knowledge exhibits that we not want to carry again on implementing new options, both.
Extra CSS Information = Extra Versatility
Then there’s the outdated downside of attempting to suit a sq. peg right into a spherical gap. There are quite a few type and format challenges on the market, they usually all require distinctive options.
CSS is a part of what strikes the net ahead. That’s mirrored in what we see day-after-day. As well as, our purchasers have additionally picked up on these shifts in presentation. They now count on us to ship that very same degree of high quality.
Attaining fashionable design with old-school CSS isn’t very environment friendly. Not when there are new approaches that streamline the method. By clinging to the previous, we’re making extra work for ourselves in the long term. It could additionally restrict our progress potential.
Thus, it stands to cause that the extra instruments we have now in our toolbox, the extra versatile designers we change into. This frees us to experiment and transcend the identical outdated appears to be like.
In time, this may profit each our portfolios and purchasers. What’s to not like?
Broaden Your CSS Superpowers
To be clear, we don’t have to make use of each new CSS function instantly after it’s launched. There may be all the time a lag in browser assist. And a few gadgets might not be related to our area of interest.
Nonetheless, it’s value keeping track of new developments and changing into aware of how they work. It’s one thing that may keep behind your thoughts. Once you want it, you’ll have a useful level of reference.
It may also prevent from the frustration that comes from utilizing older methods to resolve fashionable challenges. That is one thing I proceed to wrestle with. Hopefully, this text supplies the required motivation for all of us!
