Class hours: 9:40 – 2:05
Mr. Bohmann
wbohmann@ewsd.org
Today’s Notes
- Today is an EHS A Day
- CCV Class tomorrow – meet in lobby at 9:15am
- nonPerishable Food Drive – Let’s fill the box!
- What the world was searching this year – take a look
9:40 Attendance
9:45 Graph of the Week
Check out this week’s graph of the week. What’s going on in this graph?
Link to Google Classroom Worksheet
10:00 Web Design Trends 2021 – Dark Mode
Yesterday we read a short article on web trends for 2021. The light / dark mode is definitely one of those features I have seen around for awhile. Google even went to dark mode this past year.
Let’s tackle a pretty easy interaction with JavaScript and change a web page Dark Mode with a simple button.
10:35 Mask Break
10:45 Pure CSS Lightbox Build
Lightbox Definition: a lightbox popup is a window overlay that appears on top of a webpage, blocking some of the content on the page. When a popup appears, the background is often dimmed and disabled, meaning that site visitors cannot interact with other content on the website.
Let’s work together and code a custom lightbox. I built an example yesterday afternoon for your reference. To begin, I’d like you to select three of your favorite photos from fall foliage.
If there is time, we’ll tackle another project which will be building an image gallery with a hover effect. An image gallery is a great way for you to display your work. The one we will do together today will be done with only HTML and CSS.
We’ll do additional galleries next week and incorporate some interactivity with JavaScript.
11:45 – 12:15pm Purinton Tree Farm Showcase
Let’s see how you did on your tree farm redesign. Showcase what you have.
12:15 Lunch
12:45 Skinny Lesson
Adding vertical and horizontal lines to your web projects are a good way to organize content and direct attention to certain areas of your page. I use <hr> tags to divide up content in a section. Let’s open CodePen and do a little quick exploration.
1:10 Mask Break
1:20 Production Time and Guided Support
Complete CSS Lightbox – upload to server
Purinton Tree Farm (now due)
Calculator (now due)
If you are all complete with everything – congratulations! Tackle a challenge project or introduce yourself to Bootstrap.