Reflections Front End Web Development – Lesson 8

I finally have arrived at the second project within this course.  This is my second pass, and I think you will agree, as I demonstrate below, that the second version is much improved.  I have taken a few moments to write down my thoughts about web development and this animal card HTML/CSS project to answer the following questions:

  • What new skills have I learned?
  • What has been easy?
  • What has been difficult?
  • How have I used the problem solving strategies from the first project to overcome challenges so far?

Overall, I found this project to be moderately easy (especially given the many provided online resources), and did not encounter any significant difficulties.  I leveraged all of the HTML and CSS material learned from the previous lessons (including linking a stylesheet to my html file), and did some additional research to complete this assignment. New skills learned included setting the background image using CSS according to the template and project rubric provided.

Lesson 8 Project (First Pass):

In my first pass for this project about a month ago, I was quite conservative in my approach, and produced the barebones html/css styled image shown below.  As you can see  the borders are quite thin, with no color; and the image, though majestic, is of an ordinary bald eagle.  It’s not bad, and I am fairly confident it meets all of the rubric’s requirements; but in all honesty it is quite dull.

Udacity Lesson 8 Project: EAGLE

Udacity GWG Lesson 8 Project: Animal Trading Card 1

Link to CodePen.io

Lesson 8 Project (Second Pass):

A few weeks later, on my second pass, feeling more comfortable with my improved html/css syntax skills, I took a more liberal approach. I decided to have a little fun with one of my favorite DC comic’s superhero: Animal Man.

I collect comic books, and one my favorite runs is Grant Morrison’s take on Animal Man.  At the time during the late 1980s, Morrison was part of the British Invasion of comics. His take (with interior art provided by Chas Truog and cover art by Brian Bolland) on this previously minor DC character was innovative in its “advocacy and for its use of themes including social consciousness (with a focus on animal rights), metaphysics, deconstruction of the superhero genre and comic book form, postmodernism, eccentric plot twists, explorations of cosmic spirituality and mysticism, the determination of apparent free will by a higher power, and manipulation of reality including quantum physics, unified field theory, time travel and metafictional technique.”

As you can see below, I formatted the css stylesheet to produce an image with more striking background colors, bolder text, and thicker borders; and applied the Comic Sans MS font:
animalCard

Udacity GWG Lesson 8 Project: Animal Trading Card 2

Link to CodePen.io

Happy Coding and Blogging! And please provide feedback!

Images

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s