Skip to content

Homepage (index.html)

Screen Resolution

Depending on your screen resolution, zoom setting, and monitor size you will see the line breaks appear at different locations. This is ok and expected!

sample output

Page Requirements

  • File must be named index.html

  • The title displayed in the browser tab must be Crown Coffee

  • You must use the <header> element.

  • The image, crownCoffeeLogo.png, appears at the top.

  • The main heading reads, “The King of Fresh Coffee”

  • Use an HTML character entity for a registered trademark symbol at the end of “The King of Fresh Coffee”

  • You must use the <nav> element.
  • The navigation is contained in the page header.
  • The following six links appear in the navigation.
    • Home > index.html
    • Our Coffee > coffee.html
    • Coffee Guide > coffeeGuide.html
    • Menu > menu.html
    • Club > club.html
    • Contact > contact.html
  • A bullet point character is used to separate each link. Do not use a HTML list to accomplish this! Look at character entities.

Main

  • Place the coffeeMugs.jpg image.
  • Create three <article> elements. Each article will contain a heading and a paragraph. See below for the text for each article.

Article #1

Heading: About Us

Paragraph: Crown Coffee is a local coffee house and staple in the Madison community. High-quality roasts and an atmosphere that welcomes friends, neighbors, newcomers, and visitors alike. Every guest is sure to find their favorite drink and roast while enjoying great company among new friends.

Article #2

Heading: Unique Setting

Paragraph: Nestled in downtown Madison, the 100-year-old home that has become the Crown Coffee is equal parts charm and funk. Every day of the week, people find their favorite spot to meet a friend, write a paper, read a book, hold a meeting, plan an event, host a party, or just hang out! Crown Coffee has a vibrant, welcoming atmosphere offering the best in espresso drinks, food, and atmosphere.

Article #3

Heading: Coffee and Eats

Paragraph: Locally roasted organic fair-trade beans are the foundation for every espresso and coffee-inspired drink served! Our highly qualified baristas are trained to prepare a variety of espresso inspired treats...from a classic latte to a caramel coffee smoothie, the options are as delicious as they are endless. Rounding out the menu are Panini sandwiches, fruit smoothies, teas, specialty soups of the day, pizzas, and more.

Aside

  • An <aside> element is contained within the <main> element.
  • A heading element contains the text, "Crown Coffee Values".
  • Four paragraphs follow the heading element and contain the below text. The text before each colon must appear in bold text.

Paragraph #1

Our Coffee: Roasting coffee to its highest potential, putting quality and customer satisfaction first.

Paragraph #2

Our People: Providing a livelihood and a fulfilling working life for our employees.

Paragraph #3

Our Farmers: Paying high premiums and giving back to social programs.

Paragraph #4

Our Planet: Using biodegradable and earth-friendly choices in every possible way.

  • You must use the <footer> element for this section.
  • A link with the text, “Hours and Locations”, goes to the contact.html webpage.
  • An <address> element that contains a mailto link. The mailto link reads, “Developed by:” and your Madison College email address.