Critique CSS layout (1st go - fingers crossed)

[Titus A Ducksass - AKA broken-record]

Re: Critique CSS layout (1st go - fingers crossed)

On Sat, 13 Nov 2004 22:46:59 +0100, "Barbara de Zoete"
<b_de_zoete@hot mail.com> wrote:
[color=blue]
>On Sat, 13 Nov 2004 21:41:06 GMT, Titus A Ducksass - AKA broken-record
><me@neverumind .com> wrote:
>[color=green]
>> On Sat, 13 Nov 2004 21:03:24 +0100, "Barbara de Zoete"
>> <b_de_zoete@hot mail.com> wrote:
>>[/color]
>
>[ 8< menu's, list items, css effects (like hover and drop-down) ]
>[color=green]
>> Hmmm, what do you do when the majority of your users are IE orientated
>> - captive audience in my case.[/color]
>
>Make another strategical choice as to how to layout your page?[/color]

I like that idea... <Grin>
[color=blue][color=green]
>> Cant use java script as a lot of my users are in fact blind.[/color]
>
>And how are hover effects and drop downs (done in what ever way) going to
>be useful to these people, if I may ask?[/color]
Hover isn't an issue it is for the few that can see, those that cant,
tab through the menu and it gets read out to them.

I am interested in getting the drop downs as a method of removing
screen clutter - 30ish menu items to 4 main areas.

<A message to top posters. Type your reply here>

--
Never be afraid to try something new. Remember that a lone amateur
built the Ark. A large group of professionals built the Titanic.

[lime]

Re: Critique CSS layout (1st go - fingers crossed)


"Leonard Blaisdell" wrote in message ...[color=blue]
> "lime" wrote:
>[color=green]
>> This is my first go using a CSS only layout. After many versions (about 7
>> of
>> them) this is the final version that I would like critiqued.[/color]
>
> But think of what you have learned![/color]

That's right! And I'd been waiting until I had the extra time to do so as
well.

[color=blue][color=green]
>> I have tested on the following Win browsers: IE6, NS6 & Mozilla Firefox
>> 1.0.[/color]
>
> Works great in that ancient Mac browser IE5.5. And MacMozilla 1.2.1. And
> it looks lovely in MacLynx.[/color]

Excellent, thank you for checking.

[color=blue][color=green]
>> http://www.limelightstudio.com.au/iss/html/[/color]
>
> And it even validates.[/color]

Ah yes, that's something I *always* check before posting!

[lime]

Re: Critique CSS layout (1st go - fingers crossed)


"Alan Cole" wrote in message ...[color=blue][color=green][color=darkred]
> >>
>> > http://www.limelightstudio.com.au/iss/html/[/color][/color]
>
> I would love to critique the site, but I can never get to any of you
> www/limelightstudio .com.au links. Every time I try, my browesr (FF1.0 on
> Mac OSX) tries for a while and then times out.... I've tried to get to
> your sites a few times now over the past few days with no joy.[/color]

Hmm, strange... I wonder why...

You're missing out you know that don't you? ;o)

[lime]

Re: Critique CSS layout (1st go - fingers crossed)


"Toby Inkster" wrote in message ...[color=blue]
> lime wrote:
>[color=green]
>> http://www.limelightstudio.com.au/iss/html/[/color]
>
> Looks pretty good.[/color]

Great, thanks for checking.

[color=blue]
> Text for the main body of the page is a bit small though.[/color]

By 5% .... ;o)
[color=blue]
> Using a <ul> for the navigation menu would enhance its appeal to non-CSS
> browsers. If you don't like the margin and bullet points that a <ul> often
> carries with it, you can use CSS to remove them.[/color]

I'll be giving that a go, thanks for the tip Toby.

[lime]

Re: Critique CSS layout (1st go - fingers crossed)


"Neredbojia s" wrote in message ...[color=blue]
> Without quill or qualm, lime quothed:
>[color=green]
>> I've been using CSS for a while, however always using tables for the
>> layout.
>>
>> This is my first go using a CSS only layout. After many versions (about 7
>> of
>> them) this is the final version that I would like critiqued.
>>
>> I have tested on the following Win browsers: IE6, NS6 & Mozilla Firefox
>> 1.0.
>>
>> http://www.limelightstudio.com.au/iss/html/[/color]
>
> I get a horz scrollbar in IE 6 at about 850-900 pixels. Not in Moz,
> though.[/color]


