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
News Flash: Adobe Has iPhone Workaround
Adobe's Flash 10.1 Goes Mobile (Minus iPhone)
A Salute to Visionary CEOs

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, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Shopping | E-mail Offers | Freelance Jobs

webref The latest from WebReference.com Browse >
Building a Banking Application Home Page with OOP · Mixing Scripting Languages · Review: phpFox, a Social Networking CMS with all the Bells and Whistles
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Enterprise 2.0: Social Networking in the Cloud · BroadSoft Marketplace Hastens Pace of Telephony Innovation · Review: HTC Hero for Sprint

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

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