Now that you understand the basics of how HTML and CSS work together to position and style web content, it's time to enter the big leagues. Developing an eye for beautiful web design takes a lot of practice and some level of natural ability. This is not a course on design. So we will not teach you how to make a "beautiful" website (especially not in the 3-4 class days). Rather, we'll teach you how to steal (only the free stuff) someone else's beautiful website design and implement it yourself.
Bootstrap (getboostrap.com ) is quickly becoming the go-to framework used to create websites that can automatically adjust to various screen sizes (this is called "responsive design"). Although you don't realize it yet, you have learned the basics behind how bootstrap was created. So what exactly is Bootstrap? It's just a standard set of custom CSS styles that look nice. Oh yeah, and remember how we changed styles based on the state of the client (e.g., whether or not the user was hovering over the link)? You can also change styles depending on the screen size of the user. This allows you to write CSS that looks nice, both on mobile devices and computers.
We are not going to teach you how to write your own Bootstrap styles. Rather, we're going to show you how to download and modify a website template that is already using one of the standard Bootstrap themes. Follow along with the video below:
Don't like every single style used in your bootstrap theme? You can make your own styles that will overwrite the bootstrap them. Here is a video showing how to do that.
Adding Live Tableau Dashboards to a Web Page
As we said above, the web is the best way to get your data analyses out there quickly to a broad audience. Tableau Public makes this very easy. For the video below, you will need a Tableau Public account which is different and separate from the Tableau account you made previously to download the desktop software. Follow along with the video below: