Stepping up your game with UI Frameworks

10 Oct 2019

Website design is IMPORTANT.

If you’ve just acquired new HTML/CSS skills, you may be wondering, “what’s next”? Sure, you can create a website using the default elements that HTML offers with some basic CSS, but will it really attract viewers to your site? The process of building an attractive website is far more complex than simply using raw HTML/CSS. According to a codeburst article, “the act of establishing your online presence does not simply end by just creating a basic website for your business and/or company”. Though HTML/CSS itself can be relatively straightforward to learn, there are so many factors that come into play when building a website - such as responsive design - that can be very difficult to manage when you are getting your feet wet in Front-End Development.

UI Frameworks

This is where UI Frameworks, such as Semantic UI, can save a lot of your time. With components such as Dropdowns, Menus, and much more, it provides a good foundation for a functioning and modern-looking website.

My experience with Semantic UI has been positive since the beginning. The use of “English-friendly” class names are intuitive, and the documentation is simple. You can usually find any element you want in under a minute thanks to the site’s organized and straightforward layout. In the past, I have tried other frameworks such as Twitter Bootstrap. Some users may prefer Bootstrap over Semantic due to it’s “responsive design philosophy” and simplicity (less focus on JavaScript than Semantic). However, Semantic UI remains as my favorite choice since it uses more “english-friendly” class names, and has a more modern look.

These frameworks are much like an IDE or tools like ESLint that we’ve used before - they are the icing on the cake. While these items are not necessary for building a program, they significantly enhance the experience of programming. Similarly, UI frameworks can help transmogrify1 an ancient-looking website into a modern one. As mentioned in the beginning, website design plays a crucial role in representing the brand or item that the website is built for. It is a fact that “the design of your website can either make or break the business you are trying to deliver” (1), and the first image highlights the role it plays in the credibility of your brand with some statistics.

While most readers may not judge a book by it's cover, the same does not apply for websites. Your website is the first impression of your business to users of the worldwide web.

Is the struggle worth the end result?

While using frameworks does take some practice, especially when it comes to initializing elements like Dropdowns using JavaScript, it is definitely worth the initial learning curve. The idea is similar to programming, where learning a new language after the initial one generally becomes easier. Though it can be discouraging at first, it sure will pay off in the long run! It’s much better than having a cringe-worthy website 😉.


1Thank you Dr. Johnson for teaching me this awesome word.