WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Off-list help with some CSS/Javascript questions

for

Number of posts in this thread: 6 (In chronological order)

From: Birkir R. Gunnarsson
Date: Fri, Dec 09 2011 4:21PM
Subject: Off-list help with some CSS/Javascript questions
No previous message | Next message →

Hey everyone

When I have a general and, in my estimation, informative for all,
question about accessibility, I like to post it to the list.
This list has been amazing in terms of providing information.
I am reading through books on html4/xhtml, css and Javascript to
really become a decent web accessibility tester and developer (I
started out in a bit of a pretender position because no one else would
do it, Ihave solid programming experience and a degree in comp sci,
but the web was a new world to me), but there are times I come across
something odd on a webpage, especially with regards to use of CSS, I
wouldn't mind getting some explanations on from a pro, just while I am
learning the ropes.
I was wondering if I could bounce a few questions of someone here, who
wouldn't mind giving me a few minutes of their time every now and
then, questions that would not seem to be of interest to the list as a
whole. These would be kept to a minimum.

If some of you don't mind, please drop me an email off list.
Thanks and have a good weekend everyone.
-Birkir

From: John Foliot
Date: Fri, Dec 09 2011 5:21PM
Subject: Re: Off-list help with some CSS/Javascript questions
← Previous message | Next message →

Hey Birkir,

Happy to help if I can, although I wouldn't be too quick to dismiss your
questions as being of 'little interest' to this mailing list, as often
others have thought the same question and not spoken up, or one person
raises a question and the answer informs others than the original question
poser - in other words, no question is too basic or of little interest
given the complexity and diversity of the members of this list.

That said you can ping me at = EMAIL ADDRESS REMOVED = or via twitter at @johnfoliot

Cheers!

JF

> -----Original Message-----
> From: = EMAIL ADDRESS REMOVED = [mailto:webaim-forum-
> = EMAIL ADDRESS REMOVED = ] On Behalf Of Birkir R. Gunnarsson
> Sent: Friday, December 09, 2011 3:24 PM
> To: WebAIM Discussion List
> Subject: [WebAIM] Off-list help with some CSS/Javascript questions
>
> Hey everyone
>
> When I have a general and, in my estimation, informative for all,
> question about accessibility, I like to post it to the list.
> This list has been amazing in terms of providing information.
> I am reading through books on html4/xhtml, css and Javascript to
> really become a decent web accessibility tester and developer (I
> started out in a bit of a pretender position because no one else would
> do it, Ihave solid programming experience and a degree in comp sci,
> but the web was a new world to me), but there are times I come across
> something odd on a webpage, especially with regards to use of CSS, I
> wouldn't mind getting some explanations on from a pro, just while I am
> learning the ropes.
> I was wondering if I could bounce a few questions of someone here, who
> wouldn't mind giving me a few minutes of their time every now and
> then, questions that would not seem to be of interest to the list as a
> whole. These would be kept to a minimum.
>
> If some of you don't mind, please drop me an email off list.
> Thanks and have a good weekend everyone.
> -Birkir
>

From: Birkir R. Gunnarsson
Date: Fri, Dec 09 2011 6:03PM
Subject: Re: Off-list help with some CSS/Javascript questions
← Previous message | Next message →

Thanks John, thanks all.

I'll ask the two questions I had in mind for the general interest
then, in csae someone else may benefit, at least for now.
This one is very basic (and I admit, I should just go Google for it).
When reviewing a web page, I can easily review the html code (in IE by
going to tools -> source).
How about the CSS that a webpage uses, is it easily viewable from
within IE or with some other tool (I know, this is basic, but
important to an aspiring webpage inspector)?
I see no obvious reference to the CSS in Jaws with IE (could well be
hidden in the menus or an icon somewhere).
Do I perhaps need to upgrade to Firebug or some other software to
truly inspect webpages (I tend to do somewhat waterred down webpage
inspection, as I provide free feedback for webpage developers, and do
not want to compete with companies that provide fullfledged
accessibility certifications).

The second question is directly related to this.
I am trying to understand how an image carousel at http://www.hljodbok.is works.
To a screen reader, the page displays 4 links like this
http://www.hljodbok.is/#
at the top of the page (below the title and before the first list of
choices, which is basically features products).
This is due to, I believe, CSS creating a carousel with links to
product pictures elsehwere on the page, but it obviously poses
accessibility issues, since the urls just appear by themselves with no
useful text at the top.
I need to understand this in order to recommend either hiding these
links somehow, or adding text (I don't know if they are duplicates of
item that appears in the menu below on the page).
Basically I need to adopt better ways of working and better tools so I
can perform more in-depth analysis and not just ask here when I run
into issues. :) After all that would be monopolizing the list.
I'm on my way there now, by systematically studying and testing these
things, and it is a lot of fun. :)
Thanks
-Birkir


