Microformats Wiki - User contributions [en]

directions-examples

2006-04-01T18:48:31Z

JustinLilly:

= directions examples =

Per the microformats [[process]], the first thing to do in the investigation/creation of a new microformat is to research existing examples of directions published on the Web.

== examples ==

Get examples from Google Maps, MSN Maps, Yahoo Maps, and note implicit schemas.

===Google Maps===

<pre>
Start address: 50 California St
San Francisco, CA 94111
End address: 10 Market St
San Francisco, CA 94111
Distance: 0.2 mi (about 24 secs)
Reverse directions

1. 1. Head east from California St - go 177 ft
2. 2. Turn right at Drumm St - go 149 ft
3. 3. Turn left at Market St - go 0.1 mi
</pre>

====source==== (via firefox's dom inspector)

<pre>
<table class="summary">
<tbody>
<tr onclick="openInfoWindow('start')" class="milestone">
<td class="name link">
<a onclick="this.blur()" href="javascript:void(0)">
Start address
</a>
:
</td>
<td class="value" id="panel_start">
50 California St
<br />
San Francisco, CA 94111
<br />
</td>
</tr>
<tr onclick="openInfoWindow('end')" class="milestone">
<td class="name">
<a onclick="this.blur()" href="javascript:void(0)">
End address
</a>
:
</td>
<td class="value" id="panel_end">
10 Market St
<br />
San Francisco, CA 94111
<br />
</td>
</tr>
<tr>
<td class="name">
Distance:
</td>
<td class="value">
0.2 mi (about 24 secs)
</td>
</tr>
</tbody>
</table>
<div class="reverse">
<a onclick="return loadUrl(this.href)" href="/maps?f=d&hl=en&sll=37.79449,-122.395015&sspn=0.048969,0.081711&saddr=10+market+st,+san+francisco&daddr=50+california+st,+san+francisco">
Reverse directions
</a>
</div>
<div class="printspacer noscreen">
 
</div>
<table class="steps">
<tbody>
<tr onclick="showPolylineBlowup('d', 0)">
<td class="num noprint">
<a href="javascript:void(0)">
1
</a>
.
</td>
<td class="num noscreen">
1.
</td>
<td id="panel_0" class="desc">
Head
<b>
east
</b>
from
<b>
California St
</b>
- go 
<b>
177 ft
</b>
</td>
</tr>
<tr onclick="showPolylineBlowup('d', 2)">
<td class="num noprint">
<a href="javascript:void(0)">
2
</a>
.
</td>
<td class="num noscreen">
2.
</td>
<td id="panel_2" class="desc">
Turn
<b>
right
</b>
at
<b>
Drumm St
</b>
- go 
<b>
149 ft
</b>
</td>
</tr>
<tr onclick="showPolylineBlowup('d', 4)">
<td class="num noprint">
<a href="javascript:void(0)">
3
</a>
.
</td>
<td class="num noscreen">
3.
</td>
<td id="panel_4" class="desc">
Turn
<b>
left
</b>
at
<b>
Market St
</b>
- go 
<b>
0.1 mi
</b>
</td>
</tr>
</tbody>
</table>

</pre>

===MSN maps===

<pre>
Start: 1600 Pennsylvania Ave NW, Washington, DC 20006
End: 15th St NW & Constitution Ave NW, Washington, DC 20004
Total Distance: 0.6 Miles
Estimated Total Time: 4 minutes
Directions Miles
Start: Depart 1600 Pennsylvania Ave NW, Washington, DC 20006 on Local road(s) (East) < 0.1
1: Turn RIGHT (South) onto E Executive Ave NW 0.2
2: Turn LEFT (East) onto Alexander Hamilton Pl NW, then immediately turn RIGHT (South) onto 15th St NW 0.4

Map Image
End: Arrive 15th St NW & Constitution Ave NW, Washington, DC 20004
</pre>

====Source====

<pre>
<table class="NoBorder" border="0" width="100%">
<tr>
<td class="RTText">
<span class="RouteTableStartText">
Start:
</span>
Depart 1600 Pennsylvania Ave NW, Washington, DC 20006 on Local road(s) (East)
</td>
<td class="RTText" align="Right" width="40">
< 0.1
</td>
</tr>
<tr>
<td class="RTText">
<b>
1:
</b>
Turn RIGHT (South) onto E Executive Ave NW
</td>
<td class="RTText" align="Right" width="40">
0.2
</td>
</tr>
<tr>
<td class="RTText">
<b>
2:
</b>
Turn LEFT (East) onto Alexander Hamilton Pl NW, then immediately turn RIGHT (South) onto 15th St NW
</td>
<td class="RTText" align="Right" width="40">
0.4
</td>
</tr>
</table>
</td>
<td class="RTRow" align="Right" valign="Top" height="10">
 
</td>
</tr>
<tr>
<td class="RTRow">
 
<img style="border-color:#C7BCA2;" alt="Map Image" src="/I/spacer.gif" width="0" height="0" border="0" name="MapImg1">
</td>
</tr>
<tr>
<td class="RTRowDark" valign="Top" colspan="2" rowspan="2">
<table class="NoBorder" border="0" width="100%">
<tr>
<td class="RTText">
<span class="RouteTableEndText">
End:
</span>
Arrive 15th St NW & Constitution Ave NW, Washington, DC 20004
</td>
<td class="RTText" width="40">
 
</td>
</tr>
</table>
</pre>

=== Yahoo Maps ===

<pre>
Starting from: A 50 California St, San Francisco, CA, 94111-4624 Save Address
Arriving At: B 10 Market St, San Francisco, CA, 94111-4801 Save Address
Distance: 0.2 miles Approximate time: 1 min Get Reverse Directions

Map Image

Directions Show turn by turn maps
1. Start at 50 CALIFORNIA ST, SAN FRANCISCO - go < 0.1 mi
2. Turn R on DRUMM ST - go < 0.1 mi
3. Turn L on MARKET ST - go 0.1 mi
4. Arrive at 10 MARKET ST, SAN FRANCISCO, on the L
</pre>

==== Source ====

<pre>
<table border=0 cellspacing=0 cellpadding=2 id="ymaprt">
<tr>
<th align=right valign=top width="1%" nowrap class="ymaprtpts"><small><b>Starting from:</b></small></th>
<td colspan=4><img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp16_a.gif" height=16 width=16 alt="1 "> 50 California St, San Francisco, CA 94111-4624
<small><a href="http://us.rd.yahoo.com/maps/ddresult/save_from;_ylt=AoqfcLOH0rfreiqhx67WzrQa3kcC/*-http://login.yahoo.com/config/set_yp?.src=mp&.page=p1&.cmd=n&.yn=&.st=50 California St&.zip=San Francisco, CA 94111-4624&.country=US&.done=http://maps.yahoo.com/dd_result?newaddr%3D50%2BCalifornia%2BSt%26taddr%3D10%2BMarket%2BSt%26csz%3DSan%2BFrancisco%252C%2BCA%2B94111%26country%3Dus%26tcsz%3DSan%2BFrancisco%252C%2BCA%2B94111%26tcountry%3Dus">Save Address</a></small></tr>
<tr>
<th align=right valign=top class="ymaprtpts"><small><b>Arriving at:</b></small></th>
<td colspan=4><img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp16_b.gif" height=16 width=16 alt="2 "> 10 Market St, San Francisco, CA 94111-4801
<small><a href="http://us.rd.yahoo.com/maps/ddresult/save_to;_ylt=AiWgw9KytDi4XuzF4YWGFz0a3kcC/*-http://login.yahoo.com/config/set_yp?.src=mp&.page=p1&.cmd=n&.yn=&.st=10 Market St&.zip=San Francisco, CA 94111-4801&.country=US&.done=http://maps.yahoo.com/dd_result?newaddr%3D50%2BCalifornia%2BSt%26taddr%3D10%2BMarket%2BSt%26csz%3DSan%2BFrancisco%252C%2BCA%2B94111%26country%3Dus%26tcsz%3DSan%2BFrancisco%252C%2BCA%2B94111%26tcountry%3Dus">Save Address</a></small></tr>

<tr>
<th align=right class="ymaprtpts"><small><b>Distance:</b></small></th>
<td width="1%" nowrap>0.2 miles</td>
<th align=right width="1%" nowrap class="ymaprtpts"><small><b>Approximate Travel Time:</b></small></th>
<td>
1 min
</td>
<td align=right valign=bottom width="1%" nowrap>
<a href="http://us.rd.yahoo.com/maps/ddresult/reverseDD;_ylt=ArvjuCZ_I5Gc4JyrHRFQIaEa3kcC/*-http://maps.yahoo.com/dd_result?ed=_YaYzuV.winqVL64AzOmYypNBUy1fFVhwugBQs_Pogbl1WImEFx_H1JxBITyDts-&name=&csz=San+Francisco%2C+CA+94111-4801&country=US&desc=&tname=&tcsz=San+Francisco%2C+CA+94111-4624&tcountry=US&tdesc=&ds=g&tbt=0&trf=0&textonly=0&oerr=&terr=">
<small class="ygver">Get Reverse Directions</small>
</a>
</td>

</tr>
</table>

Links for sending the directions
MAP IMAGE

<div id="ymapdir">

<table width="100%" border=0 cellspacing=0 cellpadding=0 align=center><tr><th align=left><b class="ygver">Directions</b></th><th align=right><small><b>
<a href="http://us.rd.yahoo.com/maps/ddresult/tbt_on;_ylt=AtcdCayUHXlA8L0yvev28Jwa3kcC/*-http://maps.yahoo.com/dd_result?newaddr=50+California+St&taddr=10+Market+St&csz=San+Francisco%2C+CA+94111&country=us&tcsz=San+Francisco%2C+CA+94111&tcountry=us&tbt=1">Show Turn by Turn Maps</a></b></small></th></tr>
</table>
<table width="100%" border=0 cellspacing=0 cellpadding=0 align=center>
<tr><td>1.</td><td>Start at <b>50</b> <b>CALIFORNIA</b> <b>ST,</b> <b>SAN</b> <b>FRANCISCO</b> - go <b>< 0.1</b> mi</td></tr><tr><td>2.</td><td>Turn <img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp22_r.gif" alt=Right align=absmiddle> on <b>DRUMM</b> <b>ST</b> - go <b>< 0.1</b> mi</td></tr><tr><td>3.</td><td>Turn <img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp22_l.gif" alt=Left align=absmiddle> on <b>MARKET</b> <b>ST</b> - go <b>0.1</b> mi</td></tr><tr><td>4.</td><td>Arrive at <b>10</b> <b>MARKET</b> <b>ST,</b> <b>SAN</b> <b>FRANCISCO,</b> on the <img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp22_l.gif" alt=Left align=absmiddle> </td></tr></table>

</div>
</pre>

===Yahoo Maps (Beta)===

<pre>
V GET MAP AND DIRECTIONS Clear

A 50 California St San Francisco, CA 94111 [x]
[] Make this my default Yahoo! location
1. Start at 50 CALIFORNIA ST, SAN FRANCISCO - go 0.0 mi
2. Turn Right on DRUMM ST - go 0.0 mi
3. Turn Left on MARKET ST - go 0.1 mi
4. Arrive at 10 MARKET ST, SAN FRANCISCO, on the Left

B 10 Market St San Francisco, CA 94111 [x]
C Address, City State [x]

Distance 0.2 mi Time: 1 mins (approx)
Reverse Directions | Roundtrip GO
</pre>

====Source====

Its all based on javascript (ajax) so its difficult to find.

== related discussion ==

* [http://radar.oreilly.com/archives/2006/03/directions_microformat_leading.html Tim O'Reilly blog post: Directions Microformat -> Google for directions?]

directions-examples

2006-04-01T18:46:21Z

JustinLilly:

= directions examples =

Per the microformats [[process]], the first thing to do in the investigation/creation of a new microformat is to research existing examples of directions published on the Web.

== examples ==

Get examples from Google Maps, MSN Maps, Yahoo Maps, and note implicit schemas.

===Google Maps===

<pre>
Start address: 50 California St
San Francisco, CA 94111
End address: 10 Market St
San Francisco, CA 94111
Distance: 0.2 mi (about 24 secs)
Reverse directions

1. 1. Head east from California St - go 177 ft
2. 2. Turn right at Drumm St - go 149 ft
3. 3. Turn left at Market St - go 0.1 mi
</pre>

====source==== (via firefox's dom inspector)

<pre>
<table class="summary">
<tbody>
<tr onclick="openInfoWindow('start')" class="milestone">
<td class="name link">
<a onclick="this.blur()" href="javascript:void(0)">
Start address
</a>
:
</td>
<td class="value" id="panel_start">
50 California St
<br />
San Francisco, CA 94111
<br />
</td>
</tr>
<tr onclick="openInfoWindow('end')" class="milestone">
<td class="name">
<a onclick="this.blur()" href="javascript:void(0)">
End address
</a>
:
</td>
<td class="value" id="panel_end">
10 Market St
<br />
San Francisco, CA 94111
<br />
</td>
</tr>
<tr>
<td class="name">
Distance:
</td>
<td class="value">
0.2 mi (about 24 secs)
</td>
</tr>
</tbody>
</table>
<div class="reverse">
<a onclick="return loadUrl(this.href)" href="/maps?f=d&hl=en&sll=37.79449,-122.395015&sspn=0.048969,0.081711&saddr=10+market+st,+san+francisco&daddr=50+california+st,+san+francisco">
Reverse directions
</a>
</div>
<div class="printspacer noscreen">
 
</div>
<table class="steps">
<tbody>
<tr onclick="showPolylineBlowup('d', 0)">
<td class="num noprint">
<a href="javascript:void(0)">
1
</a>
.
</td>
<td class="num noscreen">
1.
</td>
<td id="panel_0" class="desc">
Head
<b>
east
</b>
from
<b>
California St
</b>
- go 
<b>
177 ft
</b>
</td>
</tr>
<tr onclick="showPolylineBlowup('d', 2)">
<td class="num noprint">
<a href="javascript:void(0)">
2
</a>
.
</td>
<td class="num noscreen">
2.
</td>
<td id="panel_2" class="desc">
Turn
<b>
right
</b>
at
<b>
Drumm St
</b>
- go 
<b>
149 ft
</b>
</td>
</tr>
<tr onclick="showPolylineBlowup('d', 4)">
<td class="num noprint">
<a href="javascript:void(0)">
3
</a>
.
</td>
<td class="num noscreen">
3.
</td>
<td id="panel_4" class="desc">
Turn
<b>
left
</b>
at
<b>
Market St
</b>
- go 
<b>
0.1 mi
</b>
</td>
</tr>
</tbody>
</table>

</pre>

===MSN maps===

<pre>
Start: 1600 Pennsylvania Ave NW, Washington, DC 20006
End: 15th St NW & Constitution Ave NW, Washington, DC 20004
Total Distance: 0.6 Miles
Estimated Total Time: 4 minutes
Directions Miles
Start: Depart 1600 Pennsylvania Ave NW, Washington, DC 20006 on Local road(s) (East) < 0.1
1: Turn RIGHT (South) onto E Executive Ave NW 0.2
2: Turn LEFT (East) onto Alexander Hamilton Pl NW, then immediately turn RIGHT (South) onto 15th St NW 0.4

Map Image
End: Arrive 15th St NW & Constitution Ave NW, Washington, DC 20004
</pre>

====Source====

<pre>
<table class="NoBorder" border="0" width="100%">
<tr>
<td class="RTText">
<span class="RouteTableStartText">
Start:
</span>
Depart 1600 Pennsylvania Ave NW, Washington, DC 20006 on Local road(s) (East)
</td>
<td class="RTText" align="Right" width="40">
< 0.1
</td>
</tr>
<tr>
<td class="RTText">
<b>
1:
</b>
Turn RIGHT (South) onto E Executive Ave NW
</td>
<td class="RTText" align="Right" width="40">
0.2
</td>
</tr>
<tr>
<td class="RTText">
<b>
2:
</b>
Turn LEFT (East) onto Alexander Hamilton Pl NW, then immediately turn RIGHT (South) onto 15th St NW
</td>
<td class="RTText" align="Right" width="40">
0.4
</td>
</tr>
</table>
</td>
<td class="RTRow" align="Right" valign="Top" height="10">
 
</td>
</tr>
<tr>
<td class="RTRow">
 
<img style="border-color:#C7BCA2;" alt="Map Image" src="/I/spacer.gif" width="0" height="0" border="0" name="MapImg1">
</td>
</tr>
<tr>
<td class="RTRowDark" valign="Top" colspan="2" rowspan="2">
<table class="NoBorder" border="0" width="100%">
<tr>
<td class="RTText">
<span class="RouteTableEndText">
End:
</span>
Arrive 15th St NW & Constitution Ave NW, Washington, DC 20004
</td>
<td class="RTText" width="40">
 
</td>
</tr>
</table>
</pre>

=== Yahoo Maps ===

<pre>
Starting from: A 50 California St, San Francisco, CA, 94111-4624 Save Address
Arriving At: B 10 Market St, San Francisco, CA, 94111-4801 Save Address
Distance: 0.2 miles Approximate time: 1 min Get Reverse Directions

Map Image

Directions Show turn by turn maps
1. Start at 50 CALIFORNIA ST, SAN FRANCISCO - go < 0.1 mi
2. Turn R on DRUMM ST - go < 0.1 mi
3. Turn L on MARKET ST - go 0.1 mi
4. Arrive at 10 MARKET ST, SAN FRANCISCO, on the L
</pre>

==== Source ====

<pre>
<table border=0 cellspacing=0 cellpadding=2 id="ymaprt">
<tr>
<th align=right valign=top width="1%" nowrap class="ymaprtpts"><small><b>Starting from:</b></small></th>
<td colspan=4><img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp16_a.gif" height=16 width=16 alt="1 "> 50 California St, San Francisco, CA 94111-4624
<small><a href="http://us.rd.yahoo.com/maps/ddresult/save_from;_ylt=AoqfcLOH0rfreiqhx67WzrQa3kcC/*-http://login.yahoo.com/config/set_yp?.src=mp&.page=p1&.cmd=n&.yn=&.st=50 California St&.zip=San Francisco, CA 94111-4624&.country=US&.done=http://maps.yahoo.com/dd_result?newaddr%3D50%2BCalifornia%2BSt%26taddr%3D10%2BMarket%2BSt%26csz%3DSan%2BFrancisco%252C%2BCA%2B94111%26country%3Dus%26tcsz%3DSan%2BFrancisco%252C%2BCA%2B94111%26tcountry%3Dus">Save Address</a></small></tr>
<tr>
<th align=right valign=top class="ymaprtpts"><small><b>Arriving at:</b></small></th>
<td colspan=4><img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp16_b.gif" height=16 width=16 alt="2 "> 10 Market St, San Francisco, CA 94111-4801
<small><a href="http://us.rd.yahoo.com/maps/ddresult/save_to;_ylt=AiWgw9KytDi4XuzF4YWGFz0a3kcC/*-http://login.yahoo.com/config/set_yp?.src=mp&.page=p1&.cmd=n&.yn=&.st=10 Market St&.zip=San Francisco, CA 94111-4801&.country=US&.done=http://maps.yahoo.com/dd_result?newaddr%3D50%2BCalifornia%2BSt%26taddr%3D10%2BMarket%2BSt%26csz%3DSan%2BFrancisco%252C%2BCA%2B94111%26country%3Dus%26tcsz%3DSan%2BFrancisco%252C%2BCA%2B94111%26tcountry%3Dus">Save Address</a></small></tr>

<tr>
<th align=right class="ymaprtpts"><small><b>Distance:</b></small></th>
<td width="1%" nowrap>0.2 miles</td>
<th align=right width="1%" nowrap class="ymaprtpts"><small><b>Approximate Travel Time:</b></small></th>
<td>
1 min
</td>
<td align=right valign=bottom width="1%" nowrap>
<a href="http://us.rd.yahoo.com/maps/ddresult/reverseDD;_ylt=ArvjuCZ_I5Gc4JyrHRFQIaEa3kcC/*-http://maps.yahoo.com/dd_result?ed=_YaYzuV.winqVL64AzOmYypNBUy1fFVhwugBQs_Pogbl1WImEFx_H1JxBITyDts-&name=&csz=San+Francisco%2C+CA+94111-4801&country=US&desc=&tname=&tcsz=San+Francisco%2C+CA+94111-4624&tcountry=US&tdesc=&ds=g&tbt=0&trf=0&textonly=0&oerr=&terr=">
<small class="ygver">Get Reverse Directions</small>
</a>
</td>

</tr>
</table>

Links for sending the directions
MAP IMAGE

<div id="ymapdir">

<table width="100%" border=0 cellspacing=0 cellpadding=0 align=center><tr><th align=left><b class="ygver">Directions</b></th><th align=right><small><b>
<a href="http://us.rd.yahoo.com/maps/ddresult/tbt_on;_ylt=AtcdCayUHXlA8L0yvev28Jwa3kcC/*-http://maps.yahoo.com/dd_result?newaddr=50+California+St&taddr=10+Market+St&csz=San+Francisco%2C+CA+94111&country=us&tcsz=San+Francisco%2C+CA+94111&tcountry=us&tbt=1">Show Turn by Turn Maps</a></b></small></th></tr>
</table>
<table width="100%" border=0 cellspacing=0 cellpadding=0 align=center>
<tr><td>1.</td><td>Start at <b>50</b> <b>CALIFORNIA</b> <b>ST,</b> <b>SAN</b> <b>FRANCISCO</b> - go <b>< 0.1</b> mi</td></tr><tr><td>2.</td><td>Turn <img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp22_r.gif" alt=Right align=absmiddle> on <b>DRUMM</b> <b>ST</b> - go <b>< 0.1</b> mi</td></tr><tr><td>3.</td><td>Turn <img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp22_l.gif" alt=Left align=absmiddle> on <b>MARKET</b> <b>ST</b> - go <b>0.1</b> mi</td></tr><tr><td>4.</td><td>Arrive at <b>10</b> <b>MARKET</b> <b>ST,</b> <b>SAN</b> <b>FRANCISCO,</b> on the <img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp22_l.gif" alt=Left align=absmiddle> </td></tr></table>

</div>
</pre>

===Yahoo Maps (Beta)===
V GET MAP AND DIRECTIONS Clear

A 50 California St San Francisco, CA 94111 [x]
[] Make this my default Yahoo! location
1. Start at 50 CALIFORNIA ST, SAN FRANCISCO - go 0.0 mi
2. Turn Right on DRUMM ST - go 0.0 mi
3. Turn Left on MARKET ST - go 0.1 mi
4. Arrive at 10 MARKET ST, SAN FRANCISCO, on the Left

B 10 Market St San Francisco, CA 94111 [x]
C Address, City State [x]

Distance 0.2 mi Time: 1 mins (approx)
Reverse Directions | Roundtrip GO

====Source====

Its all based on javascript (ajax) so its difficult to find.

== related discussion ==

* [http://radar.oreilly.com/archives/2006/03/directions_microformat_leading.html Tim O'Reilly blog post: Directions Microformat -> Google for directions?]

directions-examples

2006-04-01T18:41:15Z

JustinLilly:

= directions examples =

Per the microformats [[process]], the first thing to do in the investigation/creation of a new microformat is to research existing examples of directions published on the Web.

== examples ==

Get examples from Google Maps, MSN Maps, Yahoo Maps, and note implicit schemas.

===Google Maps===

<pre>
Start address: 50 California St
San Francisco, CA 94111
End address: 10 Market St
San Francisco, CA 94111
Distance: 0.2 mi (about 24 secs)
Reverse directions

1. 1. Head east from California St - go 177 ft
2. 2. Turn right at Drumm St - go 149 ft
3. 3. Turn left at Market St - go 0.1 mi
</pre>

====source==== (via firefox's dom inspector)

<pre>
<table class="summary">
<tbody>
<tr onclick="openInfoWindow('start')" class="milestone">
<td class="name link">
<a onclick="this.blur()" href="javascript:void(0)">
Start address
</a>
:
</td>
<td class="value" id="panel_start">
50 California St
<br />
San Francisco, CA 94111
<br />
</td>
</tr>
<tr onclick="openInfoWindow('end')" class="milestone">
<td class="name">
<a onclick="this.blur()" href="javascript:void(0)">
End address
</a>
:
</td>
<td class="value" id="panel_end">
10 Market St
<br />
San Francisco, CA 94111
<br />
</td>
</tr>
<tr>
<td class="name">
Distance:
</td>
<td class="value">
0.2 mi (about 24 secs)
</td>
</tr>
</tbody>
</table>
<div class="reverse">
<a onclick="return loadUrl(this.href)" href="/maps?f=d&hl=en&sll=37.79449,-122.395015&sspn=0.048969,0.081711&saddr=10+market+st,+san+francisco&daddr=50+california+st,+san+francisco">
Reverse directions
</a>
</div>
<div class="printspacer noscreen">
 
</div>
<table class="steps">
<tbody>
<tr onclick="showPolylineBlowup('d', 0)">
<td class="num noprint">
<a href="javascript:void(0)">
1
</a>
.
</td>
<td class="num noscreen">
1.
</td>
<td id="panel_0" class="desc">
Head
<b>
east
</b>
from
<b>
California St
</b>
- go 
<b>
177 ft
</b>
</td>
</tr>
<tr onclick="showPolylineBlowup('d', 2)">
<td class="num noprint">
<a href="javascript:void(0)">
2
</a>
.
</td>
<td class="num noscreen">
2.
</td>
<td id="panel_2" class="desc">
Turn
<b>
right
</b>
at
<b>
Drumm St
</b>
- go 
<b>
149 ft
</b>
</td>
</tr>
<tr onclick="showPolylineBlowup('d', 4)">
<td class="num noprint">
<a href="javascript:void(0)">
3
</a>
.
</td>
<td class="num noscreen">
3.
</td>
<td id="panel_4" class="desc">
Turn
<b>
left
</b>
at
<b>
Market St
</b>
- go 
<b>
0.1 mi
</b>
</td>
</tr>
</tbody>
</table>

</pre>

===MSN maps===

<pre>
Start: 1600 Pennsylvania Ave NW, Washington, DC 20006
End: 15th St NW & Constitution Ave NW, Washington, DC 20004
Total Distance: 0.6 Miles
Estimated Total Time: 4 minutes
Directions Miles
Start: Depart 1600 Pennsylvania Ave NW, Washington, DC 20006 on Local road(s) (East) < 0.1
1: Turn RIGHT (South) onto E Executive Ave NW 0.2
2: Turn LEFT (East) onto Alexander Hamilton Pl NW, then immediately turn RIGHT (South) onto 15th St NW 0.4

Map Image
End: Arrive 15th St NW & Constitution Ave NW, Washington, DC 20004
</pre>

====Source====

<pre>
<table class="NoBorder" border="0" width="100%">
<tr>
<td class="RTText">
<span class="RouteTableStartText">
Start:
</span>
Depart 1600 Pennsylvania Ave NW, Washington, DC 20006 on Local road(s) (East)
</td>
<td class="RTText" align="Right" width="40">
< 0.1
</td>
</tr>
<tr>
<td class="RTText">
<b>
1:
</b>
Turn RIGHT (South) onto E Executive Ave NW
</td>
<td class="RTText" align="Right" width="40">
0.2
</td>
</tr>
<tr>
<td class="RTText">
<b>
2:
</b>
Turn LEFT (East) onto Alexander Hamilton Pl NW, then immediately turn RIGHT (South) onto 15th St NW
</td>
<td class="RTText" align="Right" width="40">
0.4
</td>
</tr>
</table>
</td>
<td class="RTRow" align="Right" valign="Top" height="10">
 
</td>
</tr>
<tr>
<td class="RTRow">
 
<img style="border-color:#C7BCA2;" alt="Map Image" src="/I/spacer.gif" width="0" height="0" border="0" name="MapImg1">
</td>
</tr>
<tr>
<td class="RTRowDark" valign="Top" colspan="2" rowspan="2">
<table class="NoBorder" border="0" width="100%">
<tr>
<td class="RTText">
<span class="RouteTableEndText">
End:
</span>
Arrive 15th St NW & Constitution Ave NW, Washington, DC 20004
</td>
<td class="RTText" width="40">
 
</td>
</tr>
</table>
</pre>

=== Yahoo Maps ===

<pre>
Starting from: A 50 California St, San Francisco, CA, 94111-4624 Save Address
Arriving At: B 10 Market St, San Francisco, CA, 94111-4801 Save Address
Distance: 0.2 miles Approximate time: 1 min Get Reverse Directions

Map Image

Directions Show turn by turn maps
1. Start at 50 CALIFORNIA ST, SAN FRANCISCO - go < 0.1 mi
2. Turn R on DRUMM ST - go < 0.1 mi
3. Turn L on MARKET ST - go 0.1 mi
4. Arrive at 10 MARKET ST, SAN FRANCISCO, on the L
</pre>

==== Source ====

<pre>
<table border=0 cellspacing=0 cellpadding=2 id="ymaprt">
<tr>
<th align=right valign=top width="1%" nowrap class="ymaprtpts"><small><b>Starting from:</b></small></th>
<td colspan=4><img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp16_a.gif" height=16 width=16 alt="1 "> 50 California St, San Francisco, CA 94111-4624
<small><a href="http://us.rd.yahoo.com/maps/ddresult/save_from;_ylt=AoqfcLOH0rfreiqhx67WzrQa3kcC/*-http://login.yahoo.com/config/set_yp?.src=mp&.page=p1&.cmd=n&.yn=&.st=50 California St&.zip=San Francisco, CA 94111-4624&.country=US&.done=http://maps.yahoo.com/dd_result?newaddr%3D50%2BCalifornia%2BSt%26taddr%3D10%2BMarket%2BSt%26csz%3DSan%2BFrancisco%252C%2BCA%2B94111%26country%3Dus%26tcsz%3DSan%2BFrancisco%252C%2BCA%2B94111%26tcountry%3Dus">Save Address</a></small></tr>
<tr>
<th align=right valign=top class="ymaprtpts"><small><b>Arriving at:</b></small></th>
<td colspan=4><img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp16_b.gif" height=16 width=16 alt="2 "> 10 Market St, San Francisco, CA 94111-4801
<small><a href="http://us.rd.yahoo.com/maps/ddresult/save_to;_ylt=AiWgw9KytDi4XuzF4YWGFz0a3kcC/*-http://login.yahoo.com/config/set_yp?.src=mp&.page=p1&.cmd=n&.yn=&.st=10 Market St&.zip=San Francisco, CA 94111-4801&.country=US&.done=http://maps.yahoo.com/dd_result?newaddr%3D50%2BCalifornia%2BSt%26taddr%3D10%2BMarket%2BSt%26csz%3DSan%2BFrancisco%252C%2BCA%2B94111%26country%3Dus%26tcsz%3DSan%2BFrancisco%252C%2BCA%2B94111%26tcountry%3Dus">Save Address</a></small></tr>

<tr>
<th align=right class="ymaprtpts"><small><b>Distance:</b></small></th>
<td width="1%" nowrap>0.2 miles</td>
<th align=right width="1%" nowrap class="ymaprtpts"><small><b>Approximate Travel Time:</b></small></th>
<td>
1 min
</td>
<td align=right valign=bottom width="1%" nowrap>
<a href="http://us.rd.yahoo.com/maps/ddresult/reverseDD;_ylt=ArvjuCZ_I5Gc4JyrHRFQIaEa3kcC/*-http://maps.yahoo.com/dd_result?ed=_YaYzuV.winqVL64AzOmYypNBUy1fFVhwugBQs_Pogbl1WImEFx_H1JxBITyDts-&name=&csz=San+Francisco%2C+CA+94111-4801&country=US&desc=&tname=&tcsz=San+Francisco%2C+CA+94111-4624&tcountry=US&tdesc=&ds=g&tbt=0&trf=0&textonly=0&oerr=&terr=">
<small class="ygver">Get Reverse Directions</small>
</a>
</td>

</tr>
</table>

Links for sending the directions
MAP IMAGE

<div id="ymapdir">

<table width="100%" border=0 cellspacing=0 cellpadding=0 align=center><tr><th align=left><b class="ygver">Directions</b></th><th align=right><small><b>
<a href="http://us.rd.yahoo.com/maps/ddresult/tbt_on;_ylt=AtcdCayUHXlA8L0yvev28Jwa3kcC/*-http://maps.yahoo.com/dd_result?newaddr=50+California+St&taddr=10+Market+St&csz=San+Francisco%2C+CA+94111&country=us&tcsz=San+Francisco%2C+CA+94111&tcountry=us&tbt=1">Show Turn by Turn Maps</a></b></small></th></tr>
</table>
<table width="100%" border=0 cellspacing=0 cellpadding=0 align=center>
<tr><td>1.</td><td>Start at <b>50</b> <b>CALIFORNIA</b> <b>ST,</b> <b>SAN</b> <b>FRANCISCO</b> - go <b>< 0.1</b> mi</td></tr><tr><td>2.</td><td>Turn <img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp22_r.gif" alt=Right align=absmiddle> on <b>DRUMM</b> <b>ST</b> - go <b>< 0.1</b> mi</td></tr><tr><td>3.</td><td>Turn <img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp22_l.gif" alt=Left align=absmiddle> on <b>MARKET</b> <b>ST</b> - go <b>0.1</b> mi</td></tr><tr><td>4.</td><td>Arrive at <b>10</b> <b>MARKET</b> <b>ST,</b> <b>SAN</b> <b>FRANCISCO,</b> on the <img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp22_l.gif" alt=Left align=absmiddle> </td></tr></table>

</div>
</pre>

== related discussion ==

* [http://radar.oreilly.com/archives/2006/03/directions_microformat_leading.html Tim O'Reilly blog post: Directions Microformat -> Google for directions?]

directions-examples

2006-04-01T18:40:12Z

JustinLilly:

= directions examples =

Per the microformats [[process]], the first thing to do in the investigation/creation of a new microformat is to research existing examples of directions published on the Web.

== examples ==

Get examples from Google Maps, MSN Maps, Yahoo Maps, and note implicit schemas.

===Google Maps===

<pre>
Start address: 50 California St
San Francisco, CA 94111
End address: 10 Market St
San Francisco, CA 94111
Distance: 0.2 mi (about 24 secs)
Reverse directions

1. 1. Head east from California St - go 177 ft
2. 2. Turn right at Drumm St - go 149 ft
3. 3. Turn left at Market St - go 0.1 mi
</pre>

===source=== (via firefox's dom inspector)

<pre>
<table class="summary">
<tbody>
<tr onclick="openInfoWindow('start')" class="milestone">
<td class="name link">
<a onclick="this.blur()" href="javascript:void(0)">
Start address
</a>
:
</td>
<td class="value" id="panel_start">
50 California St
<br />
San Francisco, CA 94111
<br />
</td>
</tr>
<tr onclick="openInfoWindow('end')" class="milestone">
<td class="name">
<a onclick="this.blur()" href="javascript:void(0)">
End address
</a>
:
</td>
<td class="value" id="panel_end">
10 Market St
<br />
San Francisco, CA 94111
<br />
</td>
</tr>
<tr>
<td class="name">
Distance:
</td>
<td class="value">
0.2 mi (about 24 secs)
</td>
</tr>
</tbody>
</table>
<div class="reverse">
<a onclick="return loadUrl(this.href)" href="/maps?f=d&hl=en&sll=37.79449,-122.395015&sspn=0.048969,0.081711&saddr=10+market+st,+san+francisco&daddr=50+california+st,+san+francisco">
Reverse directions
</a>
</div>
<div class="printspacer noscreen">
 
</div>
<table class="steps">
<tbody>
<tr onclick="showPolylineBlowup('d', 0)">
<td class="num noprint">
<a href="javascript:void(0)">
1
</a>
.
</td>
<td class="num noscreen">
1.
</td>
<td id="panel_0" class="desc">
Head
<b>
east
</b>
from
<b>
California St
</b>
- go 
<b>
177 ft
</b>
</td>
</tr>
<tr onclick="showPolylineBlowup('d', 2)">
<td class="num noprint">
<a href="javascript:void(0)">
2
</a>
.
</td>
<td class="num noscreen">
2.
</td>
<td id="panel_2" class="desc">
Turn
<b>
right
</b>
at
<b>
Drumm St
</b>
- go 
<b>
149 ft
</b>
</td>
</tr>
<tr onclick="showPolylineBlowup('d', 4)">
<td class="num noprint">
<a href="javascript:void(0)">
3
</a>
.
</td>
<td class="num noscreen">
3.
</td>
<td id="panel_4" class="desc">
Turn
<b>
left
</b>
at
<b>
Market St
</b>
- go 
<b>
0.1 mi
</b>
</td>
</tr>
</tbody>
</table>

</pre>

===MSN maps===

<pre>
Start: 1600 Pennsylvania Ave NW, Washington, DC 20006
End: 15th St NW & Constitution Ave NW, Washington, DC 20004
Total Distance: 0.6 Miles
Estimated Total Time: 4 minutes
Directions Miles
Start: Depart 1600 Pennsylvania Ave NW, Washington, DC 20006 on Local road(s) (East) < 0.1
1: Turn RIGHT (South) onto E Executive Ave NW 0.2
2: Turn LEFT (East) onto Alexander Hamilton Pl NW, then immediately turn RIGHT (South) onto 15th St NW 0.4

Map Image
End: Arrive 15th St NW & Constitution Ave NW, Washington, DC 20004
</pre>

===Source===

<pre>
<table class="NoBorder" border="0" width="100%">
<tr>
<td class="RTText">
<span class="RouteTableStartText">
Start:
</span>
Depart 1600 Pennsylvania Ave NW, Washington, DC 20006 on Local road(s) (East)
</td>
<td class="RTText" align="Right" width="40">
< 0.1
</td>
</tr>
<tr>
<td class="RTText">
<b>
1:
</b>
Turn RIGHT (South) onto E Executive Ave NW
</td>
<td class="RTText" align="Right" width="40">
0.2
</td>
</tr>
<tr>
<td class="RTText">
<b>
2:
</b>
Turn LEFT (East) onto Alexander Hamilton Pl NW, then immediately turn RIGHT (South) onto 15th St NW
</td>
<td class="RTText" align="Right" width="40">
0.4
</td>
</tr>
</table>
</td>
<td class="RTRow" align="Right" valign="Top" height="10">
 
</td>
</tr>
<tr>
<td class="RTRow">
 
<img style="border-color:#C7BCA2;" alt="Map Image" src="/I/spacer.gif" width="0" height="0" border="0" name="MapImg1">
</td>
</tr>
<tr>
<td class="RTRowDark" valign="Top" colspan="2" rowspan="2">
<table class="NoBorder" border="0" width="100%">
<tr>
<td class="RTText">
<span class="RouteTableEndText">
End:
</span>
Arrive 15th St NW & Constitution Ave NW, Washington, DC 20004
</td>
<td class="RTText" width="40">
 
</td>
</tr>
</table>
</pre>

== Yahoo Maps ==

<pre>
Starting from: A 50 California St, San Francisco, CA, 94111-4624 Save Address
Arriving At: B 10 Market St, San Francisco, CA, 94111-4801 Save Address
Distance: 0.2 miles Approximate time: 1 min Get Reverse Directions

Map Image

Directions Show turn by turn maps
1. Start at 50 CALIFORNIA ST, SAN FRANCISCO - go < 0.1 mi
2. Turn R on DRUMM ST - go < 0.1 mi
3. Turn L on MARKET ST - go 0.1 mi
4. Arrive at 10 MARKET ST, SAN FRANCISCO, on the L
</pre>

== Source ==

<pre>
<table border=0 cellspacing=0 cellpadding=2 id="ymaprt">
<tr>
<th align=right valign=top width="1%" nowrap class="ymaprtpts"><small><b>Starting from:</b></small></th>
<td colspan=4><img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp16_a.gif" height=16 width=16 alt="1 "> 50 California St, San Francisco, CA 94111-4624
<small><a href="http://us.rd.yahoo.com/maps/ddresult/save_from;_ylt=AoqfcLOH0rfreiqhx67WzrQa3kcC/*-http://login.yahoo.com/config/set_yp?.src=mp&.page=p1&.cmd=n&.yn=&.st=50 California St&.zip=San Francisco, CA 94111-4624&.country=US&.done=http://maps.yahoo.com/dd_result?newaddr%3D50%2BCalifornia%2BSt%26taddr%3D10%2BMarket%2BSt%26csz%3DSan%2BFrancisco%252C%2BCA%2B94111%26country%3Dus%26tcsz%3DSan%2BFrancisco%252C%2BCA%2B94111%26tcountry%3Dus">Save Address</a></small></tr>
<tr>
<th align=right valign=top class="ymaprtpts"><small><b>Arriving at:</b></small></th>
<td colspan=4><img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp16_b.gif" height=16 width=16 alt="2 "> 10 Market St, San Francisco, CA 94111-4801
<small><a href="http://us.rd.yahoo.com/maps/ddresult/save_to;_ylt=AiWgw9KytDi4XuzF4YWGFz0a3kcC/*-http://login.yahoo.com/config/set_yp?.src=mp&.page=p1&.cmd=n&.yn=&.st=10 Market St&.zip=San Francisco, CA 94111-4801&.country=US&.done=http://maps.yahoo.com/dd_result?newaddr%3D50%2BCalifornia%2BSt%26taddr%3D10%2BMarket%2BSt%26csz%3DSan%2BFrancisco%252C%2BCA%2B94111%26country%3Dus%26tcsz%3DSan%2BFrancisco%252C%2BCA%2B94111%26tcountry%3Dus">Save Address</a></small></tr>

<tr>
<th align=right class="ymaprtpts"><small><b>Distance:</b></small></th>
<td width="1%" nowrap>0.2 miles</td>
<th align=right width="1%" nowrap class="ymaprtpts"><small><b>Approximate Travel Time:</b></small></th>
<td>
1 min
</td>
<td align=right valign=bottom width="1%" nowrap>
<a href="http://us.rd.yahoo.com/maps/ddresult/reverseDD;_ylt=ArvjuCZ_I5Gc4JyrHRFQIaEa3kcC/*-http://maps.yahoo.com/dd_result?ed=_YaYzuV.winqVL64AzOmYypNBUy1fFVhwugBQs_Pogbl1WImEFx_H1JxBITyDts-&name=&csz=San+Francisco%2C+CA+94111-4801&country=US&desc=&tname=&tcsz=San+Francisco%2C+CA+94111-4624&tcountry=US&tdesc=&ds=g&tbt=0&trf=0&textonly=0&oerr=&terr=">
<small class="ygver">Get Reverse Directions</small>
</a>
</td>

</tr>
</table>

Links for sending the directions
MAP IMAGE

<div id="ymapdir">

<table width="100%" border=0 cellspacing=0 cellpadding=0 align=center><tr><th align=left><b class="ygver">Directions</b></th><th align=right><small><b>
<a href="http://us.rd.yahoo.com/maps/ddresult/tbt_on;_ylt=AtcdCayUHXlA8L0yvev28Jwa3kcC/*-http://maps.yahoo.com/dd_result?newaddr=50+California+St&taddr=10+Market+St&csz=San+Francisco%2C+CA+94111&country=us&tcsz=San+Francisco%2C+CA+94111&tcountry=us&tbt=1">Show Turn by Turn Maps</a></b></small></th></tr>
</table>
<table width="100%" border=0 cellspacing=0 cellpadding=0 align=center>
<tr><td>1.</td><td>Start at <b>50</b> <b>CALIFORNIA</b> <b>ST,</b> <b>SAN</b> <b>FRANCISCO</b> - go <b>< 0.1</b> mi</td></tr><tr><td>2.</td><td>Turn <img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp22_r.gif" alt=Right align=absmiddle> on <b>DRUMM</b> <b>ST</b> - go <b>< 0.1</b> mi</td></tr><tr><td>3.</td><td>Turn <img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp22_l.gif" alt=Left align=absmiddle> on <b>MARKET</b> <b>ST</b> - go <b>0.1</b> mi</td></tr><tr><td>4.</td><td>Arrive at <b>10</b> <b>MARKET</b> <b>ST,</b> <b>SAN</b> <b>FRANCISCO,</b> on the <img src="http://us.i1.yimg.com/us.yimg.com/i/us/mp/gr/mp22_l.gif" alt=Left align=absmiddle> </td></tr></table>

</div>
</pre>

== related discussion ==

* [http://radar.oreilly.com/archives/2006/03/directions_microformat_leading.html Tim O'Reilly blog post: Directions Microformat -> Google for directions?]