The difference between knowing and understanding

Contents

Introduction

I came across a commit recently that perfectly demonstrates the huge gulf that can exist between knowing there is a way to do something and truly understanding the reasons behind it.

Anyone who has tried their hand at web development has probably gone through the stages of learning about HTML and how the different elements are rendered on the page and then discovers CSS and how they can be styled to look like the beautiful sites we all know and love … or not. Usually not by a long way, especially when you’re starting out.

At this stage we’re normally producing a convoluted mess of unmaintainable styles applied to every element as needed. If we want a <div> to have a red border then we add style="border: 1px solid #ff0000" to it. Eventually we stumble across a blog post or tutorial that explains that this is a bad thing and that we should really be using CSS classes instead to apply styling.

At this point, some people will endeavor to understand the reason why and not just blindly follow it as a rule. Some will blindly follow it, never understanding why but imagining that they are making progress.

What effect does this have?

If we understand the reason for the rule then we see the intent behind it and recognize the benefit in having sementic classes based on what something actually is and not just how we want it to look right this minute. We see that telling the page that the <div> is a login widget or whatever is more valuable because while we may want it to have a red border now, we can change the styling that we associate with the class later or in future and the page itself doesn’t need to change.

So what happens if we blindly follow a rule that we don’t really understand? Well … this!

.margin-auto-auto
{
    margin: auto auto;
}
.strong
{
    font-weight: bold;
}
.black
{
    color: #000;
}
.italic
{
    font-style: italic;
}

I’m sure you see the issue and I won’t repeat it all. The actual code has all the classics, like a .green-button class that at some point had the style changed to blue. Also, sadly, it’s not the work of a server-side developer getting their HTML/CSS feet wet but someone employed as a “front end web developer”.

So yes, technically we’re using CSS classes just like we heard we’re supposed to. But we’re not really using CSS classes because we didn’t bother to understand the reason behind it.

Without understanding the reason, we don’t get the true benefits and we’re just an automaton blindly following a rule.