Free tools for section 508

Free tools for those, who design gov websites.
Constructing a new www.srtr.gov site, I found some very useful tools to satisfy all requirements of sections 508. After you wrote a code, please use these tools to check if your code satisfies section 508.
Here they're:
1. Fangs - the screen reader emulator
2. Exclusively helpful site with a lot of free tools Illinois Center for Information Technology and Web Accessibility
3. Powermapper section 508 Accessibility testing Tool
4. Tools on WebAim site

Panel

Panel

Today I used for first time a panel. I have to "hide and show" some parts of my master-page. Usually developers construct 2 different master pages. I decided to have one and implement the panels. Here's my code:

HTML-page with 2 panels (code segment)

<asp:Panel ID="PanelBreadCrumb" runat="server">
<div id="breadcrumbDiv" class="breadcrumb">
<asp:SiteMapPath ID="SiteMapPath1" runat="server" PathSeparator=" > " SiteMapProvider="Breadcrumb">
<CurrentNodeStyle Font-Bold="True" />
</asp:SiteMapPath>
</div>
</asp:Panel>

<asp:Panel ID="PanelRightSide" runat="server">
<td class="rightColumn2" valign="top">
<div style="padding: 10px;">
<ul class="ul_rightCol">
<li class="bullets">
<asp:HyperLink ID="Hyperlink2" runat="server" NavigateUrl="http://www.sample1.html"
Target="_blank" AccessKey="a">Sample1</asp:HyperLink></li>
<li class="bullets">
<asp:HyperLink ID="hypRates" runat="server" NavigateUrl="http://www.sample2.htm"
AccessKey="1" Target="_blank">Sample2</asp:HyperLink></li>
<li class="bullets">
<asp:HyperLink ID="hypChapter" runat="server" NavigateUrl="http://www.sample3.htm"
Target="_blank" AccessKey="2">Sample3</asp:HyperLink>
</li>
<li class="bullets">
<asp:HyperLink ID="hypData" runat="server" NavigateUrl="http://www.sample4.htm"
Target="_blank" AccessKey="3">Sample4</asp:HyperLink>
</li>
</ul>
</div>
</asp>


Code behind in VB.NET on Page Load: (code segment)

Dim PanelBC As Panel
PanelBC = CType(Master.FindControl("PanelBreadCrumb"), Panel)
PanelBC.Visible = False

Dim PanelRS As Panel
PanelRS = CType(Master.FindControl("PanelRightSide"), Panel)
PanelRS.Visible = True

This trick is a quite comfortable to use and reuse one master page for different layout through the same site. I hope to use the trick more and more.

Div Align With CSS

Creating a nice look for section 508-complaint site, I found I need some ideas how to place my div (s) on a page. Researching the topic I found an interesting posting about it:
"When playing with custom web designs, or off the shelf templates, the most common CSS work involves changing the margin, padding, color and background of HTML elements. I usually also usually align elements either to the left, right, or center using CSS.
To get started with code samples, to center a div in the middle of a container div you can use the following CSS:

.center {   margin-left: auto;   margin-right: auto; } 

If you want to align a div to the right and another div opposite to the first on the left you can use the following CSS classes.

.right {   float: right; } .left {    float: left; } 

I have found that when I used both div that float both to the right and left that you have to follow that with an empty div that clears, or resets, the float CSS property. If I don't clear the float property other elements such as a menu that is aligned to the right might not render correctly. Here is the CSS class to clear the float property, use it in a div the divs that have been aligned to the right, left, or both right and left.

.clear {   clear: both; }" 

The advice came from http://juixe.com/techknow/index.php/2007/01/14/div-align-with-css/

Accesskey and section 508

How different browsers handle the above accessKey letters for button and anchor elements

