Text Rendering in different web browsers on different platforms
-
Hi, I'm trying to truncate and add ellipsis to text that's too long to fit in a specific width (in pixels), actually I'm already done with this part but the question is, are you aware of any differences in the way web browsers render text? Are there differences when rendering text in browsers on different platforms, e.g. Windows, Mac, Linux .. etc? I made some tests using IE6 and FF2 running on Windows XP and there was no difference at all, the text width was exactly the same in both browsers (using Verdana 12px). I know about the CSS solution but I'm not willing to use it as it only works with IE, I also came across a javascript solution but I don't want to use it too (it makes some sense to save some bandwidth, why send something to the user that won't be displayed? this applies to the CSS solution too). Also, I'm not worried about users resizing the text, I'm only interested in getting this working with the *initial* font size. I'm not completely sure but I don't think there are differences between browsers working on Windows, so I'm a little worried about the other platforms more esp. Mac, if you're using Mac then I would really appreciate if you measure this text for me (in Verdana 12px): "this text is only meant for testing text rendering in different browsers" (without the quotes) Thanks for your help ...
Waleed Eissa Software Developer Sydney
-
Hi, I'm trying to truncate and add ellipsis to text that's too long to fit in a specific width (in pixels), actually I'm already done with this part but the question is, are you aware of any differences in the way web browsers render text? Are there differences when rendering text in browsers on different platforms, e.g. Windows, Mac, Linux .. etc? I made some tests using IE6 and FF2 running on Windows XP and there was no difference at all, the text width was exactly the same in both browsers (using Verdana 12px). I know about the CSS solution but I'm not willing to use it as it only works with IE, I also came across a javascript solution but I don't want to use it too (it makes some sense to save some bandwidth, why send something to the user that won't be displayed? this applies to the CSS solution too). Also, I'm not worried about users resizing the text, I'm only interested in getting this working with the *initial* font size. I'm not completely sure but I don't think there are differences between browsers working on Windows, so I'm a little worried about the other platforms more esp. Mac, if you're using Mac then I would really appreciate if you measure this text for me (in Verdana 12px): "this text is only meant for testing text rendering in different browsers" (without the quotes) Thanks for your help ...
Waleed Eissa Software Developer Sydney
There's no guarantee that a given browser will render text to a specific pixel width. If i load up your site on my phone, or using a text-only browser, or with CSS turned off, or on a system without the font you specified... then things will look different to some extent. YMMV - add all the fluff you want, but make sure there's a fallback for critical information.
----
You're right. These facts that you've laid out totally contradict the wild ramblings that I pulled off the back of cornflakes packets.
-
There's no guarantee that a given browser will render text to a specific pixel width. If i load up your site on my phone, or using a text-only browser, or with CSS turned off, or on a system without the font you specified... then things will look different to some extent. YMMV - add all the fluff you want, but make sure there's a fallback for critical information.
----
You're right. These facts that you've laid out totally contradict the wild ramblings that I pulled off the back of cornflakes packets.
Hi, thanks for your answer, actually I'm not really worried about getting this working with every single browser, I'm only concerned about getting it working in the majority of browsers, besides if things go wrong and the browser doesn't render the text the way I intend it to be, it won't be a problem, all what will happen is that the text could possibly get *wrapped*, not a big deal! it's only a cosmetic thing ... By the way, many major websites do this on the server side (truncate long text and add ellipsis), you may check yahoo answers for an example (they truncate the nicknames if they are too long) ...
Waleed Eissa Software Developer Sydney
-
Hi, thanks for your answer, actually I'm not really worried about getting this working with every single browser, I'm only concerned about getting it working in the majority of browsers, besides if things go wrong and the browser doesn't render the text the way I intend it to be, it won't be a problem, all what will happen is that the text could possibly get *wrapped*, not a big deal! it's only a cosmetic thing ... By the way, many major websites do this on the server side (truncate long text and add ellipsis), you may check yahoo answers for an example (they truncate the nicknames if they are too long) ...
Waleed Eissa Software Developer Sydney
Waleed Eissa wrote:
if things go wrong and the browser doesn't render the text the way I intend it to be, it won't be a problem, all what will happen is that the text could possibly get *wrapped*, not a big deal! it's only a cosmetic thing ...
No worries, then. :)
----
You're right. These facts that you've laid out totally contradict the wild ramblings that I pulled off the back of cornflakes packets.
-
Waleed Eissa wrote:
if things go wrong and the browser doesn't render the text the way I intend it to be, it won't be a problem, all what will happen is that the text could possibly get *wrapped*, not a big deal! it's only a cosmetic thing ...
No worries, then. :)
----
You're right. These facts that you've laid out totally contradict the wild ramblings that I pulled off the back of cornflakes packets.
Well, I probably should've thought about this before posting my question, I think browsershots.org can help with this ...
Waleed Eissa Software Developer Sydney