Hmm, ok thanks. I'll double check that to see why it may be doing so...

[lime]

Re: Critique CSS layout (1st go - fingers crossed)


"Titus A Ducksass - AKA broken-record" wrote in message ...[color=blue]
> "lime" wrote:
>[color=green]
>>I've been using CSS for a while, however always using tables for the
>>layout.
>>
>>This is my first go using a CSS only layout. After many versions (about 7
>>of
>>them) this is the final version that I would like critiqued.
>>
>>I have tested on the following Win browsers: IE6, NS6 & Mozilla Firefox
>>1.0.
>>
>>http://www.limelightstudio.com.au/iss/html/[/color][/color]
[color=blue]
> Looks good but lots of broken links.[/color]

Should have mentioned that none of the links (bar the about us page)
works...

Thanks for checking too.

[lime]

Re: Critique CSS layout (1st go - fingers crossed)


"Henry" wrote in message ...[color=blue]
> lime wrote:[color=green]
>> I've been using CSS for a while, however always using tables for the
>> layout.
>>
>> This is my first go using a CSS only layout. After many versions (about 7
>> of them) this is the final version that I would like critiqued.
>>
>> I have tested on the following Win browsers: IE6, NS6 & Mozilla Firefox
>> 1.0.
>>
>> http://www.limelightstudio.com.au/iss/html/[/color]
>
>
> Great effort!!![/color]

Thanks!!!
[color=blue]
> Which Dreamweaver template did you used!?[/color]

ROTFLMOA, yeah right...
[color=blue]
> ;)[/color]

Oh - the smiley... glad you were only joking ;o)

[lime]

Re: Critique CSS layout (1st go - fingers crossed)


"Lachlan Hunt" wrote in message ...[color=blue]
> lime wrote:[color=green]
>> This is my first go using a CSS only layout. After many versions (about 7
>> of them) this is the final version that I would like critiqued.
>>
>> http://www.limelightstudio.com.au/iss/html/[/color]
>
> It's fairly well done from a visual perspective, especially since it's
> your first go at a pure CSS layout.[/color]

Thank you Lachlan, your praise is much appreciated as is the comprehensive
response below....

[color=blue]
> * The light blue backgroud with the grey text does make it harder to
> read. Try lightening the background and/or darkening the text colour.][/color]

Fair call - I will make the text #333333 instead of the current #555555
[color=blue]
> * The Privacy Statement link needs to be a different color than the
> "Last Updated ..." text. I hovered over Last Spdated, sice the colour
> made it look like a link, then, since it wasn't, I didn't realise
> Privacy Statement was until much later.[/color]

Another fair call - I'll make the "last updated" #333333 like the main
content.
[color=blue]
> * Try adding more visual feedback when hovering over the navigation
> list. eg. By changing the colour and/or background.[/color]

I'll have a play with that to see how it can be enhanced.
[color=blue]
> The headings also should not be written in all uppercase within the
> markup. I've heard it causes some screen readers to speak all the
> letters, rather than read them as words. Use Title Case Like This, and
> then style them using text-transform: uppercase;[/color]

Great tip, thank you. I don't even know why I kept the header in upper - it
was a straight copy/paste job on my behalf...
[color=blue]
> I would also change the footer to this, just to keep the links together:
> _Privacy Statement_ | _Website Design by Limelight Design Studios_
> Last updated: 13th November 2004
> Make both of those links the same colour, but different from the Last
> Updated line.[/color]

I'd rather keep Website design separate to the Privacy link (and smaller as
well)

[color=blue]
> There are also some markup issues:[/color]

This is the juicy bit I was wondering about...
[color=blue]
> * Headings. There's no <h1> - <h6> elements in the entire document.
> - Put the ISS logo within an <h1>
> - Page title, "Welcome", in <h2>
> - Then <h3> for the last two that you have in all uppercase.[/color]

Beautiful, shall do.
[color=blue]
> * Navigation list: Use <ul> and <li> for each item.[/color]

I'll give that a go as per Toby's post.
[color=blue]
> * Remove most, if not all <br> elements, and replace them with more
> semantic options. (Most will be replaced with correct <li> and <hn>
> elements)[/color]

<hn>? This one I'll need to read up on as I'm not familiar with that one...
[color=blue]
> * There seems to be an excessive number of <div>s, and the main content
> is incorrectly within <div id="pageTitle"> , which should really be an
> <h2> anyway.[/color]

