I am new to both responsive design and accessibility design.
I was previewing my module to view the slides from desktop to smartphone. Closed Captioning was on.
When viewing the slide from desktop to smartphone it appears that the closed captioning is not responsive and is moving on to the lower navigation bar. See attachment for visual.
Thanks in advance for your help! 🙂
Please can you insert the screenshot? I don't download attachments for security (and time) reasons.
CC is part of the skin, it is normally indeed near the playbar.
I don't think this is a skin issue as no skin is used. I used custom buttons. They do work and you can toggle CC on and off.
This is how the CC views in desktop view
I told CC was part of the skin. It looks like your CC is overlaying the custom buttons. How did you set up the fluid boxes who contain those custom buttonos (I don't see the CC toggle button?
CC toggle upper left CC in the circle.
Here are two more pics. 1st is the fluid box and second the layout for the CC settings.
As Lieve pointed out, if you are seeing Closed Captions in a Captivate module then the skin has to be working to at least that extent. You have to turn on the Skin Editor to even configure the Closed Caption area, otherwise you cannot get to it. Then, even though you turn the Skin OFF again, the Closed Captions will still work.
You can try adjusting the percentages for the display area of the Closed Captioning so that it mirrors the positioning of the Fluid Box you have allowed for it. But even then, trying to get a layout like yours to work across all devices and orientations is unlikely to be possible unless you reduce the amount of text that appears inside the Closed Captioning so that even when it IS shown on a mobile phone held vertically there are no more than two lines of text to accommodate.
If you do NOT need to support Portrait orientation on mobile phones, that would make your life a lot easier because your first screenshot (where you show the problem) indicates that the issue is worst when on a portrait mobile phone, right? So, either ditch the Portrait view, or reduce the text amount.
One other tip. You currently have your Closed Caption text aligned to be at the top of the text area and flow downwards. If you MUST have your playbar controls underneath the Closed Captioning, set the text to be at the bottom of its fluid box and flow upwards instead so that it flows away from the controls rather than over the top of them.
Thanks for your feedback. I will try to work through your guidance. Crossing fingers.
I started to read through your comments.
1. When originally designing I thought I did set the CC to the fluid box. as you see in the graphics above the CC box was placed within the fluid box... or did I do something wrong I am not aware of.
2. How do you turn off CC for smartphones, while keeping it for everything else?
3. I don't have to have the playbar under the closed captioning. Is it best practice to place the closed captioning under the playbar or is this subjective? I am just curious .... part of my learning process 🙂
4. I did not know that "set the text to be at the bottom of its fluid box and flow upwards instead so that it flows away from the controls rather than over the top of them." was an option ... I will look into that next.
You cannot put the CC text INSIDE a Fluid Box. All you can do is place a Fluid Box on the screen at the location where the Closed Captioning will appear so that you are effectively 'making room' for the captions. The CC text is actually floating over the top of the fluid box area because the Captivate Skin is a totally separate component.
I would suggest you allow the learner to decide whether or not they want the CC text to appear rather than arbitrarily turning it off for Smart Phones. On a recent project for a client where all users would be viewing the content on Smart Phones in Portrait orientation, we were quite surprised to find that most users WANTED the CC turned on by default. By all means provide a menu option that allows them to turn it off, but I still think you need to give control to the learner. If you were worried about the amount of room the CC takes up, you probably should be using portrait view for mobile phones.
On mobile phones I do not use the playbar. The playbar buttons still have to be big enough to be usable but in my view there really isn't enough room for everything.