Forem: Zoran Zlokapa

If web was made to be device and screen agnostic — How come it’s not?

Zoran Zlokapa — Wed, 02 Oct 2019 20:24:42 +0000

I just saw this video where Miriam Suzanne talks about how web was built to be device-agnostic and how that’s the reason CSS is built the way it is — with its (in)famous cascade. And I love that web. It’s cool and nice... Until it’s not.

We have clients that want pixel perfect websites (yeah, they’re not extinct); That think the focus outline style is strange and ugly and want it gone; That straight up say stuff like: “Those people are not my target group!”.

We have designers that come up with stuff that can’t even be rendered on screen without burning through the client browser’s resources. And then the client comes and says something like: “It works fine on my latest $5000 laptop.” Or even worse: “Why is this epilepsy attack-causing animation so slow? And make it more flashy!”

How did we get here? What happened?

How did the web that was made so people could share information free of constraint became this heavy and bloated thing that can be used properly only latest and fastest machines with fastest internet connection?

And I know about progressive enhancement, but that means not everyone will be able to see this eye-bleeding monstrosity we’re building and everybody needs to see it, no one can escape! And it takes more time/money to build it.

</sarcasm>

This is something that I’ve been pondering over for some time now and I want to know what other people think and maybe find some answers.

And here’s the video I mentioned at the beginning: Why Is CSS So Weird? - YouTube. It’s awesome, I suggest you watch it.

Comments, go!

And where else do I post this so those clients and/or designers can see it and possibly offer some answers?

Don’t use progress bars in your CV

Zoran Zlokapa — Thu, 09 May 2019 19:07:07 +0000

Sometime ago, I got a chance to be involved in hiring process at my company and one thing I have noticed is that good part of applicants like to use progress bars in their CV’s to show the level of their knowledge.

My only question is how? How do you calculate the percentage of certain skill in the first place? Saying you know 80% of something usually means you know what or where 100% is. That further means you have more than 80% of that knowledge, because you know what you don’t know. Now, I don’t want to start a philosophical debate about circle of knowledge, so I’m gonna keep it short and light.

If you’ve graded your knowledge of HTML to 80% or 4/5 stars, are you really sure there isn’t some part of HTML reference, some trick or whatever, that you missed that can give or take away some of those precious points?

Other thing is that you can’t easily rate something that’s constantly changing and improving. Say you graded your CSS knowledge to 75%. CSS Working Group gave us CSS-Grid few months ago. Is your CSS grade now 50% or 71% or something else?

My advice is just don’t use it, it’s pointless to say the least.

Simplify web development. please!

Zoran Zlokapa — Tue, 07 May 2019 18:50:38 +0000

I published this post on my blog, but figured the beautiful people of dev.to will have something to say about the subject.

When I started building websites back in the ’00, there weren’t any of the fancy tools like transpilers, compilers, bundlers, package and dependency managers we have today. We had pure and simple HTML, CSS and JavaScript on the frontend and PHP and something called ColdFusion on the backend. Oh, and you had FTP for putting websites online.

Even though we created layouts using <table>s — yes, we weren’t even using CSS right — times were simple. I’m not saying they were good, just simple. You would design something in Photoshop (yeah, we weren’t using that right as well), mark it up with HTML, add some styles to those tables with CSS, add some DHTML — that’s what we called JavaScript back then; We were idiots, I know — and put it online over the FTP, it was that simple.

Then years went by, stuff happened and now we have all these tools that allow us to build things with such speed it’s incredible! We even have version control, who would’ve guessed. Now you can have half of your website or application done even before you’ve done with planning the whole thing. All you need to do is install Node… Then npm and Webpack or Gulp. After that you just pull in your dependencies like Express, Lodash, Underscore, Coffee-script, Post-css, Bootstrap, Materials or jQuery — if you’ve been living under a rock for the past 10 years — and you’re ready… to begin writing some actual HTML and CSS.

Only it’s not HTML… Or CSS. You write some kind of JavaScript that generates markup and styles for you, then use one of the googol npm packages to transpile, compile and bundle all of that to HTML, CSS and JavaScript that browser understands and can render on screen. After that, you just run all of that in Vagrant. Or Docker. And deploy it to server using Jenkins. Or Shippable. Or AWS.

If you haven’t skip to the comment section to swear me off, I’m not saying all of these tools are necessarily bad. Hell, I’m working with most of them on a daily basis, c’est la vie. Well, some of them are bad — :cough: Bootstrap :cough:

What I want to say is that we begun using all these tools even when we don’t need them. We’re using them just because they’re cool, new, shiny or whatever and that’s bad. We cram everything without mercy to node_modules, no wonder it’s the heaviest thing in the known universe.

When you start your next project from scratch, actually start it from scratch, zero, nada. Think about requirements for a second. Do you really need that fancy package, or you can make it with vanilla JS? Then add dependencies when and if you need them for the first time and not right away.

Now, I’m not saying dump everything and go vanilla. I understand the value some of those libraries, frameworks and plugins bring. I also know we’ve got a lot of legacy code, tech debt and other reasons for using those packages. I just ask you to think twice before jumping and adding something new to package.json.

Think about progressive enhancement. Can you build the core functionality with basic tools, then enhance it with everything else? Do you really need whole Bootstrap when you’re building simple magazine website that has two different views and you can build it just by using flexbox or css-grid? At the end, think about what you’re building. The easiest or fastest solution isn’t always the best one.

This is something I think about from time to time, I just had to get it out somewhere. Sorry for boring you and thanks for reading.