You’ve Got to Have Style
- Describe one thing you learned in class today.
Today’s class focused on utilizing Flexbox in CSS, revisiting Git and GitHub, and the process of working collaboratively with up-and-coming developers. The more I delve into the process of web development, I can’t help but appreciate being a part of a great group of people. Our group is engaged, and while we’ve only just started working together, it’s proof that open communication and a willingness to take risks are crucial towards reaching success. The importance of asking why a page reacts to flexbox, or how can we place text over an image, while allowing the page to adjust to different screen sizes are all questions to be discussed throughout the creative process. Ultimately, I’ve learned that there are different ways to approach a challenge, but never stop digging and remain persistent in discovering solutions. This will always lead to quality work.
2. Describe your choice of 2 pseudo-selectors and discuss what they are used for.
Once you can gain the concept of parent-child relationships in terms of development, it makes it easier to grasp how to create the “family” in CSS. The parents rule. They can assign styles to all of their children, but can also add or change styles for one child. By using the “:first-child” pseudo-selector, the first child will always be targeted without having to worry about incorporating new content, and managing lengthy amounts of code.
The second pseudo-selector which adds quite a punch to style is “:hover.” This tool can play a role in accessibility by showing additional information when the cursor is placed over a graphic or create stylish buttons to enhance personality and provide that extra oomph on a website. It’s the delicious icing that goes beyond just aesthetic effect.
3. What are some of the “gotchas” for writing efficient CSS?
The first “gotcha” for efficient CSS (and any code for that matter) is paying attention to detail. Everything in code serves a function. Everything. The addition of a character or absence of one can cause a student developer to scour through videos, textbook passages, blog entries, and more videos for hours. (Ahem, maybe I’m speaking from experience here.) But once you find that the error is because of a missing ./ in front of your styles.css link, you know better for the next go-round.
The second is adapting the DRY (Don’t Repeat Yourself) principle into my work. Going into creating my own sites and projects, with the concept in mind that in reality web developers are adding code to work that could have been created months or years ago, helps me focus on the bigger picture. Efficient CSS means focusing on the design from the perspective of function. It has to do something for the project and fit into the bigger picture.
A final “gotcha” is the naming of code. Incorporating names to IDs and rules helps provide clean code and clear communication with other developers, including yourself. It allows you to follow the thought behind the code, ensuring that it's functional throughout the entire project.
These gotchas are just a few that strike a chord with me and are recommended by Cem Eygi in this article.
Here’s to the journey and the creative process.