On 12/10/11, John Foliot < = EMAIL ADDRESS REMOVED = > wrote:
> Hey Birkir,
>
> Happy to help if I can, although I wouldn't be too quick to dismiss your
> questions as being of 'little interest' to this mailing list, as often
> others have thought the same question and not spoken up, or one person
> raises a question and the answer informs others than the original question
> poser - in other words, no question is too basic or of little interest
> given the complexity and diversity of the members of this list.
>
> That said you can ping me at = EMAIL ADDRESS REMOVED = or via twitter at @johnfoliot
>
> Cheers!
>
> JF
>
>> -----Original Message-----
>> From: = EMAIL ADDRESS REMOVED = [mailto:webaim-forum-
>> = EMAIL ADDRESS REMOVED = ] On Behalf Of Birkir R. Gunnarsson
>> Sent: Friday, December 09, 2011 3:24 PM
>> To: WebAIM Discussion List
>> Subject: [WebAIM] Off-list help with some CSS/Javascript questions
>>
>> Hey everyone
>>
>> When I have a general and, in my estimation, informative for all,
>> question about accessibility, I like to post it to the list.
>> This list has been amazing in terms of providing information.
>> I am reading through books on html4/xhtml, css and Javascript to
>> really become a decent web accessibility tester and developer (I
>> started out in a bit of a pretender position because no one else would
>> do it, Ihave solid programming experience and a degree in comp sci,
>> but the web was a new world to me), but there are times I come across
>> something odd on a webpage, especially with regards to use of CSS, I
>> wouldn't mind getting some explanations on from a pro, just while I am
>> learning the ropes.
>> I was wondering if I could bounce a few questions of someone here, who
>> wouldn't mind giving me a few minutes of their time every now and
>> then, questions that would not seem to be of interest to the list as a
>> whole. These would be kept to a minimum.
>>
>> If some of you don't mind, please drop me an email off list.
>> Thanks and have a good weekend everyone.
>> -Birkir
>>

From: John Foliot
Date: Fri, Dec 09 2011 6:27PM
Subject: Re: Off-list help with some CSS/Javascript questions
← Previous message | Next message →

Birkir R. Gunnarsson wrote:
>
> I'll ask the two questions I had in mind for the general interest
> then, in csae someone else may benefit, at least for now.
> This one is very basic (and I admit, I should just go Google for it).
> When reviewing a web page, I can easily review the html code (in IE by
> going to tools -> source).
> How about the CSS that a webpage uses, is it easily viewable from
> within IE or with some other tool (I know, this is basic, but
> important to an aspiring webpage inspector)?
> I see no obvious reference to the CSS in Jaws with IE (could well be
> hidden in the menus or an icon somewhere).
> Do I perhaps need to upgrade to Firebug or some other software to
> truly inspect webpages (I tend to do somewhat waterred down webpage
> inspection, as I provide free feedback for webpage developers, and do
> not want to compete with companies that provide fullfledged
> accessibility certifications).

Birkir, I personally use the Web Developer toolbar
(http://chrispederick.com/work/web-developer/) which is available as a
plugin for both Chrome and Firefox (I use the FF version myself). It does
a good job with inspecting CSS - it allows both focused inspection of an
element, as well as a quick method of viewing associated stylesheets from
a page. There are other DOM inspection tools out there that will do
similar things (pretty much each browser has some DOM inspector)

>
> The second question is directly related to this.
> I am trying to understand how an image carousel at
> http://www.hljodbok.is works.
> To a screen reader, the page displays 4 links like this
> http://www.hljodbok.is/#
> at the top of the page (below the title and before the first list of
> choices, which is basically features products).
> This is due to, I believe, CSS creating a carousel with links to
> product pictures elsehwere on the page, but it obviously poses
> accessibility issues, since the urls just appear by themselves with no
> useful text at the top.

I don't see this on that page. All 4 images in the carousel appear to have
some alt text, even if in at least 2 instances certainly not enough alt
text. Clicking on 3 of the 4 carousel slides takes me to the same page:
http://www.hljodbok.is/vorur/, the fourth (actually 3rd of 4) goes to
http://www.hljodbok.is/vorur/nanar/?productid=f4a0a98d-b5a1-407f-9d68-e174
6cfc51f2

> I need to understand this in order to recommend either hiding these
> links somehow, or adding text (I don't know if they are duplicates of
> item that appears in the menu below on the page).
> Basically I need to adopt better ways of working and better tools so I
> can perform more in-depth analysis and not just ask here when I run
> into issues. :) After all that would be monopolizing the list.
> I'm on my way there now, by systematically studying and testing these
> things, and it is a lot of fun. :)
> Thanks

