Project 2 - Full Website with Unique Home Page Layout

---

Project due Wednesday, October 4th

---

Develop a website on your favortie artist using HTML and external CSS elements Your website design will have a unique home pay layout and your inner pages a simpilie Left and Right column layout an no banner image.

.

Create an entire web site (5 pages minimum) dedicated to a artist that inspires you. Your web site should demonstrate good awareness of design theory and demonstrate technical understanding of the html and css design & control.

Research the artist of your choice and create a compelling presentation that would engage viewers with the layout, images, and text. You may copy Wikipedia text and copyright-free images from Wikicommons or Googles advanced serach, but you may not use text or images that you do not have written permission to use.

Required:

1. External CSS file
2. Use both IDs (for unique page elements), and Classes (for styles that repeat multiple times on each page)
3. Once consistant 1024px design setup.
4. Consistant navigation between the pages and a "home" link on every page
5. A logo/banner/header using Photoshop or Illustrator and saving for web
6. Internal site links that are formatted using css
7. At least one Un-ordered List (or Ordered List) in the content div
8. Background image - There will be no class demonstration on this. You should research online how to use backgrounds on a web page on your own

---

External CSS

An external style sheet is a separate file (a2/css/styles.css) where you will declare all the styles and design that you want to use on your website. You then link to the external style sheet from all your HTML pages just below the <title> </title> tag.

<link href="styles.css" rel="stylesheet" type="text/css">

---

Buttons

------------ CSS --------------- button .btn1 { background-color: #1f5eed; /* Green */ border: 2px solid #000; color: #fff !important; padding: 8px 10px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; margin: 1px 2px; } .btn2 { background-color: #008CBA; /* Blue */ border: 1px solid #000; color: #fff !important; padding: 8px 10px; text-align: center; text-decoration: none; display: inline-block; font-size: 20px; margin: 5px 2px; } ---------- HTML --------------- <button class="btn1">Green</button> or <a class="btn1" href="#">Blue</a> <button class="btn2">Green</button> or <a class="btn2" href="#">Blue</a> </body>

You can use W3Schools Try It tool by using the buttongs below:

Try It

Try It