html site-critique

The reason why I ask is that I have created the site from a layout a
graphic designer I am working with has created. After I finished the
site, we had an argument about pixel accuracy of the layout (ufff...).

She asked me to drop the list-style menu for a paragraph(!) because this
is the only way to have a common line-height:140% for all the text on
the site! I was a bit confused, because I told here that she is mixing
semantic with formal representation, and this wouldn't work when viewing
the site with other UAs (print, handheld, text-reader). She told me that
there are so few people out there using such exotic things that she
doesn't care about as long as the visual impression is pixel precise...

She calls herself webdesigner, but I said, that such an approach has
nothing to do with webdesign.
What do you think? Would it be okay to have a menu structured in a
single paragraph (p) truncated by line-breaks (br)? What are the
pros/cons for such an approach?

Advertisements

Bernhard Sturm wrote:
> She calls herself webdesigner, but I said, that such an approach has
> nothing to do with webdesign.

It does not. As long as you had her alone when you said it, it might
be OK, to say it, too. Once you've warned them, if people want to
pay for crap, well, it's their business and their money -- back off.

Advertisements

On 10/16/07 09:43 am, Bernhard Sturm wrote:
>
> I wonder what you professionals think about this site:
> http://test.montessori-viki.ch/
>
The problem with pixel perfect designs is immediately obvious. The text
below "Anmeldung (pdf, 39kB)" shows only the top parts of the characters.
(I have a minimum text size set which is larger than the teeny text size
defined for that menu.) The layout design adapts poorly to different text
sizes.
>
> She asked me to drop the list-style menu for a paragraph(!) because this
> is the only way to have a common line-height:140% for all the text on
> the site!
>
You can still achieve the spacing she desires by creative use of the
padding and margins.
The fact that she does not care about markup is sad. Web design is much
more than visual presentation; she does not understand that.
>
> She calls herself webdesigner, but I said, that such an approach has
> nothing to do with webdesign.
>
Correct. She is a graphics designer who has not embraced the realities
of the Web medium. She is still stuck in print layout.

Jim Moe wrote:
> On 10/16/07 09:43 am, Bernhard Sturm wrote:
>> She asked me to drop the list-style menu for a paragraph(!) because this
>> is the only way to have a common line-height:140% for all the text on
>> the site!
>>
> You can still achieve the spacing she desires by creative use of the
> padding and margins.

We tried this together, but she was really measuring pixels, and then
switching between safari (which seems to have a problem with em-unit
fractions (eg. 1.43em) for li-margins) and IE (which renders fonts
different), so this resulted in frustration. I lectured here for about
half an hour, showing her the page in Lynx and on my mobile phone, but
she was only like: 'The number of people using such devices in order to
view a website are close to zero, only geeks use this'... phheee...
> The fact that she does not care about markup is sad. Web design is much
> more than visual presentation; she does not understand that.
>> She calls herself webdesigner, but I said, that such an approach has
>> nothing to do with webdesign.
>>
> Correct. She is a graphics designer who has not embraced the realities
> of the Web medium. She is still stuck in print layout.

I told her that as well. I was like 'As a print oriented graphics
designer you also have to respect the limitations of the media, you
cannot design below certain font sizes as people will not be able to
read it'... but useless..

In article <>,
mbstevens <> wrote:
> Bernhard Sturm wrote:
>
> > She calls herself webdesigner, but I said, that such an approach has
> > nothing to do with webdesign.
>
> It does not. As long as you had her alone when you said it, it might
> be OK, to say it, too. Once you've warned them, if people want to
> pay for crap, well, it's their business and their money -- back off.

Maybe... or maybe take a stand quietly, play about a bit, get the
list back in the html and css something like:

On 10/16/07 12:06 pm, Bernhard Sturm wrote:
> [...] I lectured her for about
> half an hour, showing her the page in Lynx and on my mobile phone, but
> she was only like: 'The number of people using such devices in order to
> view a website are close to zero, only geeks use this'... phheee...
>
The Lynx view is what search engines see as well.
>> Correct. She is a graphics designer who has not embraced the realities
>> of the Web medium. She is still stuck in print layout.
>
> I told her that as well. I was like 'As a print oriented graphics
> designer you also have to respect the limitations of the media, you
> cannot design below certain font sizes as people will not be able to
> read it'... but useless..
>
To achieve truly pixel perfect layout for all possible browsers you will
have to provide the page as an image map. Any other choice will not meet
her expectations.

