My Experiences with CSS

 

Description of the Project

For this project, I created an event using HTML and a CSS3 Box Model.  I was able to use any event, so I chose to create a party invite to watch a Razorback football game together with friends.  The CSS3 Box Model allowed me to create an invitation that had a specific background color, the font I wanted, and the border color and sizing that I needed.

Since I had created a webpage using HTML during a previous assignment, I referred to the other coding I had used and referred back to the videos and readings that Dr. Mears had provided us from LinkedIn Learning and W3 Schools.  

What Obstacles I Encountered

Since I've only used HTML a couple of times, it is still a learning curve for me.  I feel like I struggle with knowing when to leave spaces between characters and when I don't need to. But also, while using CSS, there is also the { symbol to use now and it is on it's own line of code.

The other obstacle I faced was knowing what code to put into the CSS3 Block.  Knowing what font would be readable with the correct background color was important and I had to remember to check the code on a webpage to make sure it looked the way I wanted it to. 

How I Resolved These Obstacles

To refresh my memory about HTML and how to use it, I referred back to the articles, websites, and videos that was provided in the coding with HTML5 assignment.  Although I had used the templates and the practice features, it still hasn't been easy for me yet.

When it came to using the CSS3 Block, I took my time in choosing the colors and font size.  I had to go back a few times to change things so it looked the way I wanted it to.  At one point, the CSS3 Block didn't show up at all, but the text did.  I realized I had left one character of coding out, which caused the whole block and background to not show up.  After fixing this, everything worked correctly. 

What Successes I Experienced

Knowing that the point of using CSS is so I can easily change the font or color for an entire website or document helps me to understand the importance of learning it.  It's awesome when I put the correct html and coding in and see it turn into an actual readable document.  

I feel frustrated at times that this doesn't come easier to me, but it's important that I learn HTML and CSS as an educational technologist.  When I become overwhelmed while using coding, I take a break and come back with a fresh perspective later on.  Then, when I see the finished product, it makes me feel proud and a sense of accomplishment knowing I can do this. 

Comments

Post a Comment

Popular posts from this blog

My Experiences with HTML Coding

Description of the Project This week, I was instructed to design a webpage only using HTML.  While going through the lesson, I learned how to code for headings, paragraphs, images, email addresses, websites, and how to change the color on words or backgrounds.   I was provided courses to help guide my instruction on LinkedIn Learning and guided practice through the W3 Schools site.  The goal is for my classmates and I to be able to understand the basics of coding and using HTML in case we're in a setting where we need to know how to use it.   What Obstacles I Encountered While creating my webpage through HTML, I encountered some obstacles.  The first issue I faced was the fact that I have a limited knowledge of using HTML.  Although I own my own website and blog regularly, I rarely use the HTML features.   Another obstacle I dealt with was knowing what code to type and how much space to leave between lines.  While creating my HTML w...
Read more

Integrating CSS3 Style Sheets with HTML5 Pages

  Description of the Project This week, I worked on creating a resume by using CSS3 Style Sheets and HTML5 Pages.  The past few weeks, I've learned how to do each of these separately, but haven't combined them into one project.   The goal of the assignment was for me to be able to apply what I've learned by using two different styles of coding.  Not only was I instructed to create a resume with different headings, I had to change the color, font, and indentation throughout the document as well. I also added an image to the header of the resume as well.  What Obstacles I Encountered The first obstacle I encountered was trying to figure out how to center an image using the CSS3 Style Sheet.  Normally, I will just choose the "center" option in a Word or Google document, but knowing how to use code to do this took me a bit of time.  I also encountered a problem when trying to change the colors of the h1 and h2 headings.  It seemed that no matter ...
Read more

Lightroom Photo Editing

Image
 I edited a photo using Adobe Lightroom.   The Before or Unedited Photo The After or Edited Photo Light and Color The original photo had the people on the computer screen as the focal point.  Everything around it was blurred out a bit and darker.  I decided to lighten up the entire picture a bit.  So, here are the settings I changed on my picture: Exposure +.65 Contrast -.19 Highlights -.3 Shadows +.26 Whites -.3 Blacks -.3 The biggest struggle I faced was learning the different light setting like exposure, contrast, and whites, for example, and knowing how to best use them.  I decided to choose the auto setting, and then changed things just a bit from the suggestions provided.  It took a bit of practice on my part and playing around with the adjusters while moving them from left to right to get the picture the way I wanted it.  Crop and Rotate I use a lot of photos on Instagram, so I decided to go with the 1x1 option.  After the square ...
Read more