[thelist] Total separation of content and presentation

Dan Eastwell danieleastwell at onetel.com
Tue Dec 21 11:29:47 CST 2004


Hi Rosalie,

The completely fluid layout was the intention! If you want bigger text, 
you get bigger containers, smaller text, smaller containers.

I was quite proud of that site and the way that it keeps its form, no 
matter how large the type, even at very extreme font sizes and low 
resolutions - I'd like to state now that it does not go 'all over the 
place', but is exactly the same only percentages larger! :-)

I perefer it from a design point of view, as, if you are going to fiddle 
around with the design of a layout by changing the font size, the design 
adapts to the changes. In that way, the text resize acts (in a way..) 
like the zoom function in opera - the entire site gets resized.

I don't get why you're 'at the mercy' of browser settings if you set 
container sizes in ems - I would have thought it would be a way to keep 
the integrity of your design /despite/ browser settings. If the text's 
tiny, you get a tiny site, large, large site. I would have thought, 
anyway, that more than two steps either side of default you are getting 
to the extremes of legibility anyway.

I'm open to any more points on this, though..

Thanks,

Dan.

Rosalie Sennett wrote:

>Dan,
>
>I know you're not looking for advice... but I wanted to let you know that on
>the http://test.danieleastwell.co.uk site, because you're using em as your
>font size and you've set your font for your body in ems... the entire page
>is controlled by the size of the font in the browser.
>
>Since we're talking about having control over positioning... you've actually
>demonstrated a really great way to lose control completely! ;-)
>
>For example... I was reading something where the type was small (and I'm
>old!) and I had increased the font size in the browser to "largest"... so
>everything on your page was all over the place... I realized the problem and
>reduced it to 'smallest' just to see what would happen...
>The entire page was about an inch wide and sitting in the upper left hand
>corner of my screen. Fascinating! It works very nicely at medium setting
>btw.
>
>But you've left the entire layout in the hands of the font size... scary!
>
>When you use ems to make the text size relative (and I do, and I like that)
>you need to fix something for it to be relative to!
>
>Using ems is great for making sure your site is accessible (nothing more
>annoying that having to go into the tools menu and enable the accessibility
>features... to override the font size), but without fixing it so that the
>ems are relative to 'something', you're at the mercy of browser settings no
>matter what the setting... so setting a font size using px in the body
>tag... is probably a good idea.
>
>My unsolicited two cents. ;-)
>
>rose
>
>-----------------
>c:/dos
>c:/dos/run
>run/dos/run
>  
>
>-----------------
>
>  
>
>>-----Original Message-----
>>From: thelist-bounces at lists.evolt.org [mailto:thelist-
>>bounces at lists.evolt.org] On Behalf Of Dan Eastwell
>>Sent: Tuesday, December 21, 2004 11:15 AM
>>To: thelist at lists.evolt.org
>>Subject: Re: [thelist] Total separation of content and presentation
>>
>>Hi Ellen,
>>
>>I think that's something I've attempted at www.rainbow.uk.net. I've
>>tried to use as few containing divs as is at all possible, and to have a
>>content that would be resizable without losing the form and would work
>>in as many browsers as possible with as few hacks as is possible in the
>>code.
>>
>>I keep attempting to get this holy grail of divorced styling and
>>structure, but it's currently more or less impossible, if you want
>>complete backwards compatibility and cross browser compatibility.  I've
>>tended to need to tweak code for various browsers  and add classes
>>accordingly. It doesn't make for pretty reading! (see
>>http://test.danieleastwell.co.uk)
>>
>>I would have to say that a search for a completely independent structure
>>is not overwhelmingly possible, if you look at things like, say, the CSS
>>zen garden, where the HTML marked up with a lot of divs, classes etc,
>>leading to acceptable, but not very realistic markup, but allowing for
>>any number of designs, with no need to worry about ordering.
>>
>>There's lots needed to bear in mind with a three column fluid layout,
>>especially in terms of having certain columns with fixed width for, say
>>readability (e.g. a ten word per line rule). IE6 has a tendency to
>>'wrap' the third column. I've found that consistent use of ems for
>>sizing and a wrapper div (although not really semantic) does the job.
>>
>>Hopefully this is the kind of thing you are looking for and I'm not
>>covering ground you've looked at already...
>>
>>Thanks,
>>
>>Dan.
>>
>>Ellen Kanner wrote:
>>
>>    
>>
>>>We are looking to use <divs>, most definitely.
>>>
>>>What we're trying to accomplish is a page laid out in the CSS,
>>>independent of the order/structure it appears in the HTML.  <divs>
>>>that are independent of one another and could be relocated, within the
>>>CSS, without having to go into the HTML.  Not using container <divs>,
>>>if it's possible.
>>>We're trying to establish our 'perma-code', so should a new design
>>>come down the pike, we could modify the style sheets in a few
>>>locations, rather than go in to thousands of HTML pages and do the
>>>restructuring there. Anyone done tests without container <divs> and
>>>hacks? Our layout will be three fluid columns, any length, with
>>>flexible vertical sizing on divs so text can be resized.
>>>
>>>We'd like to talk with anyone who has experience with this...
>>>
>>>: )  ellen
>>>
>>>
>>>
>>>On Dec 21, 2004, at 9:34 AM, Tony Crockford wrote:
>>>
>>>At 14:01 on Tuesday, 21 Dec 2004, Ellen Kanner wrote:
>>>
>>>      
>>>
>>>>We've been searching far and wide without (complete) success, and it
>>>>may not be possible. But, before we give in and use divs instead of
>>>>tables, we thought we'd ask if anyone has worked on this.
>>>>
>>>>Can you help?
>>>>        
>>>>
>>>CSS can only position elements on a page.  usually you group a number
>>>of paragraph elements in a div and position that.
>>>
>>>I'm not sure I'm clear on how you plan to position groups of elements
>>>without using divs.  I'm also unclear as to why you'd want to do this?
>>>
>>>a simply structured html document:
>>>
>>><div id="header"></div>
>>><div id="nav"></div>
>>><div id="content"></div>
>>><div id="footer"></div>
>>>
>>>makes more sense than trying to layout individual paragraphs, links
>>>and lists.
>>>
>>>perhaps you could explain in more detail what you hope to acheive?
>>>
>>>;o)
>>>      
>>>
>>
>>--
>>Daniel Eastwell
>>
>>http://www.thoughtballoon.co.uk
>>
>>
>>
>>--
>>No virus found in this outgoing message.
>>Checked by AVG Anti-Virus.
>>Version: 7.0.296 / Virus Database: 265.6.2 - Release Date: 20/12/2004
>>
>>--
>>
>>* * Please support the community that supports you.  * *
>>http://evolt.org/help_support_evolt/
>>
>>For unsubscribe and other options, including the Tip Harvester
>>and archives of thelist go to: http://lists.evolt.org
>>Workers of the Web, evolt !
>>    
>>
>
>
>  
>


-- 
Daniel Eastwell

http://www.thoughtballoon.co.uk



-- 
No virus found in this outgoing message.
Checked by AVG Anti-Virus.
Version: 7.0.296 / Virus Database: 265.6.2 - Release Date: 20/12/2004



More information about the thelist mailing list