Building Blocks for a Website

23 Feb 2023

---

A lifesaver

Why are there so many different components to CSS (Cascading Style Sheets) that are mainly the same but act differently? Creating websites using only HTML and CSS was how I started learning web development and I have only used it for the past two years. These two components aren’t terrible to use if you are just trying to make something simple and easy to use without having much interaction with the website. My entire CSS file is about 100 lines; some of these sections are unnecessary and can produce exactly what I need without these extra CSS properties. The frustration that goes into switching between CSS and the HTML (HyperText Markup Language) files is significantly lower when using a few lines of Bootstrap.

UI framework

UI design (User Interface) refers to creating buttons, visual elements, icons, or something visually appealing to the audience. UI designs focus on color, typography, and layouts which are my favorite part of web programming. Bootstrap takes a different approach to CSS properties by using classes to simplify CSS properties and keeping them relevant to the website. I personally enjoyed the challenge of learning new ways to create a more efficient website, especially with the Bootstrap documentation.

Recreating a website

Below I have recreated a google sites website using a UI framework. This is a demonstration of what I have learned. Given that the website wasn’t perfect, it was a good start in understanding how Bootstrap works and the different frameworks it can produce. Web design is important in our day and age based on the amounts of websites we visit daily. The design, functionality, and features matter and sometimes will deter someone from that website.