Graphics Programs Reference
In-Depth Information
16. In the Document window, remove the extra blank lines that were below the logo
text, remove the h1 tag if it is still in the page, then remove any extra lines after the
last line of text in the content div, and then save the page and the style sheet.
17. Duplicate the home page fi ve times to create the other pages of the site, and then
rename the duplicated pages as about.html , boards.html , contact.html , events.html ,
and team.html .
18. Open each page, update the page title to replace Home with the corresponding page
name, change the page heading to include the corresponding page name, and then
replace the remaining text below the page heading and above the logo text with
check back soon, more is on the way. . . .
19. Save and close the pages, preview the pages in a browser, test the links and review
the pages, and then close the browser.
20. Upload the pages and the stylesheets folder to your remote server, and then preview
the pages over the Internet.
21. Submit the fi nished fi les to your instructor.
Case Problem 2
Create an
accessible elastic
site structure
for a Web site to
present artwork
of Charles M.
Russell.
Data File needed for this Case Problem: cc_content.docx
Cowboy Art Society The next step in the site you are working on for Moni and the
Cowboy Art Society is to design the page layout and then create the other pages in the
site. You will create a new home page that is an HTML page with a 2 column elastic,
left sidebar, header and footer layout so that the page is accessible to people with vision
impairments. (You will use the prebuilt 2 column fi xed, left sidebar, header and footer
layout and you will change the width of the div tags from px to em to create the elastic
layout that will vary with the users text size.) After you copy the existing content and nav-
igation from the home page to the new page, you will delete the old home page. You will
attach the page to the existing style sheet, and then move the styles from the new home
page to the style sheet. Finally, you will create the rest of the pages for the site.
1. Open the Cowboy Charlie site you created in Tutorial 3, Case 2, and then open the
index.html page in Design view.
2. Create a new HTML document with the 2 column fi xed, left sidebar, header and
footer layout.
3. Delete all of the styles that you will not need from the head of the page, including:
body; a:link; a:visited; a:hover, a:active, a:focus; ul.nav li; ul.nav a, ul.nav a:visited;
ul.nav a:hover, ul.nav a:active, ul.nav a:focus.
4. Select the Header placeholder image and delete it, then type Cowboy Charlie and
press the Enter key. Apply the h1 tag to the text.
5. Copy the navigation text from the home page and paste it into the header area of the
new page. Make sure that you are outside of the closing h1 tag when you paste.
6. Copy the page heading and content from the home page and paste the text into the
main content area of the new page, replacing the placeholder text.
7. Delete the placeholder text in the sidebar1 div, press the Backspace key, if necessary,
to remove the bullet point from the page, then type did you know: , press the Enter
key, and then for the rest of the content in the sidebar1 div, type:
In 1886, Charlie Russell sent his fi rst important oil painting, Breakin Camp, to the
St. Louis Exposition and Music Hall Association art show and the following events
also occurred:
The Statue of Liberty, a gift from the French, was dedicated in New York Harbor.
Geronimo's Apaches surrendered to the U.S.
Then press the Enter key.
Search WWH ::




Custom Search