Once I add the <h#> throughout the document I'll see what happens to the
layout before removing the main content outisde of the <pageTitle> div... I
know that after 7 attempts to get things looking good, I may have actually
over-tweaked things...

Thanks again for checking and your feedback.

PS: I now have this Aussie song stuck in my head because of your name... 3
girls chanting L-A-C-H-L-A-N

[Lachlan Hunt]

Re: Critique CSS layout (1st go - fingers crossed)

lime wrote:[color=blue]
> "Lachlan Hunt" wrote in message ...[color=green]
>>* Remove most, if not all <br> elements, and replace them with more
>> semantic options. (Most will be replaced with correct <li> and <hn>
>> elements)[/color]
>
> <hn>? This one I'll need to read up on as I'm not familiar with that one...[/color]

<hn> is simply a common abbreviation for the heading elements, <h1> to
<h6>, where n represents the number. There is actually no <hn> element
in HTML, I just incorrectly assumed you would understand what I meant.
[color=blue]
> PS: I now have this Aussie song stuck in my head because of your name... 3
> girls chanting L-A-C-H-L-A-N[/color]

I'm not sure what song your referring to.

--
Lachlan Hunt

http://lachy.id.au/

http://GetFirefox.com/ Rediscover the Web
http://SpreadFirefox.com/ Igniting the Web

[kchayka]

Re: Critique CSS layout (1st go - fingers crossed)

Titus A Ducksass - AKA broken-record wrote:[color=blue]
> On Sat, 13 Nov 2004 22:46:59 +0100, "Barbara de Zoete"
> <b_de_zoete@hot mail.com> wrote:[color=green]
>>On Sat, 13 Nov 2004 21:41:06 GMT, Titus A Ducksass - AKA broken-record
>><me@neverumin d.com> wrote:
>>[color=darkred]
>>> Cant use java script as a lot of my users are in fact blind.[/color]
>>
>>And how are hover effects and drop downs (done in what ever way) going to
>>be useful to these people, if I may ask?[/color]
>
> I am interested in getting the drop downs as a method of removing
> screen clutter - 30ish menu items to 4 main areas.[/color]

I would suggest not bother making the drop-down submenus accessible to
keyboard users, among which are blind users. Make the 4 top-level items
links to section index pages. List the submenu items as plain text links
on this page.

I suggest this because I am primarily a keyboard user myself. I've come
across a few DHTML menus that automatically open a submenu when focus is
put on the parent menu item. This can be a royal PITA. It means that if
I'm tabbing to get to the last menu, I have to go through all those
other menus first. For someone using a screen reader, they could still
end up listening to 30 links on every page. It is counter-productive.

Granted, there are usually ways for a keyboard user to get around these
annoynaces, but the point is the annoynace needn't be there to begin
with. A limited number of choices per page is not a bad thing. Don't
feel you need to include a site map on every page. Make a separate page
for that and/or include site search.

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.

[kchayka]

Re: Critique CSS layout (1st go - fingers crossed)

Henry wrote:[color=blue]
>
> That's why I'm using default 1024x768, 32 bit with normal font, using
> great monitor, 19" CRT ViewSonic with refresh rate 120.
>
> The next resolution is not comfortable for me.[/color]

Then don't use it. Your preference doesn't mean no one else should use
it, either. I also have a 19" monitor, but set to 1600x1200. I would set
it even higher, but then the refresh rate would be unacceptable even for me.
[color=blue]
> I'm about 51 years old and I do wear 2 pairs of glasses. I pair is for
> working with computers, other for reading and long distance.[/color]

I have a separate pair of glasses, too. My eyesight is not good and gets
worse every year. So what's your point?
[color=blue]
> And I can't complain about font size of Yahoo.[/color]

Which is not surprising considering you're using such a low screen
resolution.

There are ways to compensate for higher resolutions that make text more
readable. You apparently don't need them, but I and many others do. One
of those ways is setting a suitable browser default text size. Yahoo
seems to think I don't know what's good for me in my own browsing
environment.

Just because they're big, doesn't make them right. In fact, big sites
are often some of the worst offenders.

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.

[Titus A Ducksass - AKA broken-record]

Re: Critique CSS layout (1st go - fingers crossed)