Jim Moe wrote:
>>
> To achieve truly pixel perfect layout for all possible browsers you will
> have to provide the page as an image map. Any other choice will not meet
> her expectations.
>

True... That's what I suggested to her as well. Then she got almost mad
about me: that I would take the mickey out of her... siggh... I think I
go along the way as doryame told me. She will not notice it as she
hardly checks a site when finished.

Gazing into my crystal ball I observed Bernhard Sturm
<> writing in news:ff2pnr$kah$:
>
> Hi Group,
>
> I wonder what you professionals think about this site:
>
> http://test.montessori-viki.ch/
>
> The reason why I ask is that I have created the site from a layout a
> graphic designer I am working with has created. After I finished the
> site, we had an argument about pixel accuracy of the layout (ufff...).
>
> She asked me to drop the list-style menu for a paragraph(!) because
this
> is the only way to have a common line-height:140% for all the text on
> the site! I was a bit confused, because I told here that she is mixing
> semantic with formal representation, and this wouldn't work when
viewing
> the site with other UAs (print, handheld, text-reader). She told me
that
> there are so few people out there using such exotic things that she
> doesn't care about as long as the visual impression is pixel
precise...
>

<quote>10 million Americans surf from cell phones or personal digital
assistants (PDAs). Of the 19.1 million users owning a PDA, 5 million
access the Internet with those devices, and among the 67.2 million
online users that own a cell phone, 5.8 million access the Internet with
those devices. - ComScore Networks</quote>

You might also want to point her to a recent thread about Target being
sued in Federal court. Montessori schools are known for their organic
method of teaching (only wooden toys), and I am sure would be horrified
if their web site was not accessible to a visually impaired student, or
parent seeking information.
> She calls herself webdesigner, but I said, that such an approach has
> nothing to do with webdesign.
> What do you think? Would it be okay to have a menu structured in a
> single paragraph (p) truncated by line-breaks (br)? What are the
> pros/cons for such an approach?
>

You could always go over her head and directly to the client. Maybe the
client isn't as thick as she seems to be.

Bergamot wrote:
> Jim Moe wrote:
>> On 10/16/07 09:43 am, Bernhard Sturm wrote:
>>> http://test.montessori-viki.ch/
>>>
>> The text
>> below "Anmeldung (pdf, 39kB)" shows only the top parts of the characters.
>
> I don't see anything below it at all.
>
Just the kind of effects I suspected to happen... I just don't get it
why print oriented designers try to get involved into webdesign without
accepting the fact that it's not a piece of static paper? It's as if you
would talk to someone comming from the last century: I always have the
impression that they still think everybody else in the world will see it
the way they see it on their 22" screen, and that everybody else is
using safari and nothing else to see the page.

dorayme wrote:
> In article <>,
> mbstevens <> wrote:
>> It does not. As long as you had her alone when you said it, it might
>> be OK, to say it, too. Once you've warned them, if people want to
>> pay for crap, well, it's their business and their money -- back off.
>
> Maybe... or maybe take a stand quietly, play about a bit, get the
> list back in the html and css something like:
>
> #menu a {font-size: .75em;}
> #menu li {list-style: none;}
> #menu ul, li {margin:0;padding:0;}
> #menu ul, li {line-height: 1;}
>
> and ask the graphic designer to see if she can pick it from just
> looking at the website itself. If she cannot, then Bob will be
> OP's uncle.

It's as if someone would say: the web is a static place. I, THE DESIGNER
AM IN CONTROL! but this is such an outdated view. This is not only true
for the visual design but also for the navigational design: most of the
graphic designer can not embrace the reality of a non-linear
navigational structure. They always think in terms of a book: a user
will always start at the first page and navigate along a predefined
path(hence the many useless intro-pages).

In article <ff4d3g$sro$>,
Bernhard Sturm <> wrote:
> Jim Moe wrote:
> >>
> > To achieve truly pixel perfect layout for all possible browsers you will
> > have to provide the page as an image map. Any other choice will not meet
> > her expectations.
> >
>
> True... That's what I suggested to her as well. Then she got almost mad
> about me: that I would take the mickey out of her... siggh... I think I
> go along the way as doryame told me. She will not notice it as she
> hardly checks a site when finished.

When I fiddled about this morning with some values, I recall not
being able to notice at all the difference. In case it helps you
in your deception [1]:

Open the <p>'d version in one window and the <ul>d version in
another.