Pretty hard to monopolize this list - the point is that it exists as a
resource. The only downside is that sometimes you won't get an answer to
your question. I can't wee the problem on the homepage you are talking
about here, so I don't know what to answer you.

HTH

JF

From: John E Brandt
Date: Fri, Dec 09 2011 7:00PM
Subject: Re: Off-list help with some CSS/Javascript questions
← Previous message | Next message →

I use the Firefox plugin, Firebug for CSS review.

http://getfirebug.com/

~j


John E. Brandt
www.jebswebs.com
= EMAIL ADDRESS REMOVED =
207-622-7937
Augusta, Maine, USA

-----Original Message-----
From: = EMAIL ADDRESS REMOVED =
[mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Birkir R.
Gunnarsson
Sent: Friday, December 09, 2011 8:05 PM
To: WebAIM Discussion List
Subject: Re: [WebAIM] Off-list help with some CSS/Javascript questions

Thanks John, thanks all.

I'll ask the two questions I had in mind for the general interest then, in
csae someone else may benefit, at least for now.
This one is very basic (and I admit, I should just go Google for it).
When reviewing a web page, I can easily review the html code (in IE by going
to tools -> source).
How about the CSS that a webpage uses, is it easily viewable from within IE
or with some other tool (I know, this is basic, but important to an aspiring
webpage inspector)?
I see no obvious reference to the CSS in Jaws with IE (could well be hidden
in the menus or an icon somewhere).
Do I perhaps need to upgrade to Firebug or some other software to truly
inspect webpages (I tend to do somewhat waterred down webpage inspection, as
I provide free feedback for webpage developers, and do not want to compete
with companies that provide fullfledged accessibility certifications).

The second question is directly related to this.
I am trying to understand how an image carousel at http://www.hljodbok.is
works.
To a screen reader, the page displays 4 links like this
http://www.hljodbok.is/# at the top of the page (below the title and before
the first list of choices, which is basically features products).
This is due to, I believe, CSS creating a carousel with links to product
pictures elsehwere on the page, but it obviously poses accessibility issues,
since the urls just appear by themselves with no useful text at the top.
I need to understand this in order to recommend either hiding these links
somehow, or adding text (I don't know if they are duplicates of item that
appears in the menu below on the page).
Basically I need to adopt better ways of working and better tools so I can
perform more in-depth analysis and not just ask here when I run into issues.
:) After all that would be monopolizing the list.
I'm on my way there now, by systematically studying and testing these
things, and it is a lot of fun. :) Thanks -Birkir


On 12/10/11, John Foliot < = EMAIL ADDRESS REMOVED = > wrote:
> Hey Birkir,
>
> Happy to help if I can, although I wouldn't be too quick to dismiss
> your questions as being of 'little interest' to this mailing list, as
> often others have thought the same question and not spoken up, or one
> person raises a question and the answer informs others than the
> original question poser - in other words, no question is too basic or
> of little interest given the complexity and diversity of the members of
this list.
>
> That said you can ping me at = EMAIL ADDRESS REMOVED = or via twitter at
> @johnfoliot
>
> Cheers!
>
> JF
>
>> -----Original Message-----
>> From: = EMAIL ADDRESS REMOVED = [mailto:webaim-forum-
>> = EMAIL ADDRESS REMOVED = ] On Behalf Of Birkir R. Gunnarsson
>> Sent: Friday, December 09, 2011 3:24 PM
>> To: WebAIM Discussion List
>> Subject: [WebAIM] Off-list help with some CSS/Javascript questions
>>
>> Hey everyone
>>
>> When I have a general and, in my estimation, informative for all,
>> question about accessibility, I like to post it to the list.
>> This list has been amazing in terms of providing information.
>> I am reading through books on html4/xhtml, css and Javascript to
>> really become a decent web accessibility tester and developer (I
>> started out in a bit of a pretender position because no one else
>> would do it, Ihave solid programming experience and a degree in comp
>> sci, but the web was a new world to me), but there are times I come
>> across something odd on a webpage, especially with regards to use of
>> CSS, I wouldn't mind getting some explanations on from a pro, just
>> while I am learning the ropes.
>> I was wondering if I could bounce a few questions of someone here,
>> who wouldn't mind giving me a few minutes of their time every now and
>> then, questions that would not seem to be of interest to the list as
>> a whole. These would be kept to a minimum.
>>
>> If some of you don't mind, please drop me an email off list.
>> Thanks and have a good weekend everyone.
>> -Birkir
>>

