At home, my family speaks a few different languages. My parents were born in Vietnam but my grandparents are from China so we speak English, Vietnamese, and Chinese. Although I can understand Vietnamese and Chinese almost fluently, I have a really hard time speaking conversationally. I can reply to short questions, but if I had to express my thoughts on current events, I’d stumble all over my words. I can fully imagine what I want to say and I’d know most of the vocabulary I’d want to use, but I’ll get stuck on something like the syntax. This is exactly what coding feels like. I’ll have these grand ideas of what I want my user interface to look like. I want a fixed borderless menu at the top, with the company logo on the left and the social media icons on the right. Maybe a grid in the middle with some images and links, and a footer where users can input their email address. I have the knowledge of HTML and CSS to make these from scratch as well with some time. However, implementing these ideas would just take way too long with raw HTML and CSS.
You know in those fantasy books how there’s wizards who can cast spells to speak any language in the world? Or maybe there’s a magical tool that you can speak into and it outputs whatever language you want? Although things like that don’t exist in real life, Semantic UI is pretty darn magical. Semantic UI advertises itself as “a development framework that helps create beautiful, responsive layouts using human-friendly HTML”. Like it’s name, Semantic UI focuses on mimicking human language with it’s syntax. In practice this means if I want to create my fixed borderless menu, I can do this by simply typing.
<div class=”ui fixed borderless menu”>
<i class="ui right facebook icon item"></i>
<i class="ui instagram icon item"></i>
</div>
I don’t even have to tell you what the extra lines I added do, because the language tells the whole story. With Semantic UI, I have magically become fluent in the language of HTML and CSS. I can type in coherent english and magically the computer understands what I want. Now, Semantic UI needs to implement this for real life so I can be fluent in any human language as well.