Browser	Operating System	Key Combination	Button Behavior	Anchor Behavior
Chrome 7.0.517.41	Linux	Alt + letter	Clicks the button (3)	Clicks the anchor (3)
Chrome 7.0.517.41	Mac OS X	Control + Option + letter	Clicks the button (3)	Clicks the anchor (3)
Chrome 7.0.517.41	Windows	Alt + letter	Clicks the button (3)	Clicks the anchor (3)
Firefox 1.5	Windows	Alt + letter	Clicks the button (1)	Unknown
Firefox 2	Linux	Alt + Shift + letter	Clicks the button (1)	Clicks the anchor
Firefox 2	Mac OS X	Control + letter	Clicks the button (1)	Clicks the anchor
Firefox 2	Windows	Alt + Shift + letter	Clicks the button (1)	Unknown
Firefox 3	Linux	Alt + Shift + letter	Clicks the button (1)	Clicks the anchor
Firefox 3	Mac OS X	Control + letter	Clicks the button (1)	Clicks the anchor
Firefox 3	Windows	Alt + Shift + letter	Clicks the button (1)	Clicks the anchor
Internet Explorer 6	Windows	Alt + letter	Sets focus on the button (2)	Unknown
Internet Explorer 7	Windows	Alt + letter	Sets focus on the button (2)	Sets focus on the anchor (2)
Internet Explorer 8	Windows	Alt + letter	Clicks the button (3)	Sets focus on the anchor (2)
Internet Explorer 9 (beta)	Windows	Alt + letter	Clicks the button (3)	Sets focus on the anchor (2)
Safari 3.1.2	Mac OS X	Control + Option + letter	Clicks the button (3)	Clicks the anchor (3)
Safari 3.1.2	Windows	Alt + letter	Clicks the button (3)	Clicks the anchor (3)
Safari 5.0.2	Mac OS X	Control + Option + letter	Clicks the button (3)	Clicks the anchor (3)
Safari 5.0.2	Windows	Alt + letter	Clicks the button (3)	Clicks the anchor (3)

•Red = Different behavior for buttons and anchors
•Comment 1 = To just set focus on the button/anchor, change your about:config setting for the “accessibility.accesskeycausesactivation” user preference.
•Comment 2 = Press Enter to click the button/anchor
•Comment 3 = There appears to be no built-in mechanism to just set focus on the button/anchor. The component handling the click event would be responsible for setting focus while handling the click.

The data comes from http://formattc.wordpress.com/2010/11/03/browsers-and-the-html-accesskey/ this table was really helpful to build my own system of accesskeys.

CSS layout generator

Nowadays we can create css layout online. I was pleasantly surprised when I found these tools online. I just Googled "css layout generator" and found CSS layout generator In a minute, I generated HTML-page with CSS-file attached. It really speed up my work on new section 508-compalaint template for SRTR. I recreated the template in just 30-40 minutes. Now I have to create the actual pages for new and improved www.srtr.org site. Meanwhile I will be working on archive presentations for USRDS.

I'm continuing to write in a 2 weeks. Actually the template I created using layout generator did not work out for me. I needed to create something more advance and look alike present site. I had to throw away the template and create completely new one which will work better with current design. I proudly have done this. Actually I found another interesting thing that generated by layout generator template did not work out in Microsoft Visual Studio 2010. The template created a lot of problems with page maintenance. It's one more reason I came out with my own master page.

RenderingMode in Menu

RenderingMode in Menu (ASP.NET 4.0)
I found some problems implementing ItemWrap for Menu in ASP.NET 4.0 Since RenderingMode is a List in default, it is not wrapping the text. I tried numerous ways, none of them does not work. It's quite interesting that the same code works just fine for ASP.NET 3.5. Truthly speaking, I did not know what to do to and how to fix the problem. Of course, I googled Internet, but did not find something useful. I even tried the Microsoft's code with sample of the menu with ItemWrap. Still does not work.
Finally, I tried to change the RenderingMode to Table. It works for me. My text was compeletely wrapped. Now my problem is solved. Remember, if itemwrap does not work as a list, try renderingmode is a table. It should work.

SRTR.org and section 508

I started a new project for www.srtr.org moving toward new HTML5 and section 508 website. First of all, I'm going through 508-standards documents and some PowerPoint presentations presented by hrsa.gov. Went to Internet trying to find some interesting sites which talk about benefits of section 508. Found some of them. Here they are:

http://www.ada.gov/websites2.htm

http://www.usweb.com/internet-marketing-firm/XCO/benefits_of_section_508_compliance.htm

My first step is reading of all papers and talking to editors and writers