From: Ryan E. Benson
Date: Sat, Dec 10 2011 5:57PM
Subject: Re: Off-list help with some CSS/Javascript questions
← Previous message | No next message

Hi Birkir,

> How about the CSS that a webpage uses, is it easily viewable from
> within IE or with some other tool (I know, this is basic, but
> important to an aspiring webpage inspector)?
If you are stuck in the IE world, press F12. I know it is in IE8 & 9,
not sure if it is in IE7. It is pretty handy, a more developer focused
source (like firebug), shows you what CSS the current element is using
(like firebug), a tab for HTML, CSS, and Scripts. There is some other
handy things in there too.
--
Ryan E. Benson



On Fri, Dec 9, 2011 at 8:05 PM, Birkir R. Gunnarsson
< = EMAIL ADDRESS REMOVED = > wrote:
> Thanks John, thanks all.
>
> I'll ask the two questions I had in mind for the general interest
> then, in csae someone else may benefit, at least for now.
> This one is very basic (and I admit, I should just go Google for it).
> When reviewing a web page, I can easily review the html code (in IE by
> going to tools ->  source).
> How about the CSS that a webpage uses, is it easily viewable from
> within IE or with some other tool (I know, this is basic, but
> important to an aspiring webpage inspector)?
> I see no obvious reference to the CSS in Jaws with IE (could well be
> hidden in the menus or an icon somewhere).
> Do I perhaps need to upgrade to Firebug or some other software to
> truly inspect webpages (I tend to do somewhat waterred down webpage
> inspection, as I provide free feedback for webpage developers, and do
> not want to compete with companies that provide fullfledged
> accessibility certifications).
>
> The second question is directly related to this.
> I am trying to understand how an image carousel at http://www.hljodbok.is works.
> To a screen reader, the page displays 4 links like this
> http://www.hljodbok.is/#
> at the top of the page (below the title and before the first list of
> choices, which is basically features products).
> This is due to, I believe, CSS creating a carousel with links to
> product  pictures elsehwere on the page, but it obviously poses
> accessibility issues, since the urls just appear by themselves with no
> useful text at the top.
> I need to understand this in order to recommend either hiding these
> links somehow, or adding text (I don't know if they are duplicates of
> item that appears in the menu below on the page).
> Basically I need to adopt better ways of working and better tools so I
> can perform more in-depth analysis and not just ask here when I run
> into issues. :) After all that would be monopolizing the list.
> I'm on my way there now, by systematically studying and testing these
> things, and it is a lot of fun. :)
> Thanks
> -Birkir
>
>
> On 12/10/11, John Foliot < = EMAIL ADDRESS REMOVED = > wrote:
>> Hey Birkir,
>>
>> Happy to help if I can, although I wouldn't be too quick to dismiss your
>> questions as being of 'little interest' to this mailing list, as often
>> others have thought the same question and not spoken up, or one person
>> raises a question and the answer informs others than the original question
>> poser - in other words, no question is too basic or of little interest
>> given the complexity and diversity of the members of this list.
>>
>> That said you can ping me at = EMAIL ADDRESS REMOVED = or via twitter at @johnfoliot
>>
>> Cheers!
>>
>> JF
>>
>>> -----Original Message-----
>>> From: = EMAIL ADDRESS REMOVED = [mailto:webaim-forum-
>>> = EMAIL ADDRESS REMOVED = ] On Behalf Of Birkir R. Gunnarsson
>>> Sent: Friday, December 09, 2011 3:24 PM
>>> To: WebAIM Discussion List
>>> Subject: [WebAIM] Off-list help with some CSS/Javascript questions
>>>
>>> Hey everyone
>>>
>>> When I have a general and, in my estimation, informative for all,
>>> question about accessibility, I like to post it to the list.
>>> This list has been amazing in terms of providing information.
>>> I am reading through books on html4/xhtml, css and Javascript to
>>> really become a decent web accessibility tester and developer (I
>>> started out in a bit of a pretender position because no one else would
>>> do it, Ihave solid programming experience and a degree in comp sci,
>>> but the web was a new world to me), but there are times I come across
>>> something odd on a webpage, especially with regards to use of CSS, I
>>> wouldn't mind getting some explanations on from a pro, just while I am
>>> learning the ropes.
>>> I was wondering if I could bounce a few questions of someone here, who
>>> wouldn't mind giving me a few minutes of their time every now and
>>> then, questions that would not seem to be of interest to the list as a
>>> whole. These would be kept to a minimum.
>>>
>>> If some of you don't mind, please drop me an email off list.
>>> Thanks and have a good weekend everyone.
>>> -Birkir
>>>