I’ve read through a couple of previous threads on the subject of text going a little haywire on some Android devices - adding a blank GIF etc - but, to be honest, I didn’t fully understand them. Could someone talk me through it in basic terms?!
The virtual machine listed above will give you a pretty accurate idea of how an Android tablet will render your site;
The biggest issue I think you have with the current page construction is that all of the items are absolutely positioned on the page. In other words they are all layers. Increase the text size using your browser and you’ll see that the text panels overlap each other as the font size grows. On my Android phone I can see that the text is being rendered slightly larger than on my Mac which is causing some of the text to overflow the parent boxes. Ideally you’ll want to make sure that the layout remains intact when the text is scaled which means switching to either a layer-less (table-based) or inline (sometimes called inflow or box model) construction. Either of these will ensure that the page design holds together when the text is zoomed.
Take a look at the Relative Page Layout Action (a core Action) as this may convert your layered page into an inline construction easily.
Regards,
Tim.
On 18 Feb 2014, at 20:07, gavtro wrote:
On Extras | Jane McIntyre it’s text boxes ‘HelloText’ and ‘Item 10’ that are not displaying correctly.
Always did wonder how accurate BrowserStack is; does your comment apply to desktop browsers viewed through it too? Do you recommend anything in its place?
Having spoken to the client, who isn’t tech-savvy, she was using Samsung’s own browser to surf the web; as you say, it’s fine in Chrome and Opera.
I really do need to take the plunge and teach myself the box model method; I’m sure it’s not as scary as it looks!
Have tried, briefly this morning, the RPL action and it does seem to work on most of my recent sites (although when I add it to Jane’s pages, I get the word ‘undefined’ in the top left… although the action itself seems to work fine. Any ideas?).
Did something slightly change between FW 5 and 6 because I notice that the text overflow wasn’t such an issue with my earlier sites? Maybe I was just lucky!
Always did wonder how accurate BrowserStack is; does your comment apply to desktop browsers viewed through it too? Do you recommend anything in its place?
Most browser testing services like this use browsers embedded in virtual servers which are sent a request to render a page, take a screen shot and return the image to the user. BrowserStack is using an emulator for Android mobile which will give you an impression of what the page will look like on the device but since it isn’t actually the device it can only approximate the result. Nothing beats getting hold of an actual device (beg, borrow or steal) to test your sites on although you may find other testing services actually farm the work out to real Android devices.
Having spoken to the client, who isn’t tech-savvy, she was using Samsung’s own browser to surf the web; as you say, it’s fine in Chrome and Opera.
I really do need to take the plunge and teach myself the box model method; I’m sure it’s not as scary as it looks!
Give it a go. Thomas’ screen casts are worth their weight in gold; http://kimmich-dm.de/wordpress/?cat=10
Have tried, briefly this morning, the RPL action and it does seem to work on most of my recent sites (although when I add it to Jane’s pages, I get the word ‘undefined’ in the top left… although the action itself seems to work fine. Any ideas?).
That sounds like a bug that was fixed in the Action for Freeway Pro 6.1.1; http://freewaytalk.net/thread/view/137627
Did something slightly change between FW 5 and 6 because I notice that the text overflow wasn’t such an issue with my earlier sites? Maybe I was just lucky!
Maybe. A LOT changed between 5 and 6 but nothing I can think of that would have any bearing on these issues.
Regards,
Tim.