[thelist] Total separation of content and presentation

Tue Dec 21 12:19:52 CST 2004

Dan,

What happened when the font was very large... was that the position of the
divs on the page no longer held their relationship to each other. One was
wrapped down below the other...

The contact page (rather than the home page which has only one block)
Became jumbled when the font went above 'medium'. The artist listing is
booted town below the contact us block. And the "CONTACT" page header is off
to the side hanging off of the design.

So by leaving it all to chance, you do get to a point that the structure is
lost because the structure is dependent on font size.

Of course, using the 'largest' setting on the zoom is perhaps
unreasonable... but knowing that there is a point where the structure falls
apart,  is probably a good idea.

The roster page actually holds together as the font gets bigger. I would
imagine that somehow the lists are seen as one big chunk since you're using
them block style.

I guess what I'm saying, is that not anchoring the relative sizes to one
fixed base size means that when the structure expands, it has the freedom to
move too, and therefore move away from the structure you intend...

"em" is relative to 'something'. Without specifying what that is... you
basically say "the em is relative to whatever the client browser decides".

I guess I'm more of a control freak than you are. ;-)

r
-----------------
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 12:30 PM
> To: thelist at lists.evolt.org
> Subject: Re: [thelist] Total separation of content and presentation
> 
> 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
> 
> --
> 
> * * 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 !