Having a Kid Named Semantic UI

Imagine you just had a new born baby.

As you hold her in your arms, you cannot help but ponder what makes her so precious. You look at her beautiful, glittering eyes and realize that they not only provide you that feeling of warmth and comfort, but they also give you a sense of hope—a mysterious hope that this baby will turn the vapid to creative, the ordinary to something special. As parent, you will do everything in your power to nurture this baby and lead her to a bright and exciting future. You name this child, Semantic UI.

Raising Semantic is not as easy as you thought.

As Semantic grows up, you learn more about her characteristics; you categorize them as Elements, Collections, Views, and Behaviors. Within these categories are subcategories such as container, image, grid, menu, etc. which are also filled with even more subcategories like types, groups. variations, etc. Little did you know that Semantic possessed so many qualities—so many that it will definitely take some time and dedication to remember them all. Nevertheless, these said qualities could potentially erase your boredom and liven up your world because after all, who does not want live a life with a responsive framework. Therefore, you are motivated enough to know more about each of Semantic’s trait, as every parent should do.

Managing a teenage Semantic is tough.

After some time, Semantic has become more responsive. You now have the confidence to order around a teenage girl to do your errands. You tell her to show you a borderless menu, and she gives you a white blank menu. You tell her to show you an image item on the menu and she will do exactly as you ask.

<div class="ui borderless menu>
  <img class="ui image item" scr="https://www.mcdonalds.com/content/dam/usa/logo/m_logo.png">
</div>

For a while, everything seems so much easier when you have someone to do work for you—until you experience her rebellious side. They say teenagers are prone to rebelling against their parents; Semantic just proves that notion. Sometimes, when you tell her to set an image to medium size, she will only set the width and not the height.

<div class="ui grid>
  <div class="centered row">
    <img class="ui medium image" scr="https://www.mcdonalds.com/content/dam/usa/logo/m_logo.png">
  </div>
</div>

You would have to readjust the height yourself. She would also occasionally try to annoy you like the time you wanted to center an image and paragraph in their respective columns, but instead, she put them in the center of the page as if there were no columns at all. Anyhow, she has the tendencies to completely ignore your orders or somehow do the exact opposite.

Perhaps she only wants to be understood on a deeper level.

Semantic most likely commits all these rebellious actions in order to show your lack of understanding as a parent. You may know most of her traits, but you barely understand their purpose and how they work. It is never enough to know what your child is doing; you need to know how your child is doing. This deeper understanding will take some time however, but the results will surely outweigh the struggles.

Back to reality,

Semantic UI, as a framework, could be compared to a spoiled child in which if the user is inexperienced, it will disobey your intentions (or act in a different way). Hence, such UI requires practice and experiments to fully grasp how each of its numerous properties work. If one succeeds in doing so, then only your creativity can possibly hold you back.