Whilst scrolling through my favorite websites, I never stopped to wonder how they were created. I knew HTML and CSS were the basis of the website, but when I thought about these languages what came to mind was a dinosaur-type of website with basic fonts, content, and none of the modernization that I see in today’s sites. Then I was introduced to Semantics UI and everything changed. I have never designed a website before (aside from using websites that create website templates for you) and I have always thought of it to be a much more complicated process than I realized it actually is. With the use of the Semantics UI framework, Chrome inspector, and other tools I was surprised how easily I was able to recreate the design of some of my favorite websites.
As someone who has always been interested in design and aesthetics, learning HTML and CSS was very important and interesting to me. However, when I learned about Semantics UI, I fell in love. The easy customization, modern fonts, and intuitive syntax made me excited to use it, and on top of that the documentation was extremely helpful. It provided little tidbits of code that I could copy and paste into my files and alter however I needed to. Once I had implemented the code once, I could refer back to my old files and re-use it as needed. For example, when working on a Tori Richards website look-alike, I felt a pang of panic when I realized that I needed to implement a footer and I could not remember how to do so. Semantics UI is quite intuitive for the most part, but it is easy to get confused between certain classes and items. However, I could see that the footer on the Tori Richards website looked very similar to another website’s footer that I had created for my class, so I went back to that project and just copy and pasted the footer into my Tori-Richards site and customized it. This took a total of four minutes, and saved me so much time and confusion.
I think my favorite part of Semantics UI is that I can visually see and remember certain aspects of websites that I would like to implement in a current project that I am working on. Of course, this is possible with raw HTML and CSS as well, but I feel that Semantics UI makes it much more obvious what containers refer to what areas of the site. And it just looks so much better! I have always been more of a visual learner, and so this was an extremely useful aspect for me. Being able to implement a wide variety of elements with ease is something that really drew me to Semantics UI. I have no idea how to create a dropdown menu in raw HTML and CSS, and I believe it would take much more effort to do as opposed to using Semantics UI or another framework to achieve the same goal. Not only can we create almost any element we want to, but the additional use of buttons and icons ties the page together in a modern and polished way. The customization aspect is very impressive as well, for example being able to create an “inverted button” or whatever color we would like is something that we may not think that we would like to do, but definitely comes in handy when trying to create a beautiful website.
Although Semantics UI is my first experience with using a framework, I look forward to learning more frameworks and evaluating their advantages and disadvantages. However, one thing I know for sure: using a framework definitely beats using raw HTML and CSS. The potential for customization and the ease of use of Semantics UI made me realize that it is something I will continue to use in the future when designing websites (until I find a framework I like better).