Turn in:
- A zip file named your "Lastname, Firstname" containing:
- layout4.html
- layout5.html
- L4_fig1.jpg
- L4_fig2.gif
- L4_fig3.gif
- L4_fig4.gif
- L5_fig1.gif
- L5_fig2.gif
- L5_fig3.gif
- L5_fig4.gif
- L5_fig5.jpg
- L5_fig6.jpg
Details:
Well, you must of done a good job with the text-only papers the professor
had given you because he wants you to do some more work. However, this
time the papers he wants use several graphics which you should size and
convert for use on the web. Note that some of the files are bitmap images.
The hardest part of your task will be to size and covert the images so
that they look good and don't take an eternity to download.
Given the text contained in the file layout4.txt
(its graphics in L4_figs.zip) and
the text contained in the file layout5.txt
(its graphics in L5_figs.zip) create
two individual web pages by formatting the text and sizing, converting,
and inserting the graphics in the specified locations throughout the papers.
The pages that you create should conform to the following parameters:
- The papers should utilize a single column of text using the appropriate
XHTML block-level tags.
- The paper title, author, and institution information should be centered
at the top of the page.
- This information should be offset from the rest of the document by aproximately
two carriage returns (two <br /> tags).
- Use <h1> for the title and <h2> for authors and affiliations.
- To keep a space from occurring between the author and affilliation,
use a <br /> tag and a single <h2> tag.
- All paragraphs should be formatted with appropriate block-level XHTML tags
(<p>...</p>)
- All A-headings should be center justified, bold, and upper case (<h2>).
A-headings are identified in the text files as ALL UPPERCASE.
- All B-headings should be left justified, normal, upper and lower case.
Hint: Use <h3>. B-headings are identified in the text files as Upper And
Lower Case.
- All C-headings should be left justified, normal, upper and lower case,
italic embedded in paragraphs.
- C-headings. C-headings are in paragraphs followed by a period.
- Only layout5.txt contains C-headings.
- Hint: use emphasis <em> tag.
- All graphics should be sized to an appropriate size for download. For help resizing images, click here.
- (minimum width 300 pixels, maximum width 600 pixels).
- In layout4, Figure 1 should be a JPG image and the other three should be
GIFs.
- In layout5, Figures5 and 6 should be JPGs and the others should be GIFs.
- All graphics, on all assignments, should have values assigned to the following
attributes: src, width, height, border, alt, title
- All graphics should use a border setting of 0 (in <img /> tag) and be
centered (use <div align="center"> <img /> </div>).
- All graphics should have text assigned to it using the alt attribute.
- Use the figure caption as the alt text.
- Figure captions should be centered beneath the images, set in bold, 10
pt type.
- Use the <h4> tag.
- You will learn how to set 10pt type exactly when we get to CSS.
- Layout5.txt contains two long quotes from other sources. Use the <blockquote>
tag for these.
- Hint: the quotes both end with page numbers
- References should be formatted using a bulleted list <ul>.
- In the reference list, the titles of books or journals should be underlined
<u>.
- Web resources should be formatted using a bulleted list (<ul>).
- Web URL addresses should be displayed using mono-spaced font (typewriter
font) (<tt>).
- Author contact information should be inserted as preformatted text (<pre>)
and indented four spaces from the left border. The "Contact the author at"
text should be formatted as a normal paragraph outside the <pre> tag.
Note: This exercise is to be done by hand/hard-coding. No editors!
|