Framework to Decrease The Time Frame of Work

04 Oct 2018

What is Semantic UI?

After a week of working with HTML and CSS to create simple websites, I was introduced to Semantic UI. Semantic UI is a development framework for websites. It consists of many different classes, which contain elements, collections, and more. Each class has many different types and features. For example, “ui image” can be modified by simply adding fluid or large in front of image. Semantic UI is almost another “language” altogether, hence the “semantic” in its name.

Why use Semantic UI?

Semantic UI is in no terms “simple” to learn. It is similar to learning a new language, especially after learning HTML and CSS for the first time. Its concept is comparable to Underscore. When working with JavaScript, I do not need to manually create functions when using Underscore. It has functions “prewritten” for me. The same goes for Semantic UI. It shortens down the time needed to format and think about how it looks. For example, some (classes) have default margins, paddings, and borders already set up. If you choose to keep it, it cuts down on the CSS you need to manually create and assign.

Learning to use Semantic UI

When I was introduced to Underscore, I was pleasantly surprised how it can drastically shorten my code. However, Underscore contains many different functions. Practice may be necessary in order to figure out how to use a certain Underscore function properly. It may be tedious to figure out which function to use and how it works, but when an understanding of the functions is achieved, it will greatly decrease the amount of time needed to create functioning code. The same goes for Semantic UI. There are many different classes and variations to learn, but it will cut down on the manual “labor” needed while creating a website. Editing could be as simple as adding “large” or “three” to the class name.

After learning how to use Semantic UI, it is clear that raw HTML and CSS takes much longer, since everything is done manually. Like Underscore, Semantic UI may be tedious to learn and understand at first, but the payout will greatly reduce the amount of typing.

My Experience

I personally love using Semantic UI. I may have trouble reverting back to using raw HTML and CSS now. The names of the classes are easily understood, since the language is close to normal spoken English. Sometimes, I can simply guess the class “vocabulary” depending on what I want, and it is likely to work. For example, if I want the default grey button to be black, I can add black in front of button and the button will change to black. The ease of use and lack of CSS makes website design much more enjoyable to me. I look forward to using Semantic UI more and learning other UI frameworks.