Jump to content


Photo

Website Accessibility


  • Please log in to reply
4 replies to this topic

#1 Barsbeh

Barsbeh

    Young Padawan

  • Members
  • Pip
  • 1 posts

Posted 26 October 2011 - 07:59 AM

Hi guys,

I'm doing a web production unit in my computing course at college, and we're starting the proper web development assignment. Throughout the website development stage, we have to consider website heuristics, things like accessibility and so forth. One of the ones I'll be doing is accessibility.

I was wondering if anyone knows where I can find a tutorial, or provide a tutorial, for resizing the text within a website, if the user has eye sight problems and so forth. I know you can do it by holding down CTRL and using the mouse wheel, but I want it done on the website, so I can show the 'A A A' thing for them to choose which size.

Any help on this would be massively appreciated :D

Thanks.

#2 ChrisChase

ChrisChase

    Young Padawan

  • Members
  • Pip
  • 7 posts

Posted 02 November 2011 - 11:03 AM

Well do you have any web development experience at all? Cuz if so then just us jQuery or start using javascript to manipulate css. This site will be helpfull http://www.w3schools.com/

#3 JimmyJames

JimmyJames

    Young Padawan

  • Members
  • Pip
  • 39 posts
  • Gender:Male
  • Location:Calgary, AB

Posted 08 January 2012 - 01:41 AM

This is an old post but I'm bored tonight and really want to see these activity around here pick up, so for anyone else who may still benefit from this...


This script is should work for any version of jQuery. This is an incredibly script, simply apply the class 'textButton' to the desired target element, and use the 'value' attribute to assign it a font-size. I chose to use EM for relative font sizing.
Place the following code in the <head> section of your website.
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){

$("button.textButton").click(function(){
  var newsize = $(this).val();
  $("*").css({'font-size' : newsize});					  //   use the " * " selector here to apply CSS rule to ALL elements on the page.
});

});
</script>



Example of applying a class and defining the desired text size.
<button class="textButton" value="0.75em">Small</button>
<button class="textButton" value="1em">Medium</button>
<button class="textButton" value="2em">Large</button>

Untested but should be close.

#4 Wybe

Wybe

    Jedi In Training

  • Members
  • PipPip
  • 401 posts
  • Gender:Male
  • Location:the Netherlands
  • Interests:I have no interests

Posted 27 October 2012 - 06:38 AM

This may be a bit late but I've been investigating a common dutch standard for accessibility, "DrempelVrij". By law, all dutch government websites are obliged to conform to this standard in it's highest degree. The documentation is quite good. If you're dutch the website www.drempelvrij.nl will tell you everything about it, if you're not, the following documents would be of particular interest to you:

Normative document in English:
http://www.drempelvr...delines_1_0.pdf

Evaluation and Sampling:
http://www.drempelvr...ampling_1_0.pdf

Informative version of the normative document, in English:
http://www.drempelvr...ion_version.pdf

Greetings from someone who hasn't posted in years

#5 dhawan12

dhawan12

    Young Padawan

  • Members
  • Pip
  • 3 posts

Posted 08 February 2013 - 06:31 AM

Really nice shared solution.Thanks for the solution.

Best photoshop tutorials

Edited by dhawan12, 09 February 2013 - 05:34 AM.





0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users