In the context of the Visual Studio 2010, ASP.NET 4.0, C#, .NET, ASP.NET Web Application project template (not the MVC one):
What is the significance of "hideSkiplink" css class?
In other words, there is clearly some meaning in the name, but I'm not sure what it is. Logically it sounds like this is css to style a hidden skip link. Hmmm.... that does't actually make sense. Does anyone know the reason that that particular name was
chosen? What is the purpose of this CSS class in the sample. Given that it's in the default template, I'm guessing some thought was put into it and it is an example of some sort of best practice, but I don't know what it is. I could ignore and just go on
with things, but I would like to understand its purpose.
For accessibility considerations, you want to include skip link functionality within your navigation which is what you are seeing in your code. The hideSkiplink class is generally ignored by a normal web viewer, but when using a screen reader by someone
who is visually impaired, then the hideSkiplink class would come to action allowing for the screen reader to skip the nvaigation links and go directly to the main content of the web page. Thus, you are using this to ensure that your web page/site is compliant
with various web accessibility guidelines.
Christopher Reed, MCT, MCPD, MCTS, Microsoft Specialist, MTA
"The oxen are slow, but the earth is patient."
Marked as answer by Adam Kane on Jun 06, 2010 08:41 PM
It doesn't. Note that there are two classes in the div link. I would believe that you need to see what is in the clear class first before you understand how the hideSkipLink class works.
Christopher Reed, MCT, MCPD, MCTS, Microsoft Specialist, MTA
"The oxen are slow, but the earth is patient."
Adam Kane
Member
3 Points
5 Posts
VS2010: .NET 4.0: ASP.NET Web App: hideSkipLink css class
Jun 06, 2010 04:39 PM|LINK
In the context of the Visual Studio 2010, ASP.NET 4.0, C#, .NET, ASP.NET Web Application project template (not the MVC one):
What is the significance of "hideSkiplink" css class?
In other words, there is clearly some meaning in the name, but I'm not sure what it is. Logically it sounds like this is css to style a hidden skip link. Hmmm.... that does't actually make sense. Does anyone know the reason that that particular name was chosen? What is the purpose of this CSS class in the sample. Given that it's in the default template, I'm guessing some thought was put into it and it is an example of some sort of best practice, but I don't know what it is. I could ignore and just go on with things, but I would like to understand its purpose.
<div class="clear hideSkiplink"> <asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal"> <Items> <asp:MenuItem NavigateUrl="~/Default.aspx" Text="Home"/> <asp:MenuItem NavigateUrl="~/Default.aspx" Text="Simulations"/> <asp:MenuItem NavigateUrl="~/Default.aspx" Text="Companies"/> <asp:MenuItem NavigateUrl="~/Default.aspx" Text="People"/> </Items> </asp:Menu> </div>div.hideSkiplink { background-color: #3a4f63; width:100%; }asp.net vs2010 .net4
Careed
All-Star
18764 Points
3637 Posts
Re: VS2010: .NET 4.0: ASP.NET Web App: hideSkipLink css class
Jun 06, 2010 08:07 PM|LINK
For accessibility considerations, you want to include skip link functionality within your navigation which is what you are seeing in your code. The hideSkiplink class is generally ignored by a normal web viewer, but when using a screen reader by someone who is visually impaired, then the hideSkiplink class would come to action allowing for the screen reader to skip the nvaigation links and go directly to the main content of the web page. Thus, you are using this to ensure that your web page/site is compliant with various web accessibility guidelines.
"The oxen are slow, but the earth is patient."
hc1
Member
199 Points
231 Posts
Re: VS2010: .NET 4.0: ASP.NET Web App: hideSkipLink css class
Oct 07, 2011 05:36 AM|LINK
I still do not understand. How does a background-color of #3a4f63 and width of 100% aid in the skipping of links?
Please excuse me if this is a dumb question.
Thanks.
Careed
All-Star
18764 Points
3637 Posts
Re: VS2010: .NET 4.0: ASP.NET Web App: hideSkipLink css class
Oct 07, 2011 01:25 PM|LINK
It doesn't. Note that there are two classes in the div link. I would believe that you need to see what is in the clear class first before you understand how the hideSkipLink class works.
"The oxen are slow, but the earth is patient."
hc1
Member
199 Points
231 Posts
Re: VS2010: .NET 4.0: ASP.NET Web App: hideSkipLink css class
Oct 08, 2011 03:02 PM|LINK
.clear
{
clear: both;
}
Careed
All-Star
18764 Points
3637 Posts
Re: VS2010: .NET 4.0: ASP.NET Web App: hideSkipLink css class
Oct 09, 2011 01:09 PM|LINK
The purpose of the hideSkipLink class is to make it invisible in the browser.
"The oxen are slow, but the earth is patient."