RE: [WSG] Relative Fonts
OK - so is there a formula to work out PX to EM ? (at least on a vanilla type of setup). In theory, on the standard browser ;-(IE6 on windows) the default font size is 12 pixels so in that case 1em = 12 pixels. Or it should be until you start playing with it with font-size=76%. But for some reason using font-size=76% 1em = 12px and 60em = 720px with text-size medium. If you use text-size smallest 1em = 9px and text-size largest 1em = 18px. And I am not sure what you were saying in the line that had (60em) in it. I use a container div 60em wide to hold all my content. That way no content is wider than 60ems 720px. Max size for a 800 by 600 screen at text size medium.. On the JavaScript front. that is something I want to avoid. I was not even sure I could play around with the font size in JavaScript - but I would not consider this to be standard. Just playing with the style font-size in the body tag. Try and finish this later got a couple of nasty problems to solve. Nick * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] Relative Fonts
Relative font sizes ruin good design. Vector based graphics and text are the future of good screen design. The whole point is to be relative in your units so the layout design can look the same across different resolutions. If a user needs to increase or decrease the text size then the layout should increase or decrease proportionally. Now that is truly good design. Flash does this now and it can be using standards based CSS too. It's just a lot harder. Think about it. Leo * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] Relative Fonts (Out of office)
Sorry, I'm away Thurs AM for study. I will read your email when I return. For urgent queries or intranet help please contact Marion on 02 9230 8542 or [EMAIL PROTECTED] Many thanks, Leon Wild. [EMAIL PROTECTED] 04/07/04 17:38 Relative font sizes ruin good design. Vector based graphics and text are the future of good screen design. The whole point is to be relative in your units so the layout design can look the same across different resolutions. If a user needs to increase or decrease the text size then the layout should increase or decrease proportionally. Now that is truly good design. Flash does this now and it can be using standards based CSS too. It's just a lot harder. Think about it. Leo * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help * * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] Relative Fonts
The whole point is to be relative in your units so the layout design can look the same across different resolutions. Yes - I know the reasons behind it. And I spend way too much time thinking about it now and dont see any clear pathways to a sensible outcome. Hence why I am bringing it to a wider group. It is the current implementations of it all that I am critical of. And until my images scale flawlessly as well (because someone with a sight impairment is going to have as much trouble seeing my images as they are my text) it all seems a little bit of a hack to me. It makes more sense to produce my design so it works and then encourage the use of the accessibility options in an OS (like magnifier software, screen readers, etc.) than to have a browser botch up the job of scaling my design. Flash isn't CSS and XHTML and it isn't a browser. And you don't have to think in relative font sizes when you create a Flash movie. It just sizes itself - because the whole environment is vector based. To achieve that in a HTML type environment we really should all move to SVG or even VML (or some other more palatable version of vector based markup). In any case, relative font sizes are not vector based - only the technology to scale the fonts themselves is (assuming the fonts being used are vector based fonts - e.g. True Type, etc.). I have been running around on a number of sites - sizing them up and down - and am disappointed by what I see. Can anyone point me to some sites that maintain a sensible CSS/XHTML design (with mutiple columns - both fixed and fluid - and images and banners and footers) that scale correctly when sized in a Browser using the browsers scaling and dont go all wonky? I don't want to rip off their designs - I want to absorb their techniques. If I am going to do this thing with scalable, relative fonts, etc. I want to do it properly. At the moment I feel that all the efforts I am expending are really being wasted. I love all the kewl techniques that I see on sites like CSS Zen Garden, Max Design, Man In Blue, etc. But in many cases function loses out over form (e.g. Zen Garden is wonderful, but the sites I have to build need more function than form, they are full of figures and tables and graphs, and that is where I find the brick wall gets more solid). Gary Menzel Web Development Manager IT Operations Brisbane -+- ABN AMRO Morgans Limited Level 29, 123 Eagle Street BRISBANE QLD 4000 PH: 07 333 44 828 FX: 07 3834 0828 To unsubscribe from this email please forward this email to: [EMAIL PROTECTED] If this communication is not intended for you and you are not an authorised recipient of this email you are prohibited by law from dealing with or relying on the email or any file attachments. This prohibition includes reading, printing, copying, re-transmitting, disseminating, storing or in any other way dealing or acting in reliance on the information. If you have received this email in error, we request you contact ABN AMRO Morgans Limited immediately by returning the email to [EMAIL PROTECTED] and destroy the original. We will refund any reasonable costs associated with notifying ABN AMRO Morgans. This email is confidential and may contain privileged client information. ABN AMRO Morgans has taken reasonable steps to ensure the accuracy and integrity of all its communications, including electronic communications, but accepts no liability for materials transmitted. Materials may also be transmitted without the knowledge of ABN AMRO Morgans. ABN AMRO Morgans Limited its directors and employees do not accept liability for the results of any actions taken or not on the basis of the information in this report. ABN AMRO Morgans Limited and its associates hold or may hold securities in the companies/trusts mentioned herein. Any recommendation is made on the basis of our research of the investment and may not suit the specific requirements of clients. Assessments of suitability to an individual?s portfolio can only be made after an examination of the particular client?s investments, financial circumstances and requirements. ABN AMRO Morgans Limited (ABN 49 010 669 726 AFSL 235410) A Participant of ASX Group * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] Relative Fonts
Nick Cowie wrote: Gary Menzel wrote: OK - so is there a formula to work out PX to EM ? (at least on a vanilla type of setup). In theory, on the standard browser ;-(IE6 on windows) the default font size is 12 pixels so in that case 1em = 12 pixels. No, the default on windoze is 12pt. Big difference, as at the default 96 DPI, 12pt = 16px = 1.0em. Here's all the IE6 standards mode sizes: http://members.ij.net/mrmazda/auth/absolute-sizes-IE6.html and here's is IE6 quirks mode, as well as IE4Win IE5Win http://members.ij.net/mrmazda/auth/absolute-sizes-IE5.html. -- Each one should use whatever gift he has received to serve others... 1 Peter 4:10 NIV Team OS/2 ** Reg. Linux User #211409 Felix Miata *** http://members.ij.net/mrmazda/auth/ * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] Relative Fonts
Hi Gary * Understand your plite, its what we all face every day, one day it will all be easy. Every browser will render STANDARD code be it HTML, XHTML, CSS in the same way on any platform. They will even execute JavaDcript in the same way and follow the same DOM. Then again they may not! Gary G * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
Re: [WSG] Relative Fonts
Given the ignorance of some of your users, I'd assume they were using IE. But remember, there's no such thing as fixed font design anymore. Mozilla, Safari et al all resize fonts irrespective of units. -- Cameron Adams W: www.themaninblue.com --- Gary Menzel [EMAIL PROTECTED] wrote: I don't consider myself a guru on web standards (specifically XHTML/CSS) but am learning and getting better. I like standards. I dont like how they aren't uniformly supported (and am not really concerned about getting into another Browser Wars thread). But I am having some issues with Relative Fonts (you know the EM's). I understand them. Know why it is good to use them. And have built the templates (header/footer wrappers) for our site with EM's. There are issues though * Embedded WYSIWYG editors are still very immature when it comes to XHTML and CSS (our CMS lets us plug in lots of editors but most of them lack something in some way or other) so enforcing the use of EM's is flawed (at best). Some of the editors support the use of stylesheets and I suppose that is a path I could go down - but fully compliant XHTML is still difficult given that most editors still allow hand editing (and you do still need that because the HTML world is not perfect). Some of it may size - some of it may not. * Lots of people out there don't even know their Browser has the ability to control font size in a relative way. So when we launched our new site we had HUNDREDS (not exagerating - they are all logged) of complaints about the font size being too small or too big because they did not have their font size set to medium (and there doesn't appear to be a way to detect what the setting is - probably because it is not standard). And, if you have a mouse with a scroll wheel, it is very easy for the size to change when you are on a fixed size page and not realise it. * Some (more likely than less) designs just CANNOT be implemented using only relative fonts. Say you want to have a fixed 200px wide column on the right hand side and a stretchy column in the middle. The content on the right hand side HAS to be designed to look right in that 200px space. So that means you cannot really use relative font sizes if you are filling the 200px space. If they size it up - it wont fit and will look stupid. So this then defeats the purpose of using relative fonts at all - because, when they DO upsize the font, part of the page will size and part of it wont. Just go to some of the well known CSS/XHTML standards-based sites (wont mention any names) and you will find that not every part of the page sizes - but is this right? What if the bit that is too small for my eyes (e.g. the Menu) is the bit that the designer has in a fixed font ? Lots of reasons to go back to fixed point sizes. So - what does everyone do? As I said, I know how EM's work, what they are for, why you would use them and am not asking about that - but I am just about ready to go back to fixed point sizes. I always thought I was just a tech head programmer but the designer in me is coming out and the aesthetics of sites are starting to assert themselves rather strongly. Relative font sizes ruin good design. Gary Menzel Web Development Manager IT Operations Brisbane -+- ABN AMRO Morgans Limited Level 29, 123 Eagle Street BRISBANE QLD 4000 PH: 07 333 44 828 FX: 07 3834 0828 To unsubscribe from this email please forward this email to: [EMAIL PROTECTED] If this communication is not intended for you and you are not an authorised recipient of this email you are prohibited by law from dealing with or relying on the email or any file attachments. This prohibition includes reading, printing, copying, re-transmitting, disseminating, storing or in any other way dealing or acting in reliance on the information. If you have received this email in error, we request you contact ABN AMRO Morgans Limited immediately by returning the email to [EMAIL PROTECTED] and destroy the original. We will refund any reasonable costs associated with notifying ABN AMRO Morgans. This email is confidential and may contain privileged client information. ABN AMRO Morgans has taken reasonable steps to ensure the accuracy and integrity of all its communications, including electronic communications, but accepts no liability for materials transmitted. Materials may also be transmitted without the knowledge of ABN AMRO Morgans. ABN AMRO Morgans Limited its directors and employees do not accept liability for the results of any actions taken or not on the basis of the information in this report. ABN AMRO Morgans Limited and its associates hold or may hold securities in the companies/trusts mentioned herein. Any recommendation is made on the basis of our research of the investment and may not suit the specific requirements of clients. Assessments of
RE: [WSG] Relative Fonts
There are issues though * Embedded WYSIWYG editors are still very immature when it comes to XHTML and CSS (our CMS lets us plug in lots of editors but most of them lack something in some way or other) so enforcing the use of EM's is flawed (at best). Some of the editors support the use of stylesheets and I suppose that is a path I could go down - but fully compliant XHTML is still difficult given that most editors still allow hand editing (and you do still need that because the HTML world is not perfect). Some of it may size - some of it may not. Totally agree. I usually opt for a separate WYSIWYG stylesheet for the editor using fixed pixel font sizes (if supported), or, in the case of ShadoMX (which uses a JavaScript/DOM based editor by default), I'll detect edit mode, wrap the editor in a DIV and have defined rules for all html elements within that div. Not pretty (as you end up with a massive CSS file) but it works. * Lots of people out there don't even know their Browser has the ability to control font size in a relative way. So when we launched our new site we had HUNDREDS (not exagerating - they are all logged) of complaints about the font size being too small or too big because they did not have their font size set to medium (and there doesn't appear to be a way to detect what the setting is - probably because it is not standard). And, if you have a mouse with a scroll wheel, it is very easy for the size to change when you are on a fixed size page and not realise it. Put it into perspective. You *slightly* inconvenienced a few hundred (relatively clueless) users. The alternative (fixed font sizes) would have DENIED access to hundreds (if not thousands) of users (read:customers) with poor eye sight. No comparison in my book. Besides (assuming you replied to those few hundred users), you've done them a favour by educating them on a feature they knew nothing about and hopefully put in a quick blurb about ABN AMRO Morgan's dedication to accessibility :P * Some (more likely than less) designs just CANNOT be implemented using only relative fonts. Say you want to have a fixed 200px wide column on the right hand side and a stretchy column in the middle. The content on the right hand side HAS to be designed to look right in that 200px space. So that means you cannot really use relative font sizes if you are filling the 200px space. If they size it up - it wont fit and will look stupid. So this then defeats the purpose of using relative fonts at all - because, when they DO upsize the font, part of the page will size and part of it wont. Just go to some of the well known CSS/XHTML standards-based sites (wont mention any names) and you will find that not every part of the page sizes - but is this right? What if the bit that is too small for my eyes (e.g. the Menu) is the bit that the designer has in a fixed font ? Only thing you can do in this situation is design your templates to accommodate a 1-2 notch font size change. It's not always an option of course (depending on design requirements). So I guess that's where some developers resort back to pixel sizes. Personally, I never bother. Function over form I guess. If it breaks then so be it. At least the user will still be able to read your content. Relative font sizes ruin good design. A bold statement. How about: Fixed font sizes reduce your potential audience Just as valid (if not more so), no? Cheers, James Silva Web Production Gruden Pty Ltd Tel: +61 02 9956 6388 Fax: +61 02 9956 8433 Email: [EMAIL PROTECTED] Web: http://www.gruden.com * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
RE: [WSG] Relative Fonts
So when we launched our new site we had HUNDREDS (not exaggerating - they are all logged) of complaints about the font size being too small or too big because they did not have their font size set to medium (and there doesn't appear to be a way to detect what the setting is - probably because it is not standard). We've faced this as well, particularly with the Perth International Arts Festival, and we just decided to politely educate each user who complained about what their problem was and why it was better the way we'd done it. Time consuming, but after the first couple it was all cut and paste anyway. A lot of people actually apologised for complaining, some thanked us for telling them about the resizing feature, one even switched to Mozilla. Am I gonna re-educate the entire internet population, one complaint letter at a time? Probably not! But I felt better about those that I did respond to. Of course, many people simply don't complain... K. --- Kay Smoljak Senior Developer/QC Leader/Search Optimisation PerthWeb Pty Ltd - http://www.perthweb.com.au/ Ph: 08 9226 1366 - Fax: 08 9226 1375 * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
RE: [WSG] Relative Fonts
Title: RE: [WSG] Relative Fonts Kay wrote: we just decided to politely educate each user who complained about what their problem was and why it was better the way we'd done it. Time consuming, but after the first couple it was all cut and paste anyway. ditto here. i had a similar experience once and fired off a standard reply to a few hundred readers. the response to that from readers was unanimously bordering on overjoyed for passing on that info. made my day :) incidently, and this may be common knowledge, but if you assign your font sizes with em's the font size controls in IE have a compounding effect - often making smallest unreadable and largest absolutely massive. if you use %'s to define font sizes the extreme variations are reduced and you may find you dont get as many compaints. pete Peter Ottery Head of Design f2 Network (02) 8596 4450 [EMAIL PROTECTED] www.f2.com.au
RE: [WSG] Relative Fonts
We've faced this as well, particularly with the Perth International Arts Festival, and we just decided to politely educate each user who complained about what their problem was and why it was better the way we'd done it. Time consuming, but after the first couple it was all cut and paste anyway. While this was obviously what we had to do (in answer to the above - and to the other suggestions/questions about educating the users) I am still at a loss as to how I get information that will only just fit into an available space (e.g. 200px) to be aesthetic and functional and to not break when upsized (downsized is less of a problem as it wont hit the widht barrier - if they can read it smaller than the default presentation size then their eyesight is better than mine). There are obviously times when you decide to comprimise on these things (Russ' Max Design site uses a mixture of relative and non-relative fonts). I am looking for some pointers or rules of thumb to know when to use and when to NOT use relative fonts. Gary Menzel Web Development Manager IT Operations Brisbane -+- ABN AMRO Morgans Limited Level 29, 123 Eagle Street BRISBANE QLD 4000 PH: 07 333 44 828 FX: 07 3834 0828 To unsubscribe from this email please forward this email to: [EMAIL PROTECTED] If this communication is not intended for you and you are not an authorised recipient of this email you are prohibited by law from dealing with or relying on the email or any file attachments. This prohibition includes reading, printing, copying, re-transmitting, disseminating, storing or in any other way dealing or acting in reliance on the information. If you have received this email in error, we request you contact ABN AMRO Morgans Limited immediately by returning the email to [EMAIL PROTECTED] and destroy the original. We will refund any reasonable costs associated with notifying ABN AMRO Morgans. This email is confidential and may contain privileged client information. ABN AMRO Morgans has taken reasonable steps to ensure the accuracy and integrity of all its communications, including electronic communications, but accepts no liability for materials transmitted. Materials may also be transmitted without the knowledge of ABN AMRO Morgans. ABN AMRO Morgans Limited its directors and employees do not accept liability for the results of any actions taken or not on the basis of the information in this report. ABN AMRO Morgans Limited and its associates hold or may hold securities in the companies/trusts mentioned herein. Any recommendation is made on the basis of our research of the investment and may not suit the specific requirements of clients. Assessments of suitability to an individual?s portfolio can only be made after an examination of the particular client?s investments, financial circumstances and requirements. ABN AMRO Morgans Limited (ABN 49 010 669 726 AFSL 235410) A Participant of ASX Group * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
RE: [WSG] Relative Fonts
Gary asked So - what does everyone do? I use em for all measurements (except images). So those column widths are not 200px but 16.7em. With a fixed width page (60em) long lines of text ie 80+ characters per line are difficult to read. Use a little bit of javascript to set the inital font size (and everything elses size) 76% for screens under 1000 pixels wide and 101% for screens wider than 1000 pixels. (OK that will upset a few people, but we are working on the great unwashed masses who do not know or care how to change font sizes) and no JS means 76%. Give people the opportunity to change font sizes with buttons A+ and a- (+10% and -10% respectively) and that info is held by a cookie (again an evil bit of javascript ;-). Nick * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
RE: [WSG] Relative Fonts
I use em for all measurements (except images). So those column widths are not 200px but 16.7em. With a fixed width page (60em) long lines of text ie 80+ characters per line are difficult to read. OK - so is there a formula to work out PX to EM ? (at least on a vanilla type of setup). And I am not sure what you were saying in the line that had (60em) in it. On the JavaScript front. that is something I want to avoid. I was not even sure I could play around with the font size in JavaScript - but I would not consider this to be standard. And, in any case, the user can supplant my stylesheet with one of their own (and that would be even uglier than turning off stylesheets alltogether). At least I have tried to lay out the pages so they will degrade reasonably with no stylesheet. I would not like to see what would happen if the user used a stylesheet of their own. The A+ and a- bit you mean some JavaScript trickery to size the fonts and place some bean in their cookies that my JS uses as a seed for a starting size? Again - don't like the idea of all that JS to play with something that is (obviously) getting too close to Don't change what the browser does. That being the case - I might as well go with PX and be done with it (not saying I will - but saying that if I have to do all of the above to get back the control then I might as well make my life a lot easier and go with fixed sizes). Gary Menzel Web Development Manager IT Operations Brisbane -+- ABN AMRO Morgans Limited Level 29, 123 Eagle Street BRISBANE QLD 4000 PH: 07 333 44 828 FX: 07 3834 0828 To unsubscribe from this email please forward this email to: [EMAIL PROTECTED] If this communication is not intended for you and you are not an authorised recipient of this email you are prohibited by law from dealing with or relying on the email or any file attachments. This prohibition includes reading, printing, copying, re-transmitting, disseminating, storing or in any other way dealing or acting in reliance on the information. If you have received this email in error, we request you contact ABN AMRO Morgans Limited immediately by returning the email to [EMAIL PROTECTED] and destroy the original. We will refund any reasonable costs associated with notifying ABN AMRO Morgans. This email is confidential and may contain privileged client information. ABN AMRO Morgans has taken reasonable steps to ensure the accuracy and integrity of all its communications, including electronic communications, but accepts no liability for materials transmitted. Materials may also be transmitted without the knowledge of ABN AMRO Morgans. ABN AMRO Morgans Limited its directors and employees do not accept liability for the results of any actions taken or not on the basis of the information in this report. ABN AMRO Morgans Limited and its associates hold or may hold securities in the companies/trusts mentioned herein. Any recommendation is made on the basis of our research of the investment and may not suit the specific requirements of clients. Assessments of suitability to an individual?s portfolio can only be made after an examination of the particular client?s investments, financial circumstances and requirements. ABN AMRO Morgans Limited (ABN 49 010 669 726 AFSL 235410) A Participant of ASX Group * The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help *
