Navigating the Cyber Either

Breakthroughs in the matrix and leveling up

A month ago HTML, CSS, Wireframe, and Javascript would’ve been cryptic words and acronyms that I couldn’t tell you about; however, two classes and a few panic attacks later… the growth I feel is almost tangible. From wireframing a website with specific parameters to uploading said website via Gitbash, week one of class has been foreshadowing of what will be my continuing journey into web development.

Perspective: 1UP

“Not all those who wander are lost; the old that is strong does not wither. Deep roots are not reached by the frost”-Tolken

I know you’re probably thinking how is a quote from the guy that wrote The “Lord of the Rings” applicable to coding, but I assure you it is. Let me explain. I titled this post Navigating the Cyber Either because that is the absolute truth. We are tasked to explore a vast and seemingly endless sea of information on the internet. It can be overwhelming entering a question in a search engine and finding hundreds of pages filled with vlogs, blogs, books, and videos, but not all that wander are lost. In fact, we wander with an end goal. I had to wander through six different videos, from six different people, for hours to understand why my background images were only showing up in my localhost, as opposed to my live and online websites.

Wandering through the web can be scary and exhausting, but you are not alone. Our job is to collectively wander with intent.

Once I did my research I tried the six different methods to see why my image path was broken, and found the one that worked for me. So what did I do after that? I deleted the fixed path and reconfigured it multiple times until it felt rudimentary. Practice practice and I cannot stress this enough, practice until it feels as easy as 1–2–3 and then practice again the next day for good measure. Practice until it feels old because “… the old that is strong does not wither”.

CSS: 1UP

Now for something more specific! This week we were introduced to pseudo-classes and how we will use them to inform our websites. Pseudo-class is used to grab a specific class that we will use pseudo-elements to manipulate the parent element… Wut? I know, but let me explain it a little better. Let’s say you included a button element in your HTML, but you wanted to change the color or function of said button. Well, we can go to our CSS page and type “Button:” and with this pseudo-class we have now isolated the button in order to provide a new function. Now let’s say I want my button to be a specific color when I hover over it. From here we can do something like

Button: hover

“Button” is now our child class or pseudo-class. Our software recognizes that we are making changes to the button and the button specifically. This is where we use pseudo-elements like “hover” to change what the button does when we hover

Button:hover{

background-color:#4d4d4d;

}

What did I just ask CSS to do? I isolated the button with my pseudo-class and used a pseudo-element to change the color of the button to a specific grey when my cursor hovers over it.

Pretty neat, huh?