Does Microsoft Edge support aria live regions?
I tried testing it # http://accessibility.athena-ict.com/aria/examples/live3.shtml
It works fine with IE using Jaws, narrator and NVDA. But not with Edge.
If edge doesn't support aria-live, Is there any alternative to get similar behavior.
I am working on a chat application. Ans I need screen readers to read incoming messages in chat. Is there anyway to achieve it without aria-live?
Thanks
Dasari
Yes, Microsoft Edge supports ARIA live regions.
Edge does not support JAWS nor NVDA (or vice-versa, depending who you ask), so live regions will not work with either of those screen readers.
Narrator works with Edge. It is not perfect, but it is coming along. Using your demo page with Edge and Narrator, the live region worked as expected. I am using the Windows 10 Creators Update with Edge 40.15063.0.0.
From Screen readers and web browsers – what’s the best pairing for testing? at the end of March 2017:
At the moment Microsoft still recommends Narrator users in Windows 10 use Internet Explorer, but with updates to both Narrator and Edge in the insider preview of Windows 10 likely to be released later in the year. This will become an option for testing.
There are official statements, and inklings of the direction at the Microsoft User Voice forum, but now I am way beyond the scope of your question now.
Related
Due to Bootstrap upgrade, there has been lots of changes in the CSS in all pages of the web application that I'm working on. This application is also mobile optimized. So I have the task the checking the UI of all pages of our application accross most browsers - IE8,9,10,11 , chrome, firefox, ios and android devices(phone, 7 inch, 10 inch).
Right now, I'm opening the existing version(old bootstrap) and the updated version(New bootstrap) of my website in 2 tabs, and switch back and forth between them to find out any UI issues like alignment and color change and text size.
Is there a better way of doing this?
Yes there are somewhat solutions to it, which make cross-browser and multiple device testing easy. Some of them are:
Ghostlab: allows synchronized testing which means if you click or scroll in one browser it happens across all browsers. It has many other features but is only for Mac.
Grunt also allows for synchronized testing. Check this article
you can do cross browser testing within a browser using online services such as
Last thing I would mention is xip.io just check it out!!!
Chrome DevTools are awesome for this purpose. They allow you to override settings for different devices by Developer Tool>Settings>Overrides you can override following to emulate
User agents
Device metrics
Device orientation
Touch events
CSS media
I'm learning HTML and CSS. I made this site at [No longer exists, sorry. Lesson learned: post the code].
When I view the site on an iPhone or iPad, the three images on the bottom are vertically stacked. When I view the website on Chrome using the Developer Tools, or "User-Agent Switcher for Chrome" (plugin), or mobiletest.me (website), and emulate an iPhone or iPad, the images appear horizontal and perhaps squashed.
The vertical stacking is more usable anyhow, but (1) I would like to know how to reliably test my website on iPhone, iPad, etc. without a physical device, and (2) I would also like to know why these tools and services aren't consistent with the device they're emulating?
UPDATE: Actually, this answer accurately mimicked the actual device, but can you answer my second question? I would like to be able to rely on Chrome Developer Tools.
These tools are not intended to "emulate", but to merely pass the correlating user-agent string for any site that may be sniffing the user agent for any reason (conditional CSS etc.) Browserstack.com or the physical device itself is a sure way to test sites consistently, but for a cost.
I have a web audio player that uses Soundmanager2. Right now play/pause work on the lock screen and prev/next do not work. I worked on iOS 7 but I couldn't figure out why.
I see lots of talk about setting the track image and player controls in a native app, but not in an audio web app. That said I'd like to know why it quit working in iOS8 and what I can do to add a track image?
Update: Controls do not work in iOS 8, only on iOS7.
I found this on http://www.schillmania.com/projects/soundmanager2/doc/download/:
Side note: The prior release's pre-emptive fix for iOS 8 ended up being a non-issue, as the official iOS 8 release did not use "OS 10" in the user-agent string. Nonetheless, SoundManager2 will now correctly identify iOS 10+ vs. incorrectly flagging it as "iOS 1".
Since this question was asked Mar 21 '14 at 20:20, and the heading above it was
"version = "V2.97a.20150601"" (6/1/15), which means the update came after this question, and the edit, so
it should be able to work now.
I am developing website and it has to be viewed in tablet pc. Please suggest me what are things to be considered ? technology wise ?
also i need to know what are the tools i need to have to view in my intranet as well as.
A major issue: in many tablets there is no moving pointer - at least not in a fully usable form. That means that tooltips may not really work, and image maps must be really clear, since there is no highlighting until the user actually "clicks" on the link.
Well, actually that's not fully accurate - if the user drags the pointer, it should work like a regular mouse pointer. The problem is that most users avoid dragging and just tap where they want to click directly.
Best piece of advice I can offer: get an actual tablet PC and try browsing your site. Most major issues will be evident almost immediately. If you are able, get a regular tablet/pad user to beta-test your site without trying it out on a desktop PC - they would be able to see issues that you would miss due to your prior knowledge of the site.
The Tablet PC is a standard Windows machine, therefore it has the same browser support as any other Windows box. So there isn't any special technology required.
There are however some design considerations:
First, make sure your layout has plenty of empty space surrounding iterative elements. Crammed pages are tough to navigate with a stylus, and if it is one of the newer models that also support touch it is even more of an issue.
Second, most Tablet PCs are configured with the default font size set for 125%. You want to make sure that your web pages scale correctly and don't end up requiring horizontal scrolling to see the full width of the page.
A second point regarding scaling, Tablet PC supports both Landscape and Portrait modes. In other words, it can be 1024x768 OR 768x1024. You'll want to make sure that your user experience is acceptable in both modes.
One thing i can think of : there is no 'hover' on most tablets, and if it's there at all, likely nobody will see it.
Not all tablets support flash, but they do all support javascript, and Prototype.JS or jQuery will run on them in most cases
Back in the past,
i found a third party webpage that was able to capture and save images of my website in different resolutions and browsers. Of course i have no more that bookmark...
So is there any webpage or application where i can see how my webpage looks like in different resolution?
And here are the resolutions i would like to check for..
1. 1024x768 24.56%
2. 1280x800 22.06%
3. 1280x1024 13.42%
4. 1366x768 7.10%
5. 1440x900 6.68%
Perhaps you're thinking of http://browsershots.org/ ?
Note that the screen resolution of the computer running the browser is only half of the truth. If the browser isn't maximized, it will be a lot smaller than the resolution you see there, and on non-Windows operating systems (Mac OS X, Linux) it's a lot more common to run applications non maximized.
It's simply best to make sure that your site is viewable in anything from small windows (just resize your browser down) to large.
If you want to check various resolutions and browsers, then BrowserShots may have been what you came across before, give it a look.
For viewing which percentage of people sees how much of your web page:
http://browsersize.googlelabs.com/
Also: Web Developer plugin for Firefox (Resize menu).
Chrome Extension and Firefox add-on to resize your browser to various standard resolution sizes...
There is one more online tool called ScreenFly which is very good and you can even check for tablets, TVs, mobiles.. screenfly
There are many utils available for watching your website in different resolutions.
Some are installed on PC, some are online services like these:
Adobes "render browser" - you'll need to create a free Adobe account:
http://browserlab.adobe.com
Nice, but not free if you want it fast as I recall it:
http://browsershots.org/
Google - shows what part of your website is visible based on statistics from Google:
http://browsersize.googlelabs.com/
But as far as I know, todays most commonly design resolution is 1024x768, eventhough the height isnt that important because of the popular scrollwheel on most mice/pads.
If you design to design for this resolution there is a lot of design help in the "growing standard" called 960 grid, which is based upon how many professional designers build a design.
You always make an invisible "grid" and then you use the cells to arrange the contents. Much like the old "table" system, but much more focused on professional designs.
Regarding your question, the % you list, seems like you would have most use of the "Google" link above.
Lastly, always remember to test how your website looks with the most used browsers. For me those 4 will be:
Internet Explorer (latest and previous version, use more than one computer to test if you cant do a double installation of it)
Mozilla Firefox (latest and perhaps previous.. but they make less changes in the render, so latest would be ok)
Google Chrome (awesome debugging tools too, and a very stable browser)
Safari (so you make sure that you support MacOSX)
Thats my opinion.
The Multibrowserviewer is a great (paid for) tool for multi browser support, I know it's not free, bt worth looking into even just for the trial period.