Comments on: Create an Accessible Image Based Navigation http://www.branded07.com/2010/02/25/create-an-accessible-image-based-navigation/ Online web design portfolio of Rob Palmer Sat, 04 Sep 2010 12:30:51 +0000 hourly 1 http://wordpress.org/?v=3.0.1 By: Swashata http://www.branded07.com/2010/02/25/create-an-accessible-image-based-navigation/comment-page-1/#comment-8120 Swashata Wed, 04 Aug 2010 05:32:35 +0000 http://www.branded07.com/?p=413#comment-8120 Thanks for the display and float confusion! I totally agree with the accessibility thing! I will surely change my own navigation with the position css instead of text-indent :) Thanks once again for the tutorial and your quick response! Thanks for the display and float confusion! I totally agree with the accessibility thing! I will surely change my own navigation with the position css instead of text-indent :)

Thanks once again for the tutorial and your quick response!

]]> By: Rob http://www.branded07.com/2010/02/25/create-an-accessible-image-based-navigation/comment-page-1/#comment-8095 Rob Tue, 03 Aug 2010 13:27:34 +0000 http://www.branded07.com/?p=413#comment-8095 Hi Swashata, Thanks for posting your example. I would say in response, you actually don't need to set the block element if you are floating the element left as float actually turns the element into a block element. Also the reason for not doing it your way is that if you turn images off in your browser you will not be able to see your links, hence making your navigation inaccessible. I admit, your way is much easier to implement and I myself have used this method on quite a few of my sites in the past, but it is not the best option for accessibility. Thanks again for your response! Rob. Hi Swashata,

Thanks for posting your example.

I would say in response, you actually don’t need to set the block element if you are floating the element left as float actually turns the element into a block element.

Also the reason for not doing it your way is that if you turn images off in your browser you will not be able to see your links, hence making your navigation inaccessible.

I admit, your way is much easier to implement and I myself have used this method on quite a few of my sites in the past, but it is not the best option for accessibility.

Thanks again for your response!

Rob.

]]> By: Swashata http://www.branded07.com/2010/02/25/create-an-accessible-image-based-navigation/comment-page-1/#comment-8094 Swashata Tue, 03 Aug 2010 13:06:39 +0000 http://www.branded07.com/?p=413#comment-8094 Cool Tutorial. There is another way of hiding the text: <code> #global-nav li a{ display: block; text-indent: -9999px; float: left; } </code> The text-indent does all the work! Note that we then need to display it as block as well :) Cool Tutorial. There is another way of hiding the text:

#global-nav li a{
display: block;
text-indent: -9999px;
float: left;
}

The text-indent does all the work! Note that we then need to display it as block as well :)

]]> By: veterinary technician http://www.branded07.com/2010/02/25/create-an-accessible-image-based-navigation/comment-page-1/#comment-7242 veterinary technician Tue, 29 Jun 2010 11:52:27 +0000 http://www.branded07.com/?p=413#comment-7242 found your site on del.icio.us today and really liked it.. i bookmarked it and will be back to check it out some more later found your site on del.icio.us today and really liked it.. i bookmarked it and will be back to check it out some more later

]]> By: Jeffrey.S http://www.branded07.com/2010/02/25/create-an-accessible-image-based-navigation/comment-page-1/#comment-7222 Jeffrey.S Mon, 28 Jun 2010 15:07:21 +0000 http://www.branded07.com/?p=413#comment-7222 Great tutorial, simple but beautiful css image menu, love it. Great tutorial, simple but beautiful css image menu, love it.

]]> By: Carmela Anzelmo http://www.branded07.com/2010/02/25/create-an-accessible-image-based-navigation/comment-page-1/#comment-6887 Carmela Anzelmo Tue, 15 Jun 2010 08:20:41 +0000 http://www.branded07.com/?p=413#comment-6887 Excellent tutorial, very easy to understand Excellent tutorial, very easy to understand

]]> By: Scott http://www.branded07.com/2010/02/25/create-an-accessible-image-based-navigation/comment-page-1/#comment-6450 Scott Sat, 29 May 2010 18:47:59 +0000 http://www.branded07.com/?p=413#comment-6450 Great tutorials I've been looking for something like this! Great tutorials I’ve been looking for something like this!

]]> By: J smilanic http://www.branded07.com/2010/02/25/create-an-accessible-image-based-navigation/comment-page-1/#comment-6348 J smilanic Wed, 26 May 2010 03:00:16 +0000 http://www.branded07.com/?p=413#comment-6348 Thanks for the tutorial. I absolutely love your websites and often refer to them for inspiration in designs. Thanks for the tutorial. I absolutely love your websites and often refer to them for inspiration in designs.

]]> By: Auré http://www.branded07.com/2010/02/25/create-an-accessible-image-based-navigation/comment-page-1/#comment-4813 Auré Sat, 20 Mar 2010 10:34:10 +0000 http://www.branded07.com/?p=413#comment-4813 Very clear, good article :) Very clear, good article :)

]]> By: Tommy http://www.branded07.com/2010/02/25/create-an-accessible-image-based-navigation/comment-page-1/#comment-4767 Tommy Thu, 18 Mar 2010 23:01:01 +0000 http://www.branded07.com/?p=413#comment-4767 THANKS HEAPS :D TEEEEEEEEEEEEEHEEEEEEEEEEE THANKS HEAPS :D
TEEEEEEEEEEEEEHEEEEEEEEEEE

]]>