Lab 26 Reflection

     Lab 26 was about creating a webpage where images would slide in from either slide of the page when the user scrolled to the section they were in. After setting up some base HTML with sample text and <img>s with a class, I shifted my focus to the CSS and JS. In the CSS, I initially set my images to not display on the webpage and created classes that would be later on added to the images when the user scrolled to its position. In the JS, I created a function, checkSlide, that assessed whether the user was at the right position to slide in the image. It particularly looked at how far above the bottom of the screen and below the top the user was, then sliding the image in when the distance for each was good enough by adding the CSS class needed to do so to the image. I added an event listener to the window through .addEventListener that called my function whenever the user scrolled.
     These skills are important for a web designer because they make a web page more dynamic. Just having images is a nice addition to a webpage but adding animations and effects, like making the image slide in, puts some life into a static site. A boring website may result in the user becoming disinterested and clicking away but having effects such as sliding images keeps the user awake and on the site longer. Overall, it makes a site less boring.