Details

Use your work from Lab 1 and Lab 2 to create a working template for a complete NBA website. You do not have to create all 480+ pages. But, you will create and organize 2 team pages and 4 player pages.

Your website will include the following files, which should all be placed in a folder called nba. Read the descriptions below carefully because they describe details about which files must be created, where they should be located in the folder hierarchy, and how they must be linked.

Your files must be in the correct subfolders described below. 6 points

1. index.html - Home page that includes the content outline from Lab 1 and links to all the NBA teams organized into list or tables.
   • Encapsulate all the page content into an article with the id = "nba". 2 points
   • Add sections for the two conferences (east and west) with the id = "eastern" and id = "western". 2 points
   • Inside the conference sections, add nested sections for the six divisions with the class = "nba_divisions". 4 points
   • Add an image to the top of the page (NBA logo or basketball icon-type picture) right below the h1, h2, etc. . 4 points
   • You only have to create two team pages (New York Knicks and Miami Heat). But you should create links to all the teams from the Atlantic Division. The links to the teams should follow the naming convention city_teamname.html but you do not have to create these the pages. Thus the other links will return "file not found" errors, which is OK. 4 points
2. east/atlantic/ny_knicks/index.html - Team page for the New York Knicks that includes the content and structure from Lab 2.
   • You do not have to update the page content. But, the roster should include links to at least 5 player pages including Carmelo Anthony and Tyson Chandler The links should follow the naming convention lastname_firstname.html. You only needs to create two player pages for the Knicks (Carmelo Anthony and Tyson Chandler). The other links will produce a "file not found" error until they are created. 4 points
   • This page should include an image for top of the page (Knicks logo or team picture) right below the h1, h2, etc. 4 points
3. east/atlantic/ny_knicks/anthony_carmelo.html - Player page for Carmelo Anthony that includes the content and structure from Lab 2. You do not have to update the page content. But, it should reflect the completed page from Lab 2. 4 points
4. east/atlantic/ny_knicks/chandler_tyson.html - Player page for Tyson Chandler that follows the exact structure from Lab 2.
   • Use the WWW to find content for this player. The content does not have to be up-to-date or perfectly correct; but it should look complete and reasonable. 4 points
   • Be sure to find and properly embed an image of this player. 4 points
5. east/southeast/miami_heat/index.html - Team page for the Miami Heat that follows the exact structure from Lab 2.
   • This page should have exactly the same HTML structure as the Knicks page but it should have different content. Use the WWW to find content for the team. The content does not have to be up-to-date or perfectly correct; but it should look complete and reasonable. 8 points
   • The roster should include links to at least 5 player pages including Lebron James and Chris Bosh. The links should follow the naming convention lastname_firstname.html. You only needs to create two player pages for the Heat (Lebron James and Chris Bosh). The other links will produce a "file not found" error until they are created. 4 points
   • This page should include an image for top of the page (Heat logo or team picture) right below the h1, h2, etc. 4 points
   • Use embedded CSS to give the header and footer the Heat's colors (use black and red, or dark red and yellow). 2 points
   • Use inline CSS to add text color to the team in the next_game section as we did in lab. For example, if the Heat's next game is against the Cleveland Cavaliers use dark red or maroon. 2 points
6. east/southeast/miami_heat/james_lebron.html - Player page for Lebron James that follows the exact structure from Lab 2.
   • Use the WWW to find content for this player. The content does not have to be up-to-date or perfectly correct; but it should look complete and reasonable. 4 points
   • Be sure to find and properly embed an image of this player. 4 points
7. east/southeast/miami_heat/bosh_chris.html - Player page for Chris Bosh that follows the exact structure from Lab 2.
   • Use the WWW to find content for this player. The content does not have to be up-to-date or perfectly correct; but it should look complete and reasonable. 4 points
   • Be sure to find and properly embed an image of this player. 4 points
8. css/index.css - Global style sheet that creates a consistent look and feel for the main NBA page (index.html), all the team pages and all the player pages. Use some of the principles and ideas from Lab 2 to create you own unique styles for decorating and formatting the NBA page (index.html).
   • For the NBA page (index.html) create a style for decorating the main nba article so that the page is centered with a 1000px width. 4 points
   • For the NBA page (index.html) create a style for decorating the conference sections so that the eastern conference floats to the left in a column that is 460px wide and the western conference floats to the right in a column that is 460px wide.6 points
   • For the NBA page (index.html) create a style for decorating the six NBA divisions that sets the background color, border, font-family, and font-size. Use Lab 2 as a model for how to decorate these areas. 8 points
9. images/ - This folder will hold all the images used for the website. It will include at least seven images (4 player images, 2 team images, and one NBA image). Use the specified names below so the images are easy to identify by the file name. 4 points
   • anthony_carmelo.jpg
   • chandler_tyson.jpg
   • james_lebron.jpg
   • bosh_chris.jpg
   • ny_knicks.jpg
   • miami_heat.jpg
   • nba.jpg