spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

home / experts / html / tutorials / 12 / 4

index123456789exercises1

Tutorial 12: Embed with HTML - Page 4

Developer News
Microsoft Shows Off Silverlight 4, IE9 Plans
Metasploit Expands Vulnerability Test Framework
HyperCard Reborn?

Objective Alternatives

For the people who can't access your object, you can put alternate content inside the OBJECT element that will be displayed to users who can't display the image. Here are three examples of this, one for a decorative image and two for images that carry some information:

<H1><OBJECT DATA="/images/acmelogo.png" TYPE="image/png">Acme 
Computer Corp.</OBJECT> Q3 Results</H1>

<P>Our third-quarter results are out. The cocktail 
party to celebrate was just as successful 
as Q3 itself. Here's a picture of our beloved
CEO, Dr. Propellerhead, with the VP for 
Marketing:</P>

<P><OBJECT DATA="arnyandstan.png" TYPE="image/png">A picture 
of Arny and Stan smiling for the camera.</OBJECT></P>

<P>The data below shows that our 
Transfirbulation department has been making some 
good progress:</P>

<P><OBJECT DATA="piechart.png" TYPE="image/png">
<TABLE>
<CAPTION>Third quarter earnings by department</CAPTION>
<TR><TH>Department</TH>
    <TH>Percentage of earnings</TH></TR>
<TR><TD>Transfirbulation</TD><TD>74.3%</TD></TR>
<TR><TD>Customer Support</TD><TD>15.2%</TD></TR>
<TR><TD>Consulting &amp; Systems Integration</TD>
    <TD>5.8%</TD></TR>
<TR><TD>Desktop Applications</TD>0.7%<TD></TR>
</TABLE>
</OBJECT></P>

In the heading, the image of Acme's logo is used instead of the company's name. This is neat, but for people who can't view images, the company name will do just fine. A bit later on, a photo is inserted in the documented. The gleam of Arny's pearly whites is doubtless beyond the capacity for words to express, so a brief description is given so that people know what they're missing. Finally, a pie chart is inserted, that gives information that cannot be represented perfectly using text, but a table is inserted as an alternative that gives the essential figures for all to see.

This is generally the tactic you should follow: Give a textual alternative where possible, and describe the object where you can't.

Note that you can have objects within objects. This means that you can offer alternative objects for people who can't view the preferred type. For instance, the following syntax can be used to embed a Microsoft Excel spreadsheet containing the data:

<P>
<OBJECT DATA="piechart.png" TYPE="image/png">
 <OBJECT DATA="Q3Earnings.xls" TYPE="application/vnd.ms-excel">
<TABLE>
<CAPTION>Third quarter earnings by department</CAPTION>
<TR><TH>Department</TH><TH>Percentage of earnings</TH></TR>
<TR><TD>Transfirbulation</TD><TD>74.3%</TD></TR>
<TR><TD>Customer Support</TD><TD>15.2%</TD></TR>
<TR><TD>Consulting &amp; Systems Integration</TD><TD>5.8%</TD></TR>
<TR><TD>Desktop Applications</TD>0.7%<TD></TR>
</TABLE>
 </OBJECT>
</OBJECT>
</P>

In this case, a conforming browser would try to render the image. If it couldn't, it would try the spreadsheet instead. If it couldn't display that either, it would go for the HTML table.

index123456789exercises1

Produced by Stephanos Piperoglou

internet.commediabistro.comJusttechjobs.comGraphics.com

Search:

WebMediaBrands Corporate Info

Legal Notices, Licensing, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

webref The latest from WebReference.com Browse >
Rolling Out Your Own HTML Application Version Control · HTML 5: Client-side Storage · Working with Ajax Server Extensions
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Wi-Fi Product Watch, November 2009 · Chip Market Recovering From '08 Collapse · Low-Cost Tools to Kickstart Your New Business

URL: http://www.webreference.com/html/tutorial12/4.html

Created: May 28, 1998
Revised: February 25, 1999