For our first experience with website construction we used HTML and CSS, then later dabbled in semantic UI, a helpful tool in the creation of HTML pages. Using HTML can be a useful tool, but for the most part I found it fairly rudimentary and clunky on it’s own. Using HTML to its full potential really only happens when you add other resources to it, such as CSS and semantic UI. Once you add those to the equation you can start making presentable websites that look like the ones you might visit regularly.
Our first UI framework tool, semantic UI, was a tool that I found very helpful. The tool adds a lot of features separate from base HTML, such as buttons, icons, and menu bars. Most of these features were fairly simple to use, to add an icon you would simply add a div class to your code with the icon you wish to use, and because of the resources semantic UI has available, often adding an icon would be as simple as typing “facebook” in the div class, and then you would have your icon presented on your page. Going further you can even customize each class property in CSS, if you wanted to you could have seperate classes for all your icons, each having different properties, such as size, color, padding, etc., this can end up being a lot of code sometimes, but having those options make semantic UI very user friendly and make it feel that I can make whatever website I’m creating look how I wanted it to look.
A lot of what adds to semantic UI’s usefulness is the large amount of formats pre-made for you that you can find on their website. Finding a menu bar was as simple as googling “semantic UI menu” and then picking one and copying the pre-made code. Using it as is can be a helpful start, but once you start customizing and playing with the options in the classes you find the flexibility of the framework. Semantic UI lends itself to a lot of common sense troubleshooting, in that usually when there is a formatting issue, I can go to the first thing that pops into my head, try to change the class with what I think could fix it, and most times that would solve all my problems. An example of this is that if something is not aligned where I want in my page, I can usually just put in “center aligned” in the div class and it fixes it. Or if I want a text a different color than another, I can just make a new text class for it and change that specific text’s color.
Overall, I think semantic UI is a very helpful and easy tool to learn. It made my experience with designing pages much easier. One of the things I look forward to learning more about in regard to UI frameworks is the implementation of Javascript. In semantic UI, we learned how to add script to our pages for dropdown menus and I am interested in learning what other options there are.