Tony and Josh taught the second of five web development classes today. This time we covered Cascading Style Sheets or CSS. We went over the very basics using the w3schools.com CSS tutorial. We started the class off making sure everyone that wanted to install Brackets on their machine had it installed correctly. Using the live preview was the main feature behind choosing Brackets but we let everyone know they could use any text editor they wanted – but showed the auto-complete and other time savers you get with Brackets.
Some of the students showed us another website called CSS Zen Garden that shows how powerful CSS can be. In every example they use the exact same HTML file with the exact same content, but they use different CSS styles that make it look completely different in massive ways.
We also showed off a website called CSS Bricks that lists lots of neat examples of some of the really neat things you can do with CSS animations and transformations that look like it was done with graphic design applications or javascript. This site REALLY shows you how crazy and complicated you can go with CSS.
After touching on the subject of layout and alignment we introduced the class to Bootstrap. We explained how this CSS + Javascript library that you can download or directly link to in your web sites for free makes it extremely easy to make your website or web application “responsive” so that it automatically changes its layout and menu / links as the browser/window size changes. This makes it terribly easy to create a single web site that looks great on monitors, tablets, and mobile phones.
Next Saturday’s class will be all about Javascript and how we can start writing code to run right in the web browser to make it react to user input and seem more like a web application.
Here’s a few photos taken from the class today:
Don’t forget to sign up for our other web programming classes to further delve into the world of programming for the internet.