Lab 35 Reflection

     Lab 35 was about highlighting certain words in an HTML document by making a div hover under those words, the div moving word from word when the user moved their mouse to a new word. The first thing I did after setting up was set up sample text in HTML, with a few words being wrapped between <a> tags for future reference in my JS. In my CSS, I created styles for the highlight div, even though it didn't exist yet. I added the div to the HTML via appendChild but I didn't give it the style I created for it yet. I created a function that was to be called when the user hovered their mouse over any of the <a> tags, highlightLink(), which added the class I created to this div and used transform and translate properties of CSS to bring the div to where the user's mouse was. I added an event listener to all the <a> tags that called this function when the user hovered over them by using .forEach and .addEventListener to select every <a> and add the event listener.
     These skills are useful for a web designer because they can be emphasize certain elements of importance on a website. In a website, certain things are of more important to the user than other things and using highlights to emphasize them help the user locate them easier. Moving highlights can be implemented to walk the user through steps of a process, like making an account for a website. The highlights can move from section to section or field to field as the user completes the sign up form, helping guide users through the process.