Adventures in Creating a Homepage

Using HTML and CSS

Now I understand what Prof. Linch meant by having an idea of what you are developing before you begin. When building my new homepage, I started putting in code before I really knew what I was doing… and about 30 minutes later, I deleted most of it and started over with a vision! (see below)

screenshot of homepage

A couple challenges I faced that required a Google Search were:

  • How to link certain text within a paragraph and not the entire graph, or having to have the text on a separate line
  • How to download an image from the web and use it, legally cited of course, on my page; then how to display it on my homepage
  • Why my background color displays in Safari but not Chrome (Still unclear, ha! Something to do with fact my HTML file is saved as Chrome and my CSS file is saved Safari? Is that default — I didn’t select that.)
  • Several failed attempts to link my HTML and CSS files 🙁 But alas, some tiny edit made it click! (I think I simply removed a forward dash before style.css!)

My next challenge will be to further the CSS styling on my homepage. I plan to visit a few sites I know I like the look and feel of, and study the source code to see how they have been developed. There was so much to learn about CSS styling in our Codecademy lessons this week — I would like to play around more with opacity, overlapping content, margins, padding, etc…

I appreciated the w3school’s article, “Responsive Web Design – Intro,” especially the images of the expanded desktop, smaller tablet, and compressed mobile display. The article did a good job explaining what responsive design is, how it works and should look, and how to program the tool (though a lot of practice is warranted). Seems like a practice every programmer should utilize this day in age for UX given that mobile is taking over as the top device on which user access the web. Once the article gets into “grid-view” and “media query” I got a bit lost and was wishing I was taking a lesson in Codecademy:) On a related note, I found the alistapart article outdated and hard to follow — give me some images!

Cheers!!

Jane

1 thought on “Adventures in Creating a Homepage

  1. Greg Linch

    “Something to do with fact my HTML file is saved as Chrome and my CSS file is saved Safari?”
    – What do you mean by this? Both files should be created and saved in Sublime. Then you can open the HTML page — with the CSS linked — in any browser.

    “I found the alistapart article outdated and hard to follow — give me some images!”
    – Fair point. Despite its significance in the spread of responsive web design, it might be time to retire that as a reading assignment.

    Reply

Leave a Reply

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.