<html>
My Weblog, with table trick
Today's posts
This text will be displayed first in Lynx and read first in JAWS, even
though it is visually positioned to the right of the navigation bar.
This benefits blind users, and it also benefits you, since search
engines give higher precedence to keywords that come earlier in your
page.
1. The non-tricky version of this page. Same layout.
2. The non-tricky version in Lynx. Yuck.
3. The table trick in Lynx. Much better.
Here's the basic concept. Instead of the obvious table layout:
<table>
<tr>
<td valign="top" align="left" width="25%">
... navigation bar ...
</td>
<td valign="top" align="left">
... main content ...
</td>
</tr>
</table>
Do this instead:
<table>
<tr>
<!-- spacer GIF in upper-left cell -->
<td><img src="../images/1.gif" tppabs="http://dia.z6i.org/images/1.gif" width="1" height="1" alt=""></td>
<!-- main content cell first, with rowspan=2 -->
<td valign="top" align="left" rowspan="2">
... main content ...
</td>
</tr>
<tr>
<td valign="top" align="left" width="25%">
... navigation bar ...
</td>
</tr>
</table>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam
nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat
volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation
ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse
molestie consequat, vel illum dolore eu feugiat nulla facilisis at
vero eros et accumsan et iusto odio dignissim qui blandit praesent
luptatum zzril delenit augue duis dolore te feugait nulla facilisi.
Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper
suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem
vel eum iriure dolor in hendrerit in vulputate velit esse molestie
consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et
accumsan et iusto odio dignissim qui blandit praesent luptatum zzril
delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor
sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod
tincidunt ut laoreet dolore magna aliquam erat volutpat.
Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse
molestie consequat, vel illum dolore eu feugiat nulla facilisis at
vero eros et accumsan et iusto odio dignissim qui blandit praesent
luptatum zzril delenit augue duis dolore te feugait nulla facilisi.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam
nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat
volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation
ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Site links
* Home
* Accessibility statement
* Terms of use
* Feedback
Blogroll
* Daily Zen
* Slashdot
* The Register
* MacSurfer
* Daily Python-URL
* FOS News
* Doonesbury
* The Morning News
* Gagpipe
* Sam Ruby
* Joe Gregorio
* Shirley Kaiser
* Cory Doctorow
* Zimran Ahmed
* Dorothea Salo
* Daniel Berlinger
* Jenny Levine
* Kuro5hin
* MetaFilter
* Michael Barrish
* Dean Allen
* Leslie Harpold
* Jonathon Delacour
* Robert Cringely
* Jim Byrne
* Forwarding Address: OS X
* A List Apart
* Bruce Schneier
* Netcraft
* Google Zeitgeist
* Eric Costello
* Joel Spolsky
* Shane McChesney
* Clay Shirky
* Bruce Eckel
* Eric Raymond
* Richard Stallman
* Brian Andreas
* Project Gutenberg
* Bartleby.com
* The Online Books Page
* Internet Public Library
* ibiblio
* Andamooka
在30天内打造更具亲和力的网站
需积分: 0 93 浏览量
2008-12-16
08:52:19
上传
评论
收藏 298KB RAR 举报
30天内打造更具亲和力的网站.rar （59个子文件） 
30 
day_22_using_real_lists_or_faking_them_properly.html 12KB day_1_jackie.html 6KB css 
print.css 1KB screen.css 2KB common.css 372B aural.css 242B day_6_choosing_a_doctype.html 7KB translations.html 11KB day_8_constructing_meaningful_page_titles.html 9KB day_16_not_opening_new_windows.html 9KB by_design_principle.html 7KB day_21_ignoring_spacer_images.html 7KB day_30_creating_an_accessibility_statement.html 7KB day_25_using_real_horizontal_rules_or_faking_them_properly.html 8KB day_18_giving_your_calendar_a_real_caption.html 9KB by_web_browser.html 11KB conclusion.html 5KB day_24_providing_text_equivalents_for_image_maps.html 11KB examples tabletrick.html 9KB tabletrick.txt.htm 4KB
tabletrick.txt 4KB notabletrick.html 8KB notabletrick.txt 3KB day_4_lillian.html 5KB day_27_using_real_headers.html 9KB by_disability.html 9KB day_20_providing_a_summary_for_tables.html 7KB day_17_defining_acronyms.html 10KB day_12_using_color_safely.html 7KB accessibility_statement.html 11KB translation_table.html 4KB day_28_labeling_form_elements.html 10KB day_23_providing_text_equivalents_for_images.html 11KB day_7_identifying_your_language.html 7KB day_26_using_relative_font_sizes.html 15KB table_of_contents.html 7KB day_10_presenting_your_main_content_first.html 8KB day_3_bill.html 5KB day_19_using_real_table_headers.html 12KB images 
linkcolor.gif 3KB 1.gif 43B abs_sizing_thumb.gif 10KB abs_sizing.gif 35KB rel_sizing.gif 78KB rel_sizing_thumb.gif 14KB linkcolorblind.gif 3KB introduction.html 5KB by_publishing_tool.html 9KB day_9_providing_additional_navigation_aids.html 9KB by_person.html 11KB day_11_skipping_over_navigation_links.html 8KB day_5_marcus.html 6KB index.html 6KB day_15_defining_keyboard_shortcuts.html 9KB day_14_adding_titles_to_links.html 8KB day_29_making_everything_searchable.html 10KB day_13_using_real_links.html 7KB terms_of_use.html 25KB day_2_michael.html 6KB
评论0