Browser/window control the font-size so that the pics are the
same size between windows (I noticed the design has this feature
via the positioning scheme).

Then fiddle with the css of the list version.

------------
[1] I say, chaps, this is terribly exciting, how to deceive the
boss.

dorayme wrote:
>
> When I fiddled about this morning with some values, I recall not
> being able to notice at all the difference. In case it helps you
> in your deception [1]:
>
> Open the <p>'d version in one window and the <ul>d version in
> another.

I did this already I made screenshots to document the 'non-existing'
difference. There is only a small 1 pixel shift visible in firefox, but
I doubt she will notice it. Anyhow: thanks for the input.
>
> Browser/window control the font-size so that the pics are the
> same size between windows (I noticed the design has this feature
> via the positioning scheme).

Yes. Which makes it even harder to achieve pixel perfect designs as
various UAs size different (I noticed some glitches in Safari on Windows).

> ------------
> [1] I say, chaps, this is terribly exciting, how to deceive the
> boss.

LOL.. given the fact, that she is not the boss, but in this particular
project she has the lead (in all other cases I am the boss

On 16 Oct, 19:15, mbstevens <> wrote:
> Once you've warned them, if people want to
> pay for crap, well, it's their business and their money -- back off.

I disagree with that. IMHO, one of the functions of the "competent
expert in the field" is to _educate_ the consumer.

Customers don't set out "wanting to buy crap". They often start by
wanting to buy something that _is_ crap, but they want it because they
also think, mistakenly, that this is the way it ought to be. A
customer who's told by one designer that "pixel-perfect is best" or
"fox your fint sizes" won't know that it's a bad idea (and why should
they?). Our job, as technical experts, is to educate them on the
reasons why we think such techniques lead to crap sites.

I like it. You've achieved a very difficult task: taking a "pixel-
perfect" layout and building it on the web in a way that's broadly
pixel-perfect, yet without compromising accessibility. You're to be
congratulated.

The designer has achieved a good result too. They've produced
something that's attractive and doesn't have the usual "Designed by
Geeks" square-box look of the typical standards-based site. Now they
need to relax and not be obsessive about the trivial details you
describe. They've met the useful goals, now they should stop before
aesthetic trivia starts to break code with technically significant
issues.

Congratulations. You've both worked well on this one, you've achieved
both of yoru goals, even though this tend to pull in opposite
directions.

Please take yourself and the designer to the recently posted site
(Massage in Canada) and show them how to achieve such a result. Now
there was a ugly site that needed this sort of design input.

Andy Dingley wrote:
> On 16 Oct, 19:15, mbstevens <> wrote:
>
>> Once you've warned them, if people want to
>> pay for crap, well, it's their business and their money -- back off.
>
> I disagree with that. IMHO, one of the functions of the "competent
> expert in the field" is to _educate_ the consumer.

Andy Dingley wrote:
> On 16 Oct, 17:43, Bernhard Sturm <> wrote:
>
> > I wonder what you professionals think about this site:
> > http://test.montessori-viki.ch/
>
> I like it. You've achieved a very difficult task: taking a "pixel-
> perfect" layout and building it on the web in a way that's broadly
> pixel-perfect, yet without compromising accessibility. You're to be
> congratulated.
>
> The designer has achieved a good result too. They've produced
> something that's attractive and doesn't have the usual "Designed by
> Geeks" square-box look of the typical standards-based site. Now they
> need to relax and not be obsessive about the trivial details you
> describe. They've met the useful goals, now they should stop before
> aesthetic trivia starts to break code with technically significant
> issues.
>
I agree and think that's the problem with a lot of Flash based sites,
they look identicle in any browser, but the functionality and the
useability is just not good at all.
> Congratulations. You've both worked well on this one, you've achieved
> both of yoru goals, even though this tend to pull in opposite
> directions.
>
>
> Please take yourself and the designer to the recently posted site
> (Massage in Canada) and show them how to achieve such a result. Now
> there was a ugly site that needed this sort of design input.
Yes, I know what you mean. Although I think graphic design is one of
those things you need to study for quite some time to get an idea of
what works.
--
Regards Chad. http://freewebdesign.awardspace.biz

Share This Page

Welcome to The Coding Forums!

Welcome to the Coding Forums, the place to chat about anything related to programming and coding languages.

Please join our friendly community by clicking the button below - it only takes a few seconds and is totally free. You'll be able to ask questions about coding or chat with the community and help others.
Sign up now!