On Sun, 14 Nov 2004 08:26:41 -0600, kchayka <usenet@c-net.us> wrote:
[color=blue]
>Titus A Ducksass - AKA broken-record wrote:[color=green]
>> On Sat, 13 Nov 2004 22:46:59 +0100, "Barbara de Zoete"
>> <b_de_zoete@hot mail.com> wrote:[color=darkred]
>>>On Sat, 13 Nov 2004 21:41:06 GMT, Titus A Ducksass - AKA broken-record
>>><me@neverumi nd.com> wrote:
>>>
>>>> Cant use java script as a lot of my users are in fact blind.
>>>
>>>And how are hover effects and drop downs (done in what ever way) going to
>>>be useful to these people, if I may ask?[/color]
>>
>> I am interested in getting the drop downs as a method of removing
>> screen clutter - 30ish menu items to 4 main areas.[/color]
>
>I would suggest not bother making the drop-down submenus accessible to
>keyboard users, among which are blind users. Make the 4 top-level items
>links to section index pages. List the submenu items as plain text links
>on this page.[/color]

Makes sense.
[color=blue]
>I suggest this because I am primarily a keyboard user myself. I've come
>across a few DHTML menus that automatically open a submenu when focus is
>put on the parent menu item. This can be a royal PITA. It means that if
>I'm tabbing to get to the last menu, I have to go through all those
>other menus first. For someone using a screen reader, they could still
>end up listening to 30 links on every page. It is counter-productive.[/color]

It sounds terrible at the moment - menu is on main page only. All
other pages link back to the main page and possibly some sub pages.
[color=blue]
>Granted, there are usually ways for a keyboard user to get around these
>annoynaces, but the point is the annoynace needn't be there to begin
>with. A limited number of choices per page is not a bad thing. Don't
>feel you need to include a site map on every page. Make a separate page
>for that and/or include site search.[/color]

Its a site I inherited a couple of years ago which desperately needs
re-branding and a new direction. The site has c.350 pages not
counting the intranet.

There is no site map but there is a google search built in.
I used to use Atomz until they added adverts from google.
I now use google without adverts. <GRIN>.


<A message to top posters. Type your reply here>

--
Never be afraid to try something new. Remember that a lone amateur
built the Ark. A large group of professionals built the Titanic.

[lime]

Re: Critique CSS layout (1st go - fingers crossed)


"Lachlan Hunt" wrote in message ...[color=blue]
> lime wrote:[color=green]
>> "Lachlan Hunt" wrote in message ...[color=darkred]
>>>* Remove most, if not all <br> elements, and replace them with more
>>> semantic options. (Most will be replaced with correct <li> and <hn>
>>> elements)[/color]
>>
>> <hn>? This one I'll need to read up on as I'm not familiar with that
>> one...[/color]
>
> <hn> is simply a common abbreviation for the heading elements, <h1> to
> <h6>, where n represents the number. There is actually no <hn> element in
> HTML, I just incorrectly assumed you would understand what I meant.[/color]

Aha! Simple, thanks.
[color=blue][color=green]
>> PS: I now have this Aussie song stuck in my head because of your name...
>> 3 girls chanting L-A-C-H-L-A-N[/color]
>
> I'm not sure what song your referring to.[/color]

They play it on Triple J, it's by "Your wedding night", it's actually 2
girls chanting not 3. Great song...

[Leonard Blaisdell]

Re: Critique CSS layout (1st go - fingers crossed)

In article <2vmlu7F2n865pU 1@uni-berlin.de>, kchayka <usenet@c-net.us> wrote:
[color=blue]
> Leonard Blaisdell wrote:[color=green]
> >
> > Works great in that ancient Mac browser IE5.5.[/color]
>
> AFAIK, there is no IE 5.5 for Mac. Is that a typo?[/color]

Sure was. I only wish I had something higher than 5.1.

leo

--
<http://web0.greatbasin .net/~leo/>

[Uncle Pirate]

Re: Critique CSS layout (1st go - fingers crossed)

lime wrote:[color=blue]
> http://www.limelightstudio.com.au/iss/html/[/color]

Nice work. Clean, simple, easy on the eyes.

--
Stan McCann "Uncle Pirate"
Webmaster/Computer Center Manager, NMSU at Alamogordo
Cooordinator, Tularosa Basin Chapter, ABATE of NM; AMA#758681; COBB
'94 1500 Vulcan (now wrecked) :( http://motorcyclefun.org/Dcp_2068c.jpg
A zest for living must include a willingness to die. - R.A. Heinlein