P7: Web Page


  1. Description: A web page that describes the logo design from the logo project.
  2. Process (Programs, Tools, Skills): I started by laying out all the text and images in html. I separated the text into paragraph, heading, list, break, and link tags. I also used the strong tag to bold the list items. After that I added the design elements using an external css style sheet. I changed the text styles on the paragraphs, lists, bolded words,  and headings. For the background I added a margin to center everything and made the background green with a repeating leaf pattern taken from the wing of the hummingbird. I added a transparent background behind all the content and then added individual background colors to make everything more legible.
  3. Message: The message is the design process or thinking behind the hummingbird logo.
  4. Audience: The audience is people who have access to the internet and are interested in learning more about creating a logo. 
  5. Top Thing Learned: I learned to insert a background image that goes in a single line instead of repeating across the entire screen.
  6. Color scheme and color hex(s): The color scheme is big split complementary using indigo (rgba(69,63,153,0.75) was used, but the hex is 453F99), violet (hex 792675), lime (hex A1C43A), and gold (F7B325). 
  7. Title Font Families & Category:  Given fonts: Verdana, Arial, sans-serif with noraml weight. Category: sans-serif
  8. Copy Font Families & Category: Same as title, except weight was not adjusted.
  9. Changes made to the CSS: I added an id and a class to make the backgrounds possible. I customized all of the other categories fonts and colors and took out the rounded edges. I added a background-image.
  10. Word Count: 266

3 thoughts on “P7: Web Page

  1. Leah, your use of asymmetry in this web design is well thought out and plannned. I like how the hummingbird logo is found only on the right side. Its wings are also variants of leafs, which I thought was well played in the background of the webdesign. Also you’re color scheme is well layed out and has a nice natural flow to it. Nice work.

    Check our my blog at https://ijforsyth.wordpress.com/

  2. I love your work! Always a great and well done master piece. I know I was one of the critics, as always. I like it that I am your critic partner, I like seeing your projects from drafts to finals. Like I have mentioned, I like the balance between your logo and background graphic. I can see that you made some adjustments. I noticed you added the orange to the color theme, it is indeed perfect. I thought from just the draft there isn’t anything else to change to make it better, but I guess you really know how to pull out a great final draft. Great job! as always 😉

  3. Hi Leah! I always love your designs. I really like how you have divided the header, logo space and body of your webpage. It looks very well organized. I think the colors green and purple are awesome together because it creates a good contrast. I also thing that is very creative to put an element from your logo in the green background. I like the contrast between the white text with the dark background. I also think that the orange subtitles are clever because it contrast with the logo. Great job! This is mine: https://sofiartcomm130.wordpress.com/

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