Re: [WSG] Structuring CSS

2008-06-10 Thread Peter Ottery
re -  Out of curiosity, it wasn't an actual physical stop watch was it?

of course not - it was an abacus! ;-)
nah in all seriousness, it was before the time of firebug, and around
the time of the birth of this mailing list.
yes it was literally a stopwatch - which was enough for me at the
time. i timed a bunch of different page structure scenarios a bunch of
times and used averages. it was enough to get some basic findings and
tweak the project.

in this age of broadband the amount of time yr saving gets less
significant as an overall %, but its still nice to look after the
country folk ;-)

pete


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] Structuring CSS

2008-06-09 Thread Peter Ottery
re - How are you guys structuring your CSS files?

for me, multiple css files for different parts of the page is harder
to manage. I'm pretty old school  keep everything within the 1 css
file (within reason). this also means 1 http request which is good.
exceptions are if you had a massive admin section or something you'd
probably create a separate, additional, css file just for those pages.

to make it easier to find stuff in a css file i tend to structure my
css roughly like the html...with tabbed in sub sections

so:

#header {stuff here}
 #logo {...}
 #nav {...}

#content {...}
 #main-column {...}
  .featurebox {...}

 #sidebar .featurebox {...}

i find this helps me when revisiting a file after a while. i also
format my css so they dont wrap for each attribute or whatever...
meaning each rule takes up 1 line. the tabbed formatting really comes
into play there and you can very quickly scan down the doc to find the
section you need... much like you scan a html structure.

an example of mine (albeit not meticulously formatted):
http://www.mollio.org/css/main.css

of course firebug makes finding stuff so much easier these days,
giving you a filename and line number! its almost cheating... ;-)

my 2c

pete ottery


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] Structuring CSS

2008-06-09 Thread Peter Ottery
Anton wrote...
-
In regards to I'm guessing this sort of structuring comes at a cost
because a number of requests need to be made to the server. this is
generally untrue. In principle this is exactly how download
accelerators work. They split a large file into smaller segments and
sent multiple requests. Since the browser environment is completely
multi-threaded it should actually boost performance. (Note: I am not
100% certain if this is the fact, but there is no evidence to suggest
otherwise either).
-

If its a small site, with not much traffic I think you'd be hard
pressed to notice the difference. For large news sites that get
smashed with traffic, I've sat there with a stopwatch and timed the
difference (over different speed connections from dialup to broadband)
between separate css files, and all in 1. And just having 1 file is
definitely faster.

in some cases it would bring the initial [1] load time [2] from
something like 6 seconds down to 3 or 4. and then bringing all the css
into the head of the page rather than a linked file chopped another
second off.

as i said - only applicable if extreme performance/optimisation is an
issue - but it *does* make a difference.

[1] - with an empty cache
[2] - the time taken for the page text to appear, the page might
continue loading for 10 or so seconds after this so loading in pics
etc. mileage varies

pete


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] Best way to clear a float

2007-11-12 Thread Peter Ottery
re - using the 'clearfix' fix... as a way of clearing floats by
not adding any additional markup

i've always thought that argument was a bit of a stretch. You are
adding extra markup - and its hardcoded presentational markup. What
happens when you have class=clearfix all through your code and then
you have a bit of a design makeover and some areas that were
previously clearing floats are now doing something different? not only
do you have to change the css, you've also got to change html to move
some of the clearfix classes around.

As others have said there's not one best solution - it'll depend on
your situation.

Using divs that are already there to do the clearing is, i think,
best. My second favourite is using a hr (*if* its a meaningful
separation of content) and then applying
{clear:both;visibility:hidden} to the hr to do the clearing.

as a last resort if i had to add some extra markup to do it, i'd
favour an empty clearing div over an extra class on a parent div (the
clearfix method). Yeah its a little dirty, but in some cases i've
found its easier to maintain when handed over to other
teams/developers/cowboys.

just my 2c :)

pete ottery


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] ABC News Online have a new website

2007-06-18 Thread Peter Ottery

Brad wrote:


Really enjoying the new ABC News website here in Australia.
http://abc.net.au/news/


ditto - love it. an amazing achievement to get that up and out. i
particularly like the nice little attention to detail like the css
hovers/icons on the links and the inline video. the video section
itself is hot too - the my playlist thing is very slick. although
the play playlist link could scream out a bit more.

someone out there on the list must have been involved :) surely
give us the goss about how it went/is going. congrats.

pete ottery


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] Map of Australia Image Map

2007-05-24 Thread Peter Ottery

re - Has anybody seen or created way of displaying  States on hover
using CSS only?

Hi Felisimina,

have a look at the front of http://www.domain.com.au/
i worked on a previous version a while ago (so dont shoot me for any
other code on the site ;-)

it uses a sprite image for the hover - check it out -
http://www.domain.com.au/stylesheets/ImagesZeus/mapAusSmall.gif

basically the technique described under Irregular shapes in
http://alistapart.com/articles/sprites

hope this helps,
pete


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] Map of Australia Image Map

2007-05-24 Thread Peter Ottery

Paul wrote:


Of course the problem was made easier by the fact
that most of the borders between Australian states are on the
horizontal or vertical, but you handled the major exception between
NSW and VIC excellently by expressing ACT as a strategically-placed
and -sized rectangle.  Good work!


ha :)
thru the wonders of archiving tho I dug up my original which left the
state borders as-is:
http://c41.com.au/map/

yep, its not perfect, the hover doesn't crossover exactly on the
borders because we've only got rectangles to work with in a box model
- but i thought this worked pretty well considering.

pete


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***



Re: [WSG] IE hacking.

2006-03-20 Thread Peter Ottery
re  Perhaps this could be forwarded to Microsoft as I am a customer and have
asked them to build a standards compliant browser and yet they have
chosen to ignore me.

I for one think Microsoft deserve massive kudos.
They *are* doing all they can to make IE7 a decent standards compliant browser.
Yeah, it was a while coming, but things could be worse.
pete o
**
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] .net question

2006-03-17 Thread Peter Ottery
Peter Goddard wrote:-- I would even suggest that you-- consider picking up the basics of aspx page development, not the code,-- but the web controls that are available in .net and see if you can
-- suggest how you can work more closely ...a great informative post Peter.Another vote here for the collaborative approach.I was in a similar situation with a .NET dev guy and took the what can I do to make this easier for you approach to the meeting. He ended up installing Visual Studio on my machine, pointed me in the direction of the templates  repeatable elements, and I looked after all the html/css framework for him. the collaboration had other knock-on positive side effects and he's now an avid css advocate :)
cheers,pete o


Re: [WSG] maximum backward compartible to mobile phone (WAP) users? Which XHTML DTD?

2006-03-16 Thread Peter Ottery
re - My question is what is the best practice?  What kind of DTD to
choose?  XHTML Basic? XHTML MP?

i can offer a good link! :)
http://www.cameronmoll.com/archives/000398.html

not sure if it answers all your question. its a 3 part series. the guy
(cameron moll) is one of those rockstar designers that makes you sick
with envy ;-) (ie: he's great)

hth,
pete
**
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] tableless layout stuff

2006-03-06 Thread Peter Ottery
Jack wrote:
 But does anyone have any idea how to put that alongside the title and
 image etc without using a table? or should i just use a table?

Hi Jack,
There shouldnt be any need for a table here. just mark your list up as
a list and float your image to one side. something like this:

http://c41.com.au/test/delphinus_example/index.html
(css in the head so just view source)

hoping thats what you meant :)
pete
**
The discussion list for  http://webstandardsgroup.org/

 See http://webstandardsgroup.org/mail/guidelines.cfm
 for some hints on posting to the list  getting help
**



[WSG] Mollio

2006-03-05 Thread Peter Ottery
heya,
I presented a session on CSS at the WebDU conference in Sydney last week.

Part of the preso was the idea of having some simple pre-built
CSS/HTML templates to use as a project *starting point*. a toolkit of
sorts

So I've put my own toolkit (called Mollio) up for public consumption
in the hope that others will add to it, as I will continue to...
http://www.mollio.org/

I've set up a new google group to discuss the templates. Its linked
from the site.

As we know, when it comes to CSS there's always more than one way to
skin a cat so please keep in mind these templates are not intended to
be the absolute best way of structuring your CSS/HTML. That always
depends on your specific project.

I do find these Mollio templates are useful to use as a starting point
tho because the CSS/HTML has been constructed with robustness (is
that a word?) in mind - to allow chunks of the code to be copied 
pasted between projects and your layout/content remains intact or
requires little editing.

Anyway, enough of the gabbing, drop by and check out Mollio if you get a chance.

If youve got any thoughts about Mollio that would be of interest to
the wider WSG group, I guess post back here on the WSG list - if not,
drop by the Mollio Google Group and provide some
feedback/suggestions/contributions there.

cheers,
pete

~~~
Peter Ottery ~ Creative Director
Daemon Pty Ltd
17 Roslyn Gardens
Elizabeth Bay NSW 2011

www.daemon.com.au
**
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] flash z-index conflict

2006-02-18 Thread Peter Ottery
Ted wrote:
--  my lovely flash movie thinks it's the coolest thing on the planet
and wants to sit on top of my lovely dropdown box.

in the html code that calls your  flash movie, add this:
param name=WMode value=transparent
let us know how you go
pete ottery
**
The discussion list for  http://webstandardsgroup.org/

 See http://webstandardsgroup.org/mail/guidelines.cfm
 for some hints on posting to the list  getting help
**



[WSG] suckerfish menu and position:relative woes

2006-02-07 Thread Peter Ottery
hiya,
i dont like flyout menus as much as the next guy/girl but i have a
situation that requires them, so i'm using the son of suckerfish menu
[1].

i'm having a problem with adding position:relative to items below the
menu, and those elements appearing on top of the flyout menus in IE.
i've whipped up a barebones example with further explanation here:
http://skunkworks.farcrycms.com/pot/temp/test.html
the css  js is wihtin the head of that page to allow easy copy  pasting.

as that page details, anyone got a tip that allows me to keep
position:relative on that box but keeps the flyout menus on top (when
they flyout) ?

any help appreciated, cheers , pete

[1] = http://www.htmldog.com/articles/suckerfish/dropdowns/
**
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] suckerfish menu and position:relative woes

2006-02-07 Thread Peter Ottery
Samuel wrote:
 have you tried setting the z-index on them?

yeah, tried all sorts of z-index combinations (that i could think of)
but still cant get it working. theres a short note at the bottom of
that example page i put together...
**
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] suckerfish menu and position:relative woes

2006-02-07 Thread Peter Ottery
success! housecleaningSam wrote:-- Are negatives supported in the z-index?
yes, more about z-index at pages like: http://www.echoecho.com/csslayers.htmRic wrote:
-- Personally I don't like the suckerfish menus much.--I found these much more to my liking--http://www.tanfa.co.uk/css/examples/css-dropdown-menus.asp
interesting, and thanks - although when this problem is thrown at them, they fail in the same way. example:
http://skunkworks.farcrycms.com/pot/temp/test2.html
.
Kenneth wrote:-- I had the same issue before and had to add one line to the js code for-- the drop-downs to hover on top. The extra line is commented.
Gold. worked like a charm. giant hat tip to you Kenneth :)My script was slightly different, but adding that line in what i thought looked like the right spot fixed the problem. 

working example here:http://skunkworks.farcryc
ms.com/pot/temp/test3.html for the record the suckerfish js ended up looking like this below with that extra line added


many thanks. crisis averted! :) pete

sfHover = function() {
	var sfEls = document.getElementById(nav).getElementsByTagName(LI);
	for (var i=0; isfEls.length; i++) {		sfEls[i].
) {			this.className+= sfhover;
			this.style.zIndex=200; //Add this line to your _javascript_ Code		}
		sfEls[i]. {			this.className=this.className.replace(new RegExp( sfhover\\b), );
		}	}
}if (window.attachEvent) window.attachEvent(onload, sfHover);



Re: [WSG] Call for a new (scalable) business case for web standards.

2006-02-05 Thread Peter Ottery
Jay wrote:
 So here is the question:
 What are the benefits of web standards for small business that can be 
 sufficiently
 measured in results for the business both in the long and short term?

Jay, been thinking about this for a few days. As youve pointed out,
youre really interested in small business  short term. the long term
benefits are clear. The only tangible benefit to small businesses (in
my experience) is that you should be able to knock out something for a
small business quicker than an old skool developer. i did a site for a
small company a while ago and i didnt even mention to the guy i was
planning to use standards. all he needed to know was it would be fast
to load, and it looked good. heres the site for the heck of it:
(NOTE: do *not* click on this website if the odd swear/curse word
offends you. its just a surfboard store website, theres no offensive
imagery, but there is the odd swear word in the stores blog/commentary
:) Feedback about this aspect is not required on this list.
http://sixounceboardstore.com.au/

Only reason i link to this is that it was essentially a markup
template i had used for a previous site and then knocked this out in 4
or so hours. it might have taken someone else using tables a lot
longer to wysiwyg up all the tables  fiddle with all the nav
rollovers and stuff. the client was just happy it looked good and was
done quickly.

your 2nd question:
 How do we, as a group start to bring the message to the masses?

its already being delivered well to big business.
but for small business, I dont think we need to.
I agree with Ben.
Small business generally speaking do not need to know. unless of
course they flat out ask.  they're going to be a lot more interested
in simple costs and looks. *We* know web standards are the best thing
to apply. They are just another tool in our toolbelt. in the words of
a multinational, Just do it.

At the end of the day, web standards are just a small % of what goes
into a good website. Ease of use, aesthetic appeal, compelling content
 an accurate portrayal of the brand all play just as big a part if
not more than simply web standards. If theres competition out there
that are doing a better job of all those latter qualities they are
going to win the job even if they employ tables for layout. and quite
rightly i think.

dont take that the wrong way, i think theres a better option than
tables for layout - but we need to keep web standards in perspective.
they're not the be-all and end-all. small businesses only need a small
story when hiring someone to do their site, and in my experience, web
standards just arent a big enough story to make the cut. i just do it.

now, spreading the word to developers and designers. thats where the
action is :)

pete

~~~
Peter Ottery ~ Creative Director
Daemon Pty Ltd
17 Roslyn Gardens
Elizabeth Bay NSW 2011
http://www.daemon.com.au/

 COMING SOON
webDU - the web technology conference
http://webdu.com.au/
Sydney, March 2/3 2006
~~~
**
The discussion list for  http://webstandardsgroup.org/

 See http://webstandardsgroup.org/mail/guidelines.cfm
 for some hints on posting to the list  getting help
**



[WSG] css/html snippets

2006-02-01 Thread Peter Ottery
on the topic of css patterns and re-usable chunks of code,

there's plenty of whole css page layout resources that you can use as
a starting point for your own stuff right, like the 'ol classics
http://glish.com/css/ or http://www.bluerobot.com/web/layouts/

what about the insides of those layouts?

with every subsequent design i do i gather more and more html 
associated css chunks that i reuse over and over. if you were using
dreamweaver you'd call them snippets.

things like:

a login box
a search box
a search results pagination bar
a set of search results
a contact us form
etc... you get the idea. just the really common stuff.

obviously customisation of these would be/is required in almost all
cases as soon as you paste them in but at least a starting point
is handy

are there resources/collections of these snippets out there? i cant
find anything decent. ie: clean / semantic / sensible / 2006.

if not, maybe there's a need for something...?


~~~
Peter Ottery ~ Creative Director
Daemon Pty Ltd
17 Roslyn Gardens
Elizabeth Bay NSW 2011
http://www.daemon.com.au/

 COMING SOON
webDU - the web technology conference
http://webdu.com.au/
Sydney, March 2/3 2006
~~~
**
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] css/html snippets

2006-02-01 Thread Peter Ottery
Joshua wrote   http://webpatterns.org/

*checks it out*

ok, so the term patterns is potentially a too far advanced term for
what i'm thinking of. all that microformat and machine readable data
stuff is certainly interesting (Allsopp - i can hear you screaming
about it from here ;-) but...

I *think* what i'm talking about it different. i'm just thinking more
along the lines of a library of cut'n'paste chunks of re-usable code..

maybe i'm trying to jump to the result of what the web-patternists
are aiming to investigate.

pete
**
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] css/html snippets

2006-02-01 Thread Peter Ottery
Joshua also wrote:
 That web patterns thing people were bouncing around in here a month or
 so back? I've lost the address... if someone else doesn't post it,
 it's in the archives somewhere...

oops. yeah ok:

http://www.mail-archive.com/wsg@webstandardsgroup.org/msg24333.html

it was a good thread. i missed it. guilty as charged.
*mental note - check the archives before posting*

in saying that. i think i still have a hankering to put something together.

pete
**
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] Sitecheck: 7 Sunrise Family website [sunrisefamily.com.au]

2006-01-31 Thread Peter Ottery
Joshua wrote:
 Launched a website [ http://yahoo7.com.au/sunrise/family/ ]
and
 the BIGGEST problem (so far as I'm concerned) is with Firefox 1.0.x on the
 Meet the Family page [http://sunrisefamily.com.au/current/content/meet/ ]

I cant replicate it here using firefox 1.0.2 and win xp. you may have
fixed it..?

i think the design is awesome. a really stunning overall look - so
pass on the congrats there. and you're coding looks like youve bent
over backwards to retain the really tight visual treatment. awesome
stuff. another high profile site gets some serious quality applied.  
bravo! :)

the *only* thing i could find of any decent feedback (i, like many
others on this list lurk in the shadows unless i have something to add
:) is that the yahoo logo uses a transparent background to sit on that
black background, and the logo is reversed out as white. the result
when printing is a white yahoo logo on white paper complete with
jaggies. or seen here:
(http://au.i1.yimg.com/au.yimg.com/i/mh/2/y7mh_def_1blkbg_2.gif).
why not lose the transparency  just sit it on a black background?
then it'll print out as intended while still displaying fine on the
site.

my .075 cents worth, really only as an excuse to say awesome work :)

~~~
Peter Ottery ~ Creative Director
Daemon Pty Ltd
17 Roslyn Gardens
Elizabeth Bay NSW 2011
Web: www.daemon.com.au
**
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] Font resizing

2005-11-09 Thread Peter Ottery
Andy wrote:
 The icons themselves I cannot speak for Pete is on the list I think and can 
 step up and enlighten you as to why they were chosen... prob at the request 
 of our Editorial people.

er - thanks Andy ;-)
I think I just borrowed the idea (for the different sized A's) off
the wired.com site at the time. hey they are still there now! :)

The screen real estate available on a news article page is generally
very precious, and if you do want to have something like that on the
page (from memory it was probably a joint design/editorial
idea/request) you've got to work with a pretty small space. Agreed
they arent perfect. I like news.com.au's bigger/smaller icons on their
article pages :
http://www.news.com.au/story/0,10117,17199443-13762,00.html

ha!

so yeah,
The icons are far from perfect,
I think they are helpful for the reasons discussed earlier,
And tomorrow is friday.

pete

~~~
Peter Ottery ~ Creative Director
Daemon Pty Ltd
17 Roslyn Gardens
Elizabeth Bay NSW 2011
Web: www.daemon.com.au/
**
The discussion list for  http://webstandardsgroup.org/

 See http://webstandardsgroup.org/mail/guidelines.cfm
 for some hints on posting to the list  getting help
**



[WSG] injecting an extra hook with javascript

2005-11-01 Thread Peter Ottery
just say i have markup like this:

--
div id =utility
ul

lia href="" Item/a/li

lia href="" Item/a/li

lia href="" Item/a/li

/ul
/div
-

and for one reason or another I *dont* have access to the html markup.
Then an intricate design comes along that requires an extra hook (a
span tag) to be inserted inside each a href/a tag.
is it possible to use _javascript_ (1) to insert a span tag
inside each a href on the fly so its not in the markup - but would be
there if you were able to view the rendered source? you know what i
mean - dynamically changing the dom... or something

can you tell i know nothing about _javascript_? :)

any help appreciated.

cheers, pete

(1) - of course, without _javascript_ list items would still be accessible - they just wouldnt have the nice design inticacies




Re: [WSG] hidden link to webstandards page 4 older browsers - how does it work

2005-10-26 Thread Peter Ottery
It was a good idea at the time - but probably not a hot idea any more.
Read The Web Standards Project's line on it now:

http://www.webstandards.org/act/campaign/buc/

---
  I like this idea and wanted to implement somthing similar, but was wondering
  what was going on here since the text is being hidden. Does this only show
  up for older browsers (eg: Netscape 4.0), and if so how is that being
  implemented?
**
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] Complex form - markup help?!

2005-10-20 Thread Peter Ottery
Hi Rachel,
before you dive into the markup ( i'm not sure if this is much help
to you)  but if you can simplify the proposed visual design you may be
able to save yourself some pain in the css layout (cause agreed, it
would be fairly complex)

it took me a while to understand the form and what columns related to
what. i think it has some usability problems. are you able to lay it
out a bit simpler? something like this maybe?
http://skunkworks.farcrycms.com/pot/temp/complexform2.gif
going with something like that would require much fewer hooks to get
everything aligning right.

i realise this is off the topic of standards but it all fits in
together at some point

cheers,
pete :)


On 10/21/05, Rachel Radford wrote:
 I am completely stumped as to what the best way to attack the markup for
 this form:
 http://www.heliocell.com/complexform.gif

 It isn't a data table and yet there are headers there and it is in
 columns... so not sure if it warrants being in a table or if everything
 should be divs. But then also unsure how it would all fit together as a
 form.

 It is an internal application for a limited number of people, and
 accessibility therefore isn't a major concern - although obviously I would
 like to make it as accessible as possible in case there is need for it in
 the future.

 Anyone able to give me any advice on how to tackle this one?!
**
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] Complex form - markup help?!

2005-10-20 Thread Peter Ottery
adam wrote:
  So, the idea of context is quite important here, which is where, i
believe, a table would come in handy.

ditto. i'd feel comfortable using a table if i were you Rachel :)

if you were going to use css you'd probably need to repeat the
Discipline  split % within each fieldset - and then it just
starts overcomplicating things i reckon.

if you do go with a table - use the learnings provided in rogers
article about ids and headers:
http://www.usability.com.au/resources/tables.cfm

pete
**
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] Re: digest for wsg@webstandardsgroup.org

2005-10-16 Thread Peter Ottery
 On 10/15/05, Stefan wrote:
  How can I make the Table fill the full width of the column in FireFox and
 IE 6?

same thing happened to me with that type of layout.
I added the following rules to the tables and it sorted it for me:

table {width:100%;float:left}

cheers,
pete
**
The discussion list for  http://webstandardsgroup.org/

 See http://webstandardsgroup.org/mail/guidelines.cfm
 for some hints on posting to the list  getting help
**



[WSG] clean forms with javascript injected for a site demo

2005-10-13 Thread Peter Ottery
I need to demonstrate the design/structure of a website that will
later house dynamic content - but at the moment it is plain static
xhtml/css templates.

In particular I'd like to highlight the site search facility and how
searching for different terms can give you very different results.

I'd like to keep the xhtml markup completely clean though - so i dont
want to temporarily hardcode form submit details into a bunch of
pages. The idea is to link to a javascript file in the head of the
page that automagically enables the search box for the purposes of a
walkthough demo, so if you searched for car you'd go to
search_results_1.html and if you searched for truck you'd go to
search_results_2.html. The site would only be demo'd by me - so I'd
know what terms could be entered.

The idea then being when it comes time to cut the pages up and
implement them into a CMS the only thing that needs to be done is to
rip out the link to that javascript. The other benefit is while design
of the templates continues I have clean untouched form elements that
are easy to work with and do global find/replaces etc as all instances
of the form will be the same across multiple pages.

I consider this to be definately in the realm of best practices and at
a stretch good xhtml practice, in terms of keeping the xhtml markup
clean. (ie: i hope very much this isnt too off topic for this list :)

anyone do/done this type of thing or can link to a resource? I tried
searching but to no avail.

cheers,
pete

~~~
Peter Ottery ~ Creative Director
Daemon  Pty Ltd
17 Roslyn Gardens
Elizabeth Bay NSW 2011
www.daemon.com.au
**
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] css for ie4/ie5

2005-10-13 Thread Peter Ottery
Rhys wrote:
 But with the implementations in ie6 and the ones to come in ie7 perhaps its 
 time to finally stop worrying about ie 4/5

you're the only one that can take on that issue and make a decision
for *your* site. Different sites require different decisions. Examine
your logs and weigh them up against the site objectives (user +
business).

fwiw, I forgot about testing in IE4 about 3 years ago. I still like to
make things look ok [1] in IE5.0 but if some text is butting up
against the edge of a container due to it not supporting some float
issue or something, i dont worry about it. Its usually a better story
with IE5.5.

[1] give an example of ok to your client early on and explain why
spending 99% of your time on 1% (percentages always make your argument
sound good ;-) of their audience is not spending their money in the
right place.

cheers,
pete


~~~
Peter Ottery ~ Creative Director
Daemon Pty Ltd
17 Roslyn Gardens
Elizabeth Bay NSW 2011
Web: www.daemon.com.au/
**
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] css for ie4/ie5

2005-10-13 Thread Peter Ottery
Peter Firminger wrote:
 Not at all recommended on any machine you care about.

Just for my own peace of mind tho - they're only a security issue when
you have launched the program right? so if i'm launching them (old
standalone IE5  5.5) once a month to *only* test pages that I've
created - I'm not leaving my system open to some rogue security
breaching  action right?

pete o
**
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] Placement of company logo

2005-10-09 Thread Peter Ottery
 What do others think?

1 vote here for always making the logo a regular img and part of the
html markup. reasoning for me is a pretty simple one. its content! :)

cheers,
pete

~~~
Peter Ottery ~ Creative Director
Daemon Pty Ltd
17 Roslyn Gardens
Elizabeth Bay NSW 2011
www.daemon.com.au
**
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] Big Websites that turned Accessible

2005-10-04 Thread Peter Ottery
On 10/5/05, Zach Inglis wrote
 For an article i'm writing I need a list who have turned their
 website into Web Standard compliant websites.

there are many lists scattered around already compiled - like this one:
http://www.meyerweb.com/eric/redesignwatch/

hth, cheers, pete
**
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] WE05 - who's going?

2005-09-26 Thread Peter Ottery
Andrew wrote:
 Or how about everyone interested just bites
 the bullet and posts their photo  contact details like I just did?

i'll be there.
here's me: http://c41.com.au/
the secret password is youve been on this list *how* long and your
site still uses tables?

oh. the. horror.

:)
**
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] Standards based visual design guidelines

2005-09-14 Thread Peter Ottery
On 9/15/05, kvnmcwebn wrote:

I'm looking for some examples of standards based visual design 
 guidelines
 and wondering if you can point me to anything you've seen or 
 personally
use in your design process...?

hiya, not sure I get where you are coming from. As in, i cant think of
any instances of where visual guidelines for 'standards based' design
would be different from visual guidelines for a non-standards based
design. A brilliant, intuitive visual design is completely possible
with standards, or not. Same goes for a terrible design :)

I'll take a punt at providing some help anyway :)

The biggest things I concentrate on when designing a page are:

- defining a clear visual hierarchy. making the most important things
(according to the brief) have the loudest 'volume' - and designing
tiers of importance around that. Its often a balancing act, finding
the right balance between elements that allow the eye to quickly grasp
what the page is aiming to convey.

- providing visual separation between elements where the content is
not directly related, and conversely providing a visual link between
content that is related. this can come in the form of things like
lines, background shades or just varying amounts of space.

- clearly indicating the 'action points' on a page, whether they be
links, buttons forms etc.

they're the big picture considerations i think of when approaching a
design. If you're talking about some actual hard recommendations like
sizes, spacing, colours I don't think you'll find it. I've often
dreamt about such a project - but when it comes down to it, every
brief/project is different and I think the best approach is to keep
your guidelines very high level - something like those 3 points above.

hth,

~~~
Peter Ottery ~ Creative Director
Daemon Pty Ltd 
www.daemon.com.au (yeah yeah, redesign coming :)
**
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] Re: digest for wsg@webstandardsgroup.org

2005-07-20 Thread Peter Ottery
 Hope that made sense,
nup. youre definately going to have to show us an example. if you havent got a liveexample to show, make a really simple example by stripping out everything else and just include some html  css within your post. help us to help you! :)



On 7/21/05, Josh Rose [EMAIL PROTECTED] wrote:

Hello,

Does anyone know how to get rid of whitespace at the bottom of the page when using relative positioning on a page that has more than 1 column?

Hope that made sense,

Josh.



Yahoo! Messenger NEW - crystal clear PC to PC 
calling worldwide with voicemail 



[WSG] text alignment on form submit buttons

2005-07-18 Thread Peter Ottery
hi,
I'd like to left align the text in a form submit button. The following
seems to work in IE (5.5+), but not in Firefox:


form action=whatever
input type=submit value=Submit style=width:20em;text-align:left /
/form


(simplified and made inline for the sake of an easy example)

while realising styling form elements with css is a hit  miss affair,
is there a way to make Firefox play along and left align that text?

any help appreciated, 
cheers, pete
**
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] web stanards detection - is it possible?

2005-07-13 Thread Peter Ottery
re: 
 php sniffer script 
 Splash Page that degrades (though ... can't degrade too much) 

Sam, i gotta agree with what Michael said earlier:

Did we just hit some kind of crazy-ass time warping worm-hole thatlanded us in 1995?I beg of you, wherever you are, go out and pick up a copy of this book:
http://www.wpdfd.com/editorial/wpd1203review.htm#review2

its got some great high level principles in it that may help clear things up.
I know it changed the way I think about creating sites.

good luck mate,
pete



Re: [WSG] web standards detection - is it possible?

2005-07-13 Thread Peter Ottery
 it may be best if Peter (a list member) confirms or denies this. Peter?

well, hello there :)

re  received heaps of feedback

heaps is a stretch. if i said it, i was exaggerating  apologise. but dont sigh  curse yet! theres a better story behind it :)

While its true when we redesigned http://www.smh.com.au/and http://theage.com.au/in 2003 (?) the helpdesk received some (like a handful) of emails along the lines of I've found your website now looks very plain on my old computer at home compared to my work computer, which is good, its much faster to load now, good job. I stress it was a few, and I dont have records of these (I've since moved onto a new company). In saying that, I found some much, much, more interestingstats recently (in the last 3 months) that showed that of the 5 or so million (thats a rough figure, not exaggerated, growing month on month, dont quote it) uservisits 
smh.com.au getsper month, 25000 (Twenty five thousand) are still Netscape 4 users. How excellent is that! They get a totally unstyled page and they are still coming back for their news fix. True, its sad they are stuck with an old browser - but to me, this is a clear example of why web standards are the way forward. Those sites have seen real, tangible benefits for the move to css layoutswhich enableda richer experience for users of the latest browsers - while managing to not completely alienate the old browser crew. And those sites are getting a bit old in the tooth now (ie: theres problems with them - dont think I'm preaching they are perfect :). Any site that Fairfax Digital does now improves on the last, and leaving the content unstyled for old browsers like Netscape 4 is just the norm now for them - and certainly anything i design here on in.


Hope this helps, its kinda weird quoting stuff from an old job. While we're talking about big picture issues I dont think I'll get into trouble. hopefully ;-)

cheers,
pete

~~~Peter Ottery ~ Creative DirectorDaemon Pty Ltd 17 Roslyn GardensElizabeth Bay NSW 2011
 www.daemon.com.au/





Re: [WSG] Page structure - navigation

2005-06-23 Thread Peter Ottery
Hi Ian,
I dont think its a massive issue to do that (put the navigation at the end of the source and position it at the top of the page visually). Theres probably some people that would say this is potentially better for screenreaders, in that they aren't confronted with a massive navigation listat the topofevery page load (if you have a massive navigation list and no 'skip to content' link).


on a kinda related note - whenwe designed http://www.smh.com.au/we decided to put the left hand navigation last in the source order (although there is still some ad tag and site stat stuff after it) so that the center column would load first - hopefully speeding up the load time over dialup of the content you want to read. there were never any problems or concerns that came from that decision.


the search engine optimisation argument probably does have some weight behind it - in that if your content is higher up the page (above a load of navigation code) then you may be index'd better than a very similar site that had its content lower in the source. thats starting to split hairs though - and to a large extent not worth worrying about too much - in my opinion anyway :)


pete ottery
On 6/24/05, Ian Main [EMAIL PROTECTED] wrote:
Good morning group,I have a question regarding page structure and hierarchal order.I have a client who insists making me place the site's navigation at the
bottom of the page structure and than positioning it at the top via CSS.His reasons of doing this is for search engine optimisation?Quite frankly, this doesn't make sense to me as I thought indexing the
site's pages is pretty important stuff. Also explaining the issue aboutscreen readers and CSS off didn't persuade is discussion.Does anyone have any links to this subject or help me explain to him theright way of doing this?
P.S. Hope this isn't off topic, I'm asking help on page structure not SEO.Thanks guys,Ian Mainhttp://www.e-lusion.com**
The discussion list forhttp://webstandardsgroup.org/See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list  getting help**


[WSG] Accordion style script behaviour

2005-06-23 Thread Peter Ottery
i really like this accordion show/hide script...
http://openrico.org/demos.page?demo=ricoAccordion.html
.. and am thinking it might be useful for a really long list of FAQ's on a page.

this particular example relies on the quite sizeable 'rico' _javascript_/s (which contain a whole bunch of other behaviours - and looks amazing) but i really just need this one show/hide behaviour.

I knowthis isa pretty common behaviour - but the speed at which things develop in our community makes me think there is a great example out there somewhere that does *just* this.

anyone got an example to share?

pete

(i know next to nothing about js, hence being on the lookout for examples by the pros :)


Re: [WSG] Background image in li not showing in IE

2005-06-19 Thread Peter Ottery
Cole wrote: I've got a small background icon that I've hooked to a few li's. Displays as planned in FF, but doesn't display at all in IE6.
Any ideas how I can fix this in IE?not sure if youve solved this by now but often i find if you specify a background colour (instead of transparent), IE will play along nicely.
so instead of :li.signInOptions {background: transparent url(../../admin/i/info.jpg) 0 5px no-repeat}try
li.signInOptions {background: #fff url(../../admin/i/info.jpg) 0 5px no-repeat}
of course, then thats a pain if you have a background image that needs to sit on varying background colours. you may end up needing to feed specific colours to certain uses, eg...
#nav li.signInOptions {background-color:#ccc}
...if the li's needed to sit within a navigation area that has a background of #ccc

the other thing to try when IE isnt displaying a background image is to specify a width on the li. 
hth, 
pete ottery


Re: [WSG] Accessible form test

2005-06-09 Thread Peter Ottery
Hi Erwin,
there'd be other people on the list that could comment on the use of access keys etc i'm sure.

At a stretch I'd kinda consider some aspects of the visual presentation part of the broad spectrum that is accessibility though - or at least usability.

i like thisarticle that looks at the pros/cons of form layout, label positioning  alignment:
http://www.lukew.com/resources/articles/web_forms.html

applying some of those presentation ideas would enhance the ability to quickly grasp the different parts to the form (i'm getting some mis-alignment with some of the form labels in the enquiry details part of teh form). browser cam results here: 
http://www.browsercam.com/public.aspx?proj_id=168943

I havent read Joe's book. does he specifically recommened the use of definition lists for layout? sounds like a decent enough idea. theres potential to go without the dl though, and use the form tag itself and the label tags as the hooks to define styles  alignment.


theres a bunch of examples for form layout which youve probably already seen, i often go back to Cameron Adams' article and examples:
http://www.themaninblue.com/writing/perspective/2004/03/24/

but yeah - as mentioned,you're probably afterspecific feedback on the use of accesskeys etc - hopefully some of the gurus will chime in :)

cheers,
pete ottery


On 6/10/05, Erwin Heiser [EMAIL PROTECTED] wrote:
Hi all,I'm sorry for sending this againg but the link for the new form was wrong,that's what happens when you've been staring at a screen for too long...
I¹m pretty new to marking up forms so I decided to ³get it right² right fromthe start.I¹ve recoded a contact form they are using on a website I¹m working on.The old form (the one currently in use) is here:
http://www.pixelsandtext.be/tests/oldform.htmlThe new form is here:http://www.pixelsandtext.be/tests/newform.html
Both forms validate to their respective DTD.The old one is marked-up using tables, the new one uses a definition listand a few CSS-rules for the layout. I've read Joe Clarks book building
accessible websites and applied most of the stuff in the Forms chapter.(Funny thing, even when adding all the CSS rules and the accessiblityextra's to the HTML the file size is roughly the same as the old form)
Would some of the WSG accessibility gurus please have a look at this form?I'd welcome any comment and/or suggestions...Thanks in advance,Erwin Heiser**
The discussion list forhttp://webstandardsgroup.org/See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list  getting help**


Re: [WSG] a elements and what they can contain

2005-05-26 Thread Peter Ottery
re: a elements may only contain other inline elements

hang on,
so if i have an anchor tag wrapped around an image (display:inline by
default), its deemed fine by the validator, but if I make that image
display:block via the css, (for design purposes, which must be a
pretty common practice on many, many sites - including many i've
designed) would that practice be frowned upon if the validator could
validate your markup *and* the corresponding css at the same time?

possibly some bigger questions there - one being, why shouldnt you be
able to wrap a anchor around a block level element? i know the
difference between inline and block, and the fact that block elements
cant be inside inline elements - but this particular anchor question
seems a bit shakey

pete
**
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] a elements and what they can contain

2005-05-26 Thread Peter Ottery
Damien wrote: 
 As to your question about a tags for block level elements, can you
 give an example when you would use this? 

not a good one, no :) i had a fleeting thought like what if, for some
ungodly reason, you wanted to link an entire sidebar div to another
page - but it was fleeting. just me being too questioning :)

john wrote:
 In terms of the document tree, and as far as a validator is
 concerned its still a block or inline element as defined by the DTD.

a, ok. cool. explains a few things. silly me.
see you at the pub :-)

pete
**
The discussion list for  http://webstandardsgroup.org/

 See http://webstandardsgroup.org/mail/guidelines.cfm
 for some hints on posting to the list  getting help
**



[WSG] label tag wrapping around checkbox

2005-05-22 Thread Peter Ottery
sports fans,

if you had part of a form that had a checkbox that when checked
enabled a file upload input, how would you mark that up?

the result should look something like this:
http://skunkworks.farcrycms.com/wsg/label/label.gif

but i wasnt sure what the label tag/s would/should wrap around...

i'm thinking something like...

label for=addthumb
input name=addthumb id=addthumb type=checkbox value=1 /
Add thumbnail image:
/label
label for=path
path to image:
input id=path name=path type=file disabled /
/label

...and then hide the path to image text in the css so its audible to
a screenreader - but maybe not needed otherwise.

thoughts welcome,
pete ottery
**
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] Cleaner two column float left?

2005-05-04 Thread Peter Ottery
Tee wrote:
  Is it possible to make it this way and make IE happy at the same time?
 div class=twoCol
 labelitem 1/label
 labelitem 2/label
 labelitem 3/label
 labelitem 4/label
 labelitem 5/label.
 /div
 So that I don't need to put a spacer class in between every two items.

there may be other issues affecting your problem, but on the surface
it looks like you'd just set the width of the label to be a smidgen
less than half the width of div class=twoCol.

eg, make label 20em wide, and div class=twoCol 41em wide (i'd
leave 1em buffer space just to allow for slight rendering differences)
and then the labels would stack on top of each other in 2 columns.
get me?

hth, pete
**
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] Re: [WSG Announce] Web Essentials 05 Launched

2005-05-03 Thread Peter Ottery
 Maybe a specific topic addressing the commercial benefits of Web
 Standards at WE05 could have been included.


I believe there is. 
1.30pm, day 1...


Brett Jackson, John Horner, David McDonald
Panel: Moving your organisation to standards
Theme: Strategy
Audience: Managers
http://we05.com/program.cfm


Brett Jackson was my boss at Fairfax Digital for a while. He can
translate the business benefits to management until they're begging to
throw money at a web standards project :) And then along with John 
David, that session looks the goods.

i cant wait personally. like the blurb said, its a great way to catch
up with a lot of people in the industry and exchange these ideas. its
not just the presenters i'm paying for when i purchase a ticket.

pete ottery
**
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] Padding tables in IE

2005-05-02 Thread Peter Ottery
Andreas wrote: I am having difficulties getting IE to give a table a padding-left. 

I dont think adding padding to the table itself is going to be reliable - as youve found out :)
I'd say that what you want to do is add padding to the cell/s of the table.

If you want to add padding to one column of the table (in your cae the left column), apply a style to a col tag [1] like this:style type=text/css
.1st-column {padding-left:25px}/styletable border=1col class=1st-columncolcol
trtdblah blah blah/tdtdblah blah blah/tdtdblah blah blah/td/tr/table


[1] more info: http://www.w3schools.com/tags/tag_col.asp

hope this is of some help, 
cheers, pete ottery

On 5/2/05, Andreas Boehmer [Addictive Media] [EMAIL PROTECTED] wrote:
I am having difficulties getting IE to give a table a padding-left. I can'tfigure out why this doesn't work, but perhaps somebody else can see my
mistake:http://www.adictivemedia.com.au/clients/gta/home2.htmlYou can see on the Drafts Table that the text overlaps the left side of
the background-image. This only seems to happen in IE - Firefox acknowledgesthe padding I gave the table and moves everything 25px inwards:#draft table{padding:0 15px 0 25px;}Any ideas on how this could be fixed?
Thanks heaps!Andreas BoehmerUser Experience ConsultantPhone: (03) 9386 8907Mobile: (0411) 097 038http://www.addictiveMedia.com.auConsulting | Accessibility | Usability | Development
**The discussion list forhttp://webstandardsgroup.org/See 
http://webstandardsgroup.org/mail/guidelines.cfmfor some hints on posting to the list  getting help**

Re: [WSG] Padding tables in IE

2005-05-02 Thread Peter Ottery
Andreas Boehmer wrote:
Gee, that's a new one to me! Is col a HTML 4 tag? I've never come acrossit. 

absolutely, a quick googling turns this article up - looks like quite a good rundown...
http://www.yourhtmlsource.com/tables/tablesaccessibility.html

or theres always the w3c spec if youre up for a really invigorating read ;-)
http://www.w3.org/TR/REC-html40/struct/tables.html#h-11.2.4

Andreas Boehmer wrote:
 Then again: haven't worked with tables in a while.

nothing wrong with a good ol table when its used appopriately! :)

Re: [WSG] Mystery connection of css and non-liquid design

2005-05-02 Thread Peter Ottery
On 5/2/05, Gunlaug Sørtun [EMAIL PROTECTED] wrote:
Andreas Boehmer [Addictive Media] wrote: Something I find really strange is that a lot of people who put emphasis on Web Standards suddenly found their way back to non-liquid, 800px, centered design. I am wondering why that is?


i really admire a well made fluid width site. I think a fixed width
site is potentially easier to maintain and set boundaries and limits
for people who may be providing content to a site (like a definte size
for a feature picture whos size may form a strong element to the page
layout). 

I dont see the argument of if your site layout is a clone of someone
elses its not as good as a completely unique layout as a valid one.
Site design is becoming mature. Design patterns (or dare i say
'standard') that make sense and work (like fixed width and a top nav
strip) emerge and these patterns are reused simply because they work,
not because someone is lazy and copied. (I'm talking about layouts in
general here, not outright copying of graphic design - thats obviously
not an admirable quality.) 

As with lots of things in this game, it comes down to what your
situation is. of course the beauty of a css layout is if you and your
client change your mind, you can easily change your site to behave
differently with a few css tweaks :)

anyway, thats just my 2c :)
pete ottery

Re: [WSG] new mycareer.com.au design

2005-04-27 Thread Peter Ottery
hi, thanks for your kind words and feedback peoples. have tried to quickly answer those main questions below:

re  Just curious to know what the many lines of CDATA code achieve and the
reason for putting them inline?

no idea personally :) , but the dev guy says it's definitely something
we want to move to an external file at some point in the future

re  With Firefox I went to
Job Alert and selected some industriesmy cursor appeared
somewhere above the textfield. Must have something to do with the css
positioning of your fields.

ugly indeed. forwarded.

re  Hate to be the bearer of bad news

dont worry about that. if i was worried about the possibility of bad news i'd never get anything done ;-)

re  The time it takes to load the home page on dial-up is awful ... I guess agility of the design and

the speed is a relative term, but it took close to half a minute to load the page.

half a minute is actually better than i thought it'd be first time load over dialup. seen far worse.
the css file is hefty, and theres several large 'sprite' images that
hold navigation/tools/icon graphics. hopefully you'll find subsequent
page loads much speedier with the obvious caching benefits.

re  home page doesn't even pass automated Section 508 accessibility checks

well spotted! forwarded.

re  The design doesn't quite fit at 800x600 in my browsers (Firefox and IE6 on Win2K Pro) - a little too wide.

are you using one of those 'sizer' apps that changes your browser
window to a certain size that emulates a 800x600 display? be warned,
browser chrome has changed in the last few years and often their
calculations for width are out by a few pixels. try physically changing
your screen res and maximising the window. you may not get a horizontal
scrollbar.

re  In Firefox, if I click on
the dropdown for maximum salary, it does not let me select (it appears,
then disappears immediately). I have to hold my mouse down and
drag to make a selection. Annoying.

ugly indeed. forwarded.

re  When you click on ADVERTISE. You only are left with a HOME tab.Just a little thing that threw me off a bit :)

bit off topic for this list but very on topic for the site. cheers, forwarded :)

re  I would love to know whether the actual careers engine was an in-house thing or third-party.

in house

re  if your concerned about my obsolete browser--the layout breaks in ie5 mac

theyre working on it

-

thanks again for all the other feedback, techy stuff forwarded on  i'm sure they'll look into it :)

i'll buy yous a beer at the wsg meeting tonight. oh hang on, theyre
included in the cover change arent they? :) ok, i'll open it for you ;-)

pete



[WSG] new mycareer.com.au design

2005-04-26 Thread Peter Ottery
very proud to say the new mycareer site launched today:
http://mycareer.com.au/

its the next major site from the Fairfax Digital network to take on css
layout as part of a redesign. the site gets hundreds of thousands of
visitors a month and is one of australias largest job ad websites.

check it out, be good to hear any feedback/ideas for further
improvement. as always with a large scale commercial project there are
comprimises made in some areas, but for the most part i'm pretty darn
happy with the design.

css was a huge part of the redesign (which also overhauled some of the information architecture).
all the developers were keen on the benefits and the business people love the agility of the design and the speed.

cheers,
pete ottery

ps: i'm no longer at fairfax digital but designing the site was the last major project i did before leaving.
rest assured i'll pass on any feedback to them :)




[WSG] a required field marker in forms

2005-04-22 Thread Peter Ottery
I've set up a base standard form layout to use as a starting point for
projects requiring a form - with text input boxes, check box's, radio
buttons, a select menu, and a text area that could all be swapped in
or out or duplicated relatively easily.

here's the page:
http://skunkworks.farcrycms.com/wsg/forms.html

2 questions, 

1) I'm curious if the use of an asterix to indicate a required field,
and the way I've done it, is ok accessibility-wise or if theres
anything else i could/should do...?

2) theres also an error message placement that would flick on if
you've missed a required field:
http://skunkworks.farcrycms.com/wsg/forms_error.html

the error message seems to be displaying fine across a wide range of
browsers (courtesy of browsercam:
http://www.browsercam.com/public.aspx?proj_id=157477) except good ol
mac ie5. if anyone can see an easy fix for mac ie5 that'd be most
welcome.

cheers,
pete

~~
Peter Ottery ~ Senior Designer
Daemon Pty Ltd 
17 Roslyn Gardens
Elizabeth Bay NSW 2011 
www.daemon.com.au
**
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] a required field marker in forms

2005-04-22 Thread Peter Ottery
Dmitry wrote:
 Hi Peter,
 I am not shure about asteri, but I think it is not very usable that if
 I click on the text near checkbox, checkbox doesn't change its state.

for sure. that behaviour (thanks to using labels) works for me in PC
IE5+ and Firefox (which is a pretty large slice of users) in this
example.

what browser are you looking at it in?
**
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] Disjointed Rollovers in css

2005-04-19 Thread Peter Ottery
Jackie wrote:
 i would like to be able to make a disjointed rollover in css, you know 
 rollover the text and the image nearby changes colour or whatever.

Hi Jackie,
I think youre after something like this (on eric meyer's site):
http://www.meyerweb.com/eric/css/edge/popups/demo2.html
(mouseover the left nav)

Also, Doug Bowman highlighted a double rollover technique he used on
the adaptive path redesign [1] a while ago, but it seems to have
disappeared from the live site for some reason. be interesting to know
if  it was removed due to a bug or if they just decided to remove it
for non tech reasons...

[1] http://www.adaptivepath.com/

anyway, hth, 
cheers, 
pete

~~
Peter Ottery ~ Designer
Daemon Pty Ltd 
www.daemon.com.au
**
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] navigation using arrows for location

2005-03-03 Thread Peter Ottery



hi there,

  Pete originally 
  said:so 
  I've designed myself a nice looking navigation scheme that displays visually 
  whereabouts you are within a site.Now I just need to work out how to sort 
  out the css :)http://c41.com.au/test/sample_nav.gif
  
  then Rob said:That's pretty. Pretty smart 
  stuff.I've some things in my head. Give it a shot, and if you don't 
  succeed,don't hesitate to ask.
thanks - hada chat to some of the 
guys at the WSG Sydney meeting last night. If you put an ID on every li you 
could achieve the result I'm sure, but themany, many, background images 
and overly complicated css would make the solution not very workable. Starts to 
feel like a ye olde table building method. If it is used on a clients 
sitethey should be able to add some extra li's and it should still hold 
together.

I've had a play with some css and arrived 
at this:
http://c41.com.au/test/nav_test.html
(shows gif 
original concept and the new html version using 1 'sprite' [1] gif for the 
arrows/lines)

As you can see, 
the vertical lines are the catch am trying to think 'outside the square' to 
solve the prob but I cant see how you could do it without an id on every and li. 
I made "Archive" active in the first list to show how the need for the vertical 
line to go up *or* down to point to the next list complicates the 
issue.

I'm not going to 
kill myself over this one. Potentially the best solution is to put some 
background images on the parent div that just show vertical lines that go all 
the way from the top to the bottom between the lists, which would still give the 
impression of "drilling down through a hierarchy" type of thing. Would be sweet 
if we could get it working tho :)

any ideas, wacky 
or otherwise, appreciated.

pete

[1] http://www.alistapart.com/articles/sprites/


[WSG] navigation using arrows for location

2005-03-01 Thread Peter Ottery



so I've designed 
myself a nice looking navigation scheme that displays visually whereabouts you 
are within a site.

Now I just need to 
work out how to sort out the css :)

Here's what I want 
it to look like:

http://c41.com.au/test/sample_nav.gif

I'm *not* after any 
dynamic or popout (suckerfish [1]) type functions.
Essentially the 
tricky bit is going to be the light red lines/arrows and working out how to get 
them in the right spot. ie: so they'll adjust to line up with the section you 
are in.
There's also going 
to be content below this navigation, so if one of the lists grew really long it 
should push down the content (ie: may rule out absolute 
positioning)

Wondering if anyone 
has some immediate ideas or even has a similar example..?

Ideally I'd imagine 
the html should look something like this:

ul 
id="nav"
li 
class="active"By Expertise
 
 
ul
 li 
class="active"Architecture

 ul
 
liWoodCentre/li
 
li250 Latin 
Street/li
 liEl 
Changeo/li
 li2 
Changed 
Ave/li
 
liChangewood 
Facilities/li
 li 
class="active"Active 
Project/li
 
liPark in 
Perth/li!
 
 li11 
Smith 
Street/li
 li58 
amp; 88 Changed 
St/li
 
/ul

 
/li
 liInterior 
Design/li
 liUrban + landscape 
design/li
 liHeritage 
conservation/li
 
liConsulting/li
 
/ul

/li
liBy 
Location/li
liArchive/li
/ul

any thoughts or help 
appreciated,
pete


[1] - http://www.alistapart.com/articles/dropdowns/


RE: [WSG] Is XHTML harmful?

2004-10-06 Thread Peter Ottery



Kim wrote:
 Now I would like to 
know what your arguments would be for using xhtml.Hi 
everyone,have heard and understand all the good responses on this question. 
As usual the decision can vary depending on your needs.I'd like to offer 
one reason why it has been a good decision for us here at Fairfax Digital (or 
potentially the better known smh.com.au [1]  theage.com.au 
sites).When we proposed and pushed the idea of using css for layouts, it 
was (and still is) a radical change for many parts of the business and the way 
the sites are developed. Many hands work on our sites. We still run into lots of 
problems with markup errors due to that amount of content that comes from 
different areas/hands. The fact is we have many people within the organisation 
that are still coding ala 1998 style. missing /p tags, or no p 
tags, no headings, unclosed tags, lists using br's, unencoded entities, 
etc etc. probably every sin in the book.When we started spreading the 
message of CSS and standards internally we knew that if it succeeded it would 
take a long time  then stick for a long time. We have lts of sites that 
often don't get a code revamp for years. Hence we wanted a plan that had some 
legs.The reason we chose xHTML had a lot to do with speading the message 
that xHTML stands for. ie: tidy, lean, valid code etc. yeah i know its a lot 
more than that but for these people, thats the point that concerns them. 
We needed to get people realising that its important to close your tags, its 
important to make your tags lower case, its important to use a hx tag 
for a heading. (yeah its probably a heading 'element', not tag, but you know 
what i mean ;-)So when we 'sold' the CSS concept internally, we 'sold' 
xHTML along with it, and everything that goes along with it to focus attention 
on better coding practices.So yeah, that may sound crazy for some, but 
its a real world situation for us, and its something that has seen massive 
benefits. Its working. The xHTML doctype and standards mode (as opposed to 
quirks mode) is helping to focus attention internally on the need for better 
markup. We aint perfect, but its a big organisation and these things take time. 
Product managers (who have no idea what CSS even stands for) now want to know if 
their new design will use xHTML and sprites. funny, but true.I'm glad we 
jumped in though and am comfortable with our stance on the subject. If we waited 
till our sites were valid before doing anything, I fear we would never even get 
into the game.
[1] I did a preso at a WSG meet a while ago on the 
redesign of this site using css, heres the link if yr interestedhttp://webstandardsgroup.org/go/resource210.cfm
cheers,petePeter OtteryHead of 
DesignFairfax DigitalLevel 3 Wharf 7 Pirrama RoadPyrmont NSW 
2009www.fairfaxdigital.com.au


RE: [WSG] Is XHTML harmful?

2004-10-06 Thread Peter Ottery
Title: RE: [WSG] Is XHTML harmful?






Lachlan wrote:


 On use of validation: valid code is not difficult.





 Pete, I'm assuming from your comments that you aim for valid code by 
changing institutional practices rather than programmatically?


Agreed on both.


The reality in big organisations is developers have a long list of things to do and correcting code that may not be causing a problem for the business right now, today, in $ terms, usually doesn't get a high priority on that list. and pages consequently sit there, invalid.

Of course its the purpose of this list and all of us on it to re/educate people/clients, highlight the benefits,  reverse that practice so we get this thing right.

pete








RE: [WSG] Table-style admin layouts

2004-10-05 Thread Peter Ottery



 Is 
there a best-practice way to build an item 
 display 
with multiple columns, but without using tables?

 Name Price 
Quantity Edit Delete 
Apple $5.00 
25 [edit] 
[delete] Pear 
$4.00 
3 [edit] 
[delete] Banana $12.00 
5 [edit] 
[delete]1 vote for "thats table data - use a 
table"and your bananas are very expensive.:) pete 



RE: [WSG] Best Aussie and Kiwi web standards designers

2004-08-25 Thread Peter Ottery
Title: RE: [WSG] Best Aussie and Kiwi web standards designers





Andy asked  However I'm always on the lookout for more cool, standards compliant sites, so wondered who you guys felt which companies and individuals were turning out the best work down under?

2 that i'm pretty sure are on this list:
http://www.freshweb.com.au/
http://www.glassonion.com.au/


and 
http://waferbaby.com/
which is related to:
http://www.segpub.com.au


this is just a quick blurt from my short term memory and i'm in no way affiliated with any of these.


anyone else?


pete






[WSG] [OT] Employment opportunity in Sydney - Reply off list

2004-08-24 Thread Peter Ottery



Below is a job opportunity at the company I work 
for.Please reply directly to me off list if you are 
interested.Permission was granted for this off-topic post by the list 
organisers.
Apologies for the 
outlook formatted html email. oh the irony ;-)
cheers, 
pete=Fairfax 
Digital is looking for a highly experienced full-time Web Designer to join the 
Creative Services team, located in Sydney.
Fairfax Digital 
is one of Australia's largest online publishers with a network of 35+ sites that 
includes:

  
  http://www.fairfaxdigital.com.au
  
  http://www.smh.com.au/
  
  http://www.theage.com.au/
  
  http://www.mycareer.com.au/
  
  http://www.domain.com.au/
  
  http://www.drive.com.au/
We want 
to speak to you if...

  
  You are first and 
  foremost a standout visual designer. You have a demonstrated ability  
  proven track record to design large and/or commercial web sites that are 
  attractive, simple and functional. (Include links to examples of your work in 
  your resume). We are looking for a heavyweight Photoshop 
  addict.
  
  You are extremely fluent 
  in taking your designs  hand coding them using web standards (html, 
  xhtml, css) efficiently in a production environment to produce templates ready 
  to be passed onto backend developers. You have a very strong demonstrated 
  ability with css  feel completely at-home using css to its limits to 
  construct page layouts that realise your intended designs, and are accessible 
   valid. You will need to be a heavyweight Homesite, BBEdit, Dreamweaver 
  (code view) or similar user. (We are a PC based team.)
  
  You thrive in a 
  collaborative team environment with other designers and information 
  architects. We are looking for a dynamo communicator that expresses themselves 
  well in a team, can follow art direction  can also work autonomously with 
  clients/stakeholders on large projects. Your communication  collaboration 
  skills will be as highly regarded as your technical skills.
  
  You have a demonstrated 
  awareness of business and marketing issues and understand their relationship 
  to web design
  
  You have a proven 
  understanding of accessibility  usability and their relationship to web 
  design
Bonus 
skills that would be highly regarded:
_javascript_, 
Microsoft Visual Studio .NET, XML, vector graphics (adobe illustrator 
etc)
Salary: 
In the range of $60,000 - 
$65,000If you meet the above criteria, please apply 
by:

  
  Sending an email with a cover letter (within 
  the body of an email is fine) telling us why you would like to work for 
  Fairfax Digital and how you meet all the above criteria, along with an 
  attached resume (word doc or PDF no bigger than 1Mb) detailing your 
  qualifications, work history  capabilities.
  
  Important: You must include 
  examples (or links to examples) of your web design work in your resume. 
  Showing us live sites is going to help.
  
  Send the email to me (pottery at fairfaxdigital 
  dott com dott au) by 6pm Friday 17th September '04. note: email address 
  formatted this way to avoid (ok, reduce :) spambots.
Peter 
OtteryHead of DesignFairfax Digital
Level 3 Wharf 7 Pirrama 
Road
Pyrmont NSW 
2009T: 02 8596 4450
F: 02 8596 
4466
www.fairfaxdigital.com.au


[WSG] list item markers disappear behind floated image

2004-08-17 Thread Peter Ottery
Title: list item markers disappear behind floated image





Hi,
I have a problem with images that are floated left and then when a list wraps around that image the list bullet points themselves dont get pushed out by the floated image and instead remain behind (or on top of) the image. to help explain i've put a simple demo page together to show the problem in its most basic form  explain in a bit more detail:

http://c41.com.au/test/ul_test.html


the css is all inline  very basic. the img tag has an empty src on purpose. this is just an *example* of the prob. dont fear, the execution looks better than the example :)

basically what I'm looking for is if there is a way to make the list item markers always obey the floated image, but just behave as normal when the image doesnt appear.

any help greatly appreciated. hope i've explained this well enough...
pete



ps: apologies if my emails arrive in your inbox as html or rich text. I send them as plain text and i think the mail server here forces them to be plain/rtf on the way out. please dont reply to this list about this problem.




RE: [WSG] list item markers disappear behind floated image

2004-08-17 Thread Peter Ottery
Title: RE: [WSG] list item markers disappear behind floated image





 Russ wrote: This may sound insane but the problem is fixable by floating the ul element.ul { float: left; }


that does sound weird but on reflection of the finer points of the behaviours of floats, does make sense. fix a float with a float...

this method should do the trick for my situation as the next thing after the ul will need to be clear:left anyway. so thanks! :)

 drew wrote: Try giving the ul list-style-position:inside. No need for additional p or div.


ah ha! so thats what list-style-position:inside is for. have often wondered. the only drawback i can see from that is that when the list item text wraps, it wraps right back underneath the marker (and your text isnt all nicely aligned left). Again, in my situation this wouldnt affect me cause the text is of a gauranteed length and wont wrap (in all but the most exteme cases of text sizing, and I'm not concerned about alignment in those instances) so I can use this method aswell.

thanks guys! not 1 but 2 workable solutions. great stuff.
cheers,
pete


ps: in breaking news (sorry, cant help myself) please dont reply to this list about this, but there are 2 whales outside my window *inside* darling harbour (past the bridge in sydney harbour). theres a bunch of people taking photos so hopefully one will end up on shameless plughttp://www.smh.com.au//shameless plug. which uses a css layout. see. on topic ;-)




RE: [WSG] RE: Image replacement techniques for linked elements

2004-08-15 Thread Peter Ottery
Title: RE: [WSG] RE: Image replacement techniques for linked elements





 James wrote:
 I have my minimum font-size set to 12px, so 
 websites can't set text I can't read (or see for that 
 matter) - like 6px :D. I think this is rendering your (ed: smh.com.au) plain text headers 
 to be 12px - and they are appearing over the image headers on the 
 smh.com.au home page ... making both types of headers unreadable.


GOLD medal to James in the advanced font setting relay! :D
you are the 1st person *ever* to pick that up.
seriously tho, cheers for that, a valid point indeed, and noted.


 James then wrote:
 I've done this on one of our new websites (text changed to make more 
 sense in this context), and it works quite well with images turned off 
 or on. Or am I missing the point of image replacement techniques?
 h1a href="" title=link to the sport page
 img src="" height=60 width=470 alt=sport /
 /a/h1


nah i dont think yr missing the point. looks like a solid method.
The major benefit for us at present for the method we used is the lower strain on the server. ie: having the image as a background image that is part of the sprite image and called once, used repeatedly for a bunch of other images, and eases the load on the servers a fair bit.

Can someone out there in accessibility guru land tell us if an image (only) used as a h1 heading is as good as regular text used as a h1 heading? ie: does the alt text on the image (in James' example above) become the defacto heading and get used in the methods the screenreaders use to scan headings on a page? At the WSG meet earlier in the year that David Woodbridge from the Royal Blind Society came to and demo'd that shortcut used that popped up a box with all the headings on the page listed... just wondering if an img's alt text would show up in that list - and other similar scenarios/readers...? 

 James wrote:
 not sure how it works with search engines


i dont know if anyone would know for sure (other than the search engines themselves). Google reads alt text on images - but whether it finds that alt text within a h1 tag and then assumes that's the heading and applies the same points to it when the googlebot scans the page is another thing...

pete :)





[WSG] RE: Image replacement techniques for linked elements

2004-08-08 Thread Peter Ottery
Title: Re: [WSG] sitecheck on Mac (Safari, IE5) and Win (IE 5/5.5) please?



 Scott 
wrote: Has anyone had any luck with an image replacement techniques that leaves 
the link available?

Hi 
Scott,

We use 
a variant of image replacement for the section headings on the homepage of www.smh.com.au
ie: 
the section headings in the main centre column start about 800px down the page - 
"WORLD", "NATIONAL", "SPORT" etc in the blue font - all 
caps.

these 
are still linked. the actual (non graphic) heading is just using the technique 
[1] of making the font size 1px and white (so its not visible on a white page) 
leaving the background image visible. the link that contains the heading is 
given a width  height and display:blocklike your example so that the 
link "hotspot" is forced to stay big enough and cover the desired 
area.

That 
has worked for us pretty well. Haven't had any complaints about weird display or 
anything

the 
css is all inline on the homepage so its easy to "take a look under the hood" 
:)

I dont 
mind it. With css disabled the heading is just a linked heading. I should say 
I'm not a fan of image replacement techniques in general but in this case for us 
we had the need to use a graphical heading font (to match the offline product) 
and didn't want to bloat the page with lots of images. (we used sprites and 
loadedwhat we couldinto sprites [2])

cheers,
pete

[1] http://www.maxdesign.com.au/presentation/headings-as-images/index.cfm#option4
[2] http://www.alistapart.com/articles/sprites/


Peter 
OtteryHead of DesignFairfax Digital
Level 3 Wharf 7 Pirrama 
Road
Pyrmont NSW 
2009T: 02 8596 4450
F: 02 8596 
4466
M: 0403 192 
858E: [EMAIL PROTECTED]www.fairfaxdigital.com.au


RE: [WSG] 4-column layout

2004-07-29 Thread Peter Ottery
Title: 4-column layout



 is there any 
examples that allow for a mixture of fluid and fixed 
divs?

can 
you have any of the columns position:absolute or do they all have to be floated? 
(maybe you have a requirement for a footer to run right across the bottom of the 
4 cols etc?). just thinking it may be easier if the extreme left and/or 
right columns could be position:absolute...

pete

  


RE: [WSG] Div CSS VAlign

2004-07-15 Thread Peter Ottery
Title: RE: [WSG] Div CSS VAlign





 Can someone help with how I align a DIV Layout made with the x and y scale 
vertically and horizontally


a google search for vertical and horizontal css centered div gives the following urls that may help you out - tho I'm not sure I've nailed your specific problem...

http://www.hicksdesign.co.uk/journal/30/vertical-centering-with-css
http://www.hicksdesign.co.uk/journal/62/vertical-horizontal-centering-2


and those pages eventually led me to this example:
http://www.wpdfd.com/editorial/thebox/deadcentre4.html


hope this helps,
pete





RE: [WSG] Redesigning smh.com.au amp; theage.com.au with css

2004-06-21 Thread Peter Ottery
Title: RE: [WSG] Redesigning smh.com.au amp; theage.com.au with css






 Nancy wrote:
 This seemed like a very interesting meeting, 
 would it be possible to publish the actual CSS files?


Hi Nancy, thanks for yr interest :)
By 'actual CSS files' I assume you mean for the sites discussed - smh.com.au  theage.com.au..?
Point your browser in the direction of those URL's and dig away :)
I should mention, in a recent development (since the presentation), we've inlined the CSS on the homepage - primarily for performance issues. Granted the nature of CSS makes so much more sense when it comes from a central linked file/s - but the situation with these news sites and the amount of sustained traffic they get at peak periods meant inlining the CSS made a noticeable difference in load time over a modem (and even a small difference could be observed over a network connection). All other pages (articles etc) have a linked css file as normal.

pete



Peter Ottery
Head of Design
f2 Network


(02) 8596 4450
[EMAIL PROTECTED]
www.f2.com.au










RE: [WSG] Redesigning smh.com.au amp; theage.com.au with css

2004-06-21 Thread Peter Ottery
Title: RE: [WSG] Redesigning smh.com.au & theage.com.au with css



Hiya,
sorry, 
dont mean to add to the list traffic too much but just wanted to point out that 
your Mozilla extension added in some of its own styles etc when used to copy and 
paste those styles Amit. (changed colour values to rbg and added things like 
"border: medium none"...)
cheers,
pete

   
  I was just going to say that Pete 
  :)
   
  use firefox/mozilla and dig out the CSS with the 'web developer 
  extension.
   
  Here you go Nancy.
  
   
  Regards,
   
  Amit Karmakar
   
  www.karmakars.com
  
  snip pasted smh css was 
  here/snip


[WSG] position:absolute problem

2004-05-31 Thread Peter Ottery



hiya, this is 
hopefully a simple little problem - but my brain is refusing to work today 
:)

on this test 
page...
http://c41.com.au/test/position_test.html(yep, 
validated)
...is the example of 
the problem (i've stripped out all the extra html/css to make it easier for you 
to peruse)

I want the blue box 
to appear at the bottom left of the red box (so itsinside the red box) - 
and i want the text to overlap it.

In IE6 PC, the blue 
box appears at the bottom of the content - so, outside the blue box altogether, 
not good.
In Mozilla the blue 
box appears in the right spot but it overlaps the text. I need it the other way 
around so the text overlaps the blue box.

Now, I'm aware of a 
little "hack" if you add "width:100%" to the ".main" div the blue box pops up 
into the desired position in IE, but 
a) I'd rather not 
apply a width and 
b) that hack still 
leaves the blue box overlapping the text (and i've tried fiddling with z-index, 
see the example)

ideas?

pete


RE: [WSG] CSS solid lines and Opera

2004-05-24 Thread Peter Ottery



 How do I show 
solid lines in a table with CSS to properly display with an Opera web browser? 


that example code you've supplied makes a 
border on all 4 sides of a TD in my copy of Opera (v7.22 on 
PC)

Could 
it be that other classes on your project are causing the prob? Like a negative 
margin/padding on the outer table or something? At this point many others on the 
list would probably say "post and example online so we can see the prob in 
context" :)

pete

  
  
  
  


[WSG] about that new way to clear floats

2004-05-24 Thread Peter Ottery



so you know how 
there's that new way to clear floats...
http://www.positioniseverything.net/easyclearing.html

just wondering how 
everyone is gauging that method?

I mean,the 
"hack" used up until now of adding a div style="clear:both"/div 
(or similar) to properly clear floats when needed is pretty straightforward, 
albeit a bit of code that always felt unnecessary...

But this new method 
has the _javascript_ requirement to fix mac ie5 and uses the "holly hack" anyway. 
to me, at least initially, it feels like a bit of a "rabbit warren" style of 
fix, meaning it seems more convoluted than the problem its 
solving...

I guess I just 
wanted to know if everyone is going to jump in and start using that new method 
or wait and see if it has some pitfalls? (similar to the whole image replacement 
technique thing or the box model hack that initially sounded likea godsend 
for some situations but has come unstuck as a method as time went 
by...)

Pete



RE: [WSG] SMH launch

2004-05-02 Thread Peter Ottery



sorry, bit 
late,
re my question of 
 any ideasof a way to make these browsers keep 
the background image aligned hard left and not adversly affect anything else? 
(on http://smh.com.au/)
and Justins alternative 
ideas: Alternative 
#1"attach the background image to something other than the body (like 
#wrap)"i wouldve - but the layout that we settled on has the left and right 
columns "position:absolute" for a few other reasons so when the left or right 
cols are longer than the centre column, the background doesnt tile all the way 
to the bottom of the page. tried various methods of adding a height to the #wrap 
but all options seemed to have a 'gotcha' :) (a bad side effect) Alternative #2"perhaps the line effect you're trying 
to achieve can be done some other way, negating the need for the image at 
all"for reasons related to the above absolutely positioned 
columns, a background image was the only way to go Alternative #3"Ignore what's happening, and put a 
solid white background behind that left nav bar, so that when the BG image goes 
under, it doesn't obstruct the navigation."bingo. actually made this change last thurs 
after yr email  made the bg the same colour as the nav (light grey - 
actually, get this, its #F2F2F2, as in,F2 is where i work :)that 
degrades much better for opera and mac ie now.

thanks again Justin. thats 2 for 2 
;-)cheers,petePeter OtteryHead 
of Designf2 Network(02) 8596 
4450[EMAIL PROTECTED]www.f2.com.au

On 29/04/2004, at 1:27 PM, Peter Ottery 
wrote:
 when we launched theage.com.au last week Justin 
pointed outa way 
 (adding 1px padding to the left of the main 
"#wrap" div) to make 
 Firefox keep the background image aligned hard 
left with the content 
 when your browser window was narrower than the 
content - and stopped 
 the background image becoming mis-aligned with the 
content.
 
 Even tho that fixed it in Firefox the problem 
still exists in Opera 
 and mac ie. Heres a screenshot of the new smh site 
with a browser 
 window set narrower than the content (note the 
body bg mis-aligned 
 with the left nav):
 
http://www.c41.com.au/test/opera7_2_squished.jpg
 
 any ideasof a way to make these browsers 
keep the background image 
 aligned hard left and not adversly affect anything 
else?
 
 pete



RE: [WSG] SMH launch

2004-04-28 Thread Peter Ottery



hi 
y'all,

yep, 
http://www.smh.com.au/went live this 
morn.
For 
anyone who has ever read both http://theage.com.au/(launch mentioned 
last week) and smh will know they have used the same basic page templates for a 
few years. The css redesign of both sites has obviously continued that common 
base - hence the major similarities in layout but some different colour/graphic 
treatments.

annnyway,

thanks for the early compliments - appreciated - I think there are 
some unrelated network problems happening at present so if you cant see the site 
right now that'd be why. hopefully will be fixed shortly. in the meantime I'll 
take a shot at answering these questions 
Benvolio:)


~ How you identified a redesign was 
necessary

from a 
business point of view:
they 
had a long list but briefly, we needed to improve "breaking" news ( making 
more prominentthe amount of content that is updating constantly), make 
space for different ad formats,be able to makespecial sponsored 
sections in a short turnaround, make the whole site faster. 

from a 
design point of view:
the 
site was becoming a bit of a rabbit warren. heaps of content that, at times, was 
unfindable.
the 
markup was old and we figured we could speed the whole site up using 
css/xhtml.
the 
visual design was also a bit "loose" - meaning a bit free and easy with lots of 
differences between different pages. we wanted to achieve something more 
structured and of a higher quality. 

~ How you got buy-in from the key 
stakeholders that a redesign was necessary

it was 
almost the other way around. the key stakeholders have been after a redesign for 
a long time.
resources and many different departments looking for different things in 
a redesign meant it took a long time to finalise.

~ What were the target areas you 
wanted to improve and update

Breaking News: The perception from users was they were unaware when and 
how often our site updates during the day.sounds like basic stuff but a 
ticker, a clock, more prominent links to breaking news, and rotating pics are 
the main improvements here.
Dead 
ends: article pages also had some major problems in that they had 'dead ends' 
when you finished reading the article (nowhere to go but scroll back up the page 
or go to another site), so search/more news links/main section links have now 
been added to bottom ofarticles. 
Graphics: consistent style/sizes were needed to tighten the design 
up
More 
logical navigation: as mentioned, the old site was a bit of a rabbit warren. 
we've tried (and there's still room for improvement here) to organise these in a 
more logical fashion

~ What kind of usability // surveys 
// focus groups // lab // eye tracking testing you did

basic 
goal orientated usability testing / focus groups / online surveys / user testing 
with regular cameras and also groups of users using the site with us watching 
from behind a1 way (?) mirror like CSi miami ;-)

~ How you migrated the templates (you 
guys use Fatwire as the backend yeah?)

had to 
ask the tech guys about this one :) Fatwire? yes. templates weren't migrated as 
such. they were rebuilt from scratch. and the the templates are broken up into 
little blocks and are common across sites (smh/age)

~ How you went about browser testing 
and what browsers you promised the stakeholders you would test for

we 
have a person dedicated to testing once the page is in the final stages of dev. 
We do our own testing before a design reaches dev though. we drew the line at IE5 earlier 
this year- so we promise/support/test in IE 5.0, 5.5 6, Moz 1.5, 
Firefox 0.8, Mac IE5+, Safari, NS7. Its basically just a numbers game. eg: we 
dropped support for IE4 because the numbers got low enough and not supporting it 
means we can be more adventurous with the design/css and concentrate on 
providing enhancements to the larger % browsers noted above.

~ How rigorous was your test 
plan

the 
dedicated testing person basically has a running sheet of things to test and 
probs found. its pretty comprehensive but things still do slip thru - that's 
just web page making :) my testing is basically the same as Russ' and 
many others on this list recommend - build a small bit - test across browsers, 
move on in a modular fashion. you end up with a great knowledge of 
the reasons behind the errors and can pinpoint probs 
quickly.

In 
saying that, probs still come up. things like a problem that has just come up 
for Moz/FireFox that *don't* have flash installed on the frontpage have 
unfortunately become apparent after launch and are being fixed shortly. 
apologies if you are one of those crew. the (flash) breaking news ticker didn't 
render and caused the layout to do funny things - and yes, we do need to improve 
the flash code.

~ How many releases and iterations 
you diddo before final release

there 
was probably about 15 or 20 decent increments in the initial design phase. can 
bring some of these to the WSG meeting. In between these though were 

RE: [WSG] SMH launch

2004-04-28 Thread Peter Ottery



when we launched theage.com.au last week Justin pointed outa 
way (adding 1px padding to the left of the main "#wrap" div) to make Firefox 
keep the background image aligned hard left with the content when your browser 
window was narrower than the content - and stopped the background image becoming 
mis-aligned with the content.

Even tho that fixed it in Firefox the problem still 
exists in Opera and mac ie. Heres a screenshot of the new smh site with a browser window set 
narrower than the content (note the body bg mis-aligned with the left 
nav):
http://www.c41.com.au/test/opera7_2_squished.jpg

any ideasof a way to make these browsers keep the 
background image aligned hard left and not adversly affect anything 
else?

pete


RE: [WSG] theage.com.au: new design

2004-04-20 Thread Peter Ottery
Title: RE: [WSG] theage.com.au: new design





Hi Tim,
re  I noticed, was in the print style sheet where 
you've set a 600px width for #content. Shouldn't you be letting the UA 
set it's own margins for printing?


yep, guilty as charged, in a mad rush i put that in as a quick solution (opera seemed to chop off the last word or so on the right when i didnt specify a width..?) but i'll be looking at that today to get a more scaleable solution 


re  have you considered including a rule in the print stylesheet for 
those using CSS3 capable browsers to print the URL of links?


i will now ;-)


cheers for yr feedback,
pete


-Original Message-
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED]]On
Behalf Of Tim Lucas
Sent: Tuesday, April 20, 2004 6:04 PM
To: [EMAIL PROTECTED]
Subject: Re: [WSG] theage.com.au: new design



Peter Ottery spoke the following wise words on 20/04/2004 10:27 AM EST:
 hiya,
 we relaunched theage.com.au today with improved markup and a css layout.
 http://theage.com.au/
Peter, once again my hat goes off to the f2 team.
One interesting choice , I noticed, was in the print style sheet where 
you've set a 600px width for #content. Shouldn't you be letting the UA 
set it's own margins for printing?
Also, have you considered including a rule in the print stylesheet for 
those using CSS3 capable browsers to print the URL of links?
-- tim lucas
www.toolmantim.com





RE: [WSG] theage.com.au: new design

2004-04-20 Thread Peter Ottery
Title: RE: [WSG] theage.com.au: new design





James wrote:
 It's great to see such a large site being discussed openly on the list.


agreed. feels a bit weird - but hey, we're one big happy family right? ;-)


 Other than what has been discussed, the only I thing I can see is the 
markup:
p class=standardsNote
That will be visible to your search engines... it would be better to put this behind a help link on the site.


also agreed. to be honest we were worried about the NS4 crowd (and other similar browsers) seeing the unstyled page and hoped that this message would ease the shock and provide some useful info.

what has occured is not ONE such email, (which is obviously great) so we are ripping it of shortly.


thanks James :)


pete







[WSG] theage.com.au: new design

2004-04-19 Thread Peter Ottery



hiya,
we relaunched 
theage.com.au todaywithimproved markup and a css 
layout.
http://theage.com.au/

a couple of 
points of interest:

  a big part of the 
  redesign was improvingthe markup- ie: obviously using h 
  tags and ul tags etc. still have a ways to go and it'll be a learning 
  process for the many editors etc that maintain the site (which is why you may 
  come across some irregularities in parts of the site). the pages pass thru 
  s many sets of hands to make it to the live site (so be gentle :) eg: - 
  information architects - design (me) - CMS/tech guys - 
  editors
  the layout is 
  centred and fixed width - mainly for editorial reasons/requests for tighter 
  control over positioning and relationships between elements on the page (eg: 
  pictures relating to headlines). the default css is for a layout that fits at 
  800 wide, then a script detects if you are browsing at 1024 wide or higher and 
  loads a 1024 csslayout (which just overrides some of the width values 
  etc). this was to satisfy the need for tight control over the layout but to 
  also try to optimise the layout for the ever growing 1024+ audience (stats 
  below).
some 
interesting stats:

  in the last 
  monththeage.com.au hashad 1,718,644 unique 
  visitors
  browser stats for 
  the last month
  
IE6 - 73% 

IE 5.5 - 9% 
IE 5.5 - 9% 

IE 5.0X - 7% 

Mozilla - 1% 

Firebird - 1% 

Safari -0.7% 

  screen res stats for 
  the last 
  month
  
1024x768 - 
55%
800x600 - 
27.4%
1280x1024 - 
7%
1152x864 - 
3.3%
1400x1050 - 
1.35%
(those %'s wont add 
up - they are just the main ones 
:)
  page weight (markup 
  only)
  
yesterday - 
65k
today 
- 
37k
any 
thoughts/feedback/problems spottedappreciated - as long as they're 
relevant to this list of course (if they're not feel free to email me 
directly).

pete
Peter 
OtteryHead of Designf2 Network(02) 8596 
4450[EMAIL PROTECTED]www.f2.com.au 



RE: [WSG] theage.com.au: new design

2004-04-19 Thread Peter Ottery
Title: RE: [WSG] theage.com.au: new design






hi,


Justin wrote:
 Firefox loses it's navigation bar 
 (left) when resized down from 
 1024 to 800 wide
 and
 place a 1px border or padding on the left edge of the layout, which 
 will force your layout to disappear off the right edge of the window 
 only (not the left), which will mean the behaviour is normal for a 
 1024 layout viewed at 800.



 Martin wrote:
 strange behaviours happening with overlaps 
 and the left column disappearing out of the 
 viewport at sizes smaller than 800x600 


I did see this before but figured it was something we'd (unfortunately) have to live with - but i've just implemented your suggestion Justin (HUGE thanks obviously! :) of a 1px padding on the left of the #wrap and firefox now looks to be behaving correctly, with no adverse affects on anything else : http://theage.com.au/

one thing though, as you scale your window down in Firefox, below 800 wide, you'll see the adverts keep drifting - and still cover up some content... any ideas let me know ;-)

how good is this list!


pete








RE: [WSG] Relative Fonts

2004-04-06 Thread Peter Ottery
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






[WSG] dreamweaver

2004-03-16 Thread Peter Ottery



anyone using 
dreamweaver?

as far as 100% valid 
transitional and strict xhtml sites go, can dreamweaver have its preferences etc 
manipulated enough to be to produce markup and css exactly the way you want? 
I've always used homesite religiously to handcode sites but may need to look to 
dreamweaver to satisfy some more complicated templating needs and sharing them 
across several designers (which dreamweaver looks like it can handle) - i just 
need to ensure dreamweaver can be whipped into line to produce squeaky clean 
standards based markup. (and yeah, i've read the macromedia site blurbs - but I 
was hoping to hear from anyone that has a lot of first hand experience with it - 
particularly on large scale sites maybe sharing templates between 
workmates etc)

pete




RE: [WSG] Open source Relevant CSS tab?

2004-03-15 Thread Peter Ottery
Title: RE: [WSG] Open source Relevant CSS tab?





El lun, 15-03-2004 a las 04:04, Tim escribió:


 Sounds to me like the 'Show computed styles' bookmarklet
 http://www.web-graphics.com/mtarchive/000846.php


i tried that but the link to the actual favelet seems to be broken.
i eventually tracked it down on this page: http://www.pixy.cz/blog/favelets/
titled List computed (cascaded) style, and while I can get it to work on *that* page, i dont seem to be able to work on other pages after i drag the 'favelet' to my links toolbar or add to favourites and try using it from there...? am i missing something? using WINXP  IE6.

looks like a handy tool but.. brain..not.. working ;-)


pete






RE: [WSG] New CSS site

2004-03-11 Thread Peter Ottery



 http://www.cinema4duser.com
 Comments and crits 
most welcome.

first 
impression: looks lush! very slick. easy to scan/understand whats going 
on..

some 
real quik thoughts that may relate to the css but also some general stuff (take 
with a grain of salt and all that ;-)

  with 
  yr standards alert message("NOTE: You are using an outdated 
  browser"etc) -you could maybe link to a page in the message with 
  some links to the browser makers sites - otherwise youre basically saying 
  "download something better - you work it out" ;-)
  I'd 
  expect the big main pics for the feature article, feature artist to link to 
  those sections aswell as the "go" button. gotta make those graphics work for 
  themselves :)
  i got 
  the 'fouc' when i first loaded yr site (http://www.bluerobot.com/web/css/fouc.asp)you could add a print css to avoid the 'fouc' and also 
  remove some of the graphics from the printer version...?
  the 
  font sizes in some areas are pretty tiny, and i cant re-size them in IE... you 
  could maybe include a font size re-sizer thing? even if just for the big areas 
  of text like articles...?
pete 
ottery



RE: [WSG] Purpose of this mailing list

2004-03-09 Thread Peter Ottery
Title: RE: [WSG] Purpose of this mailing list





David wrote:
 I don't know if I'm for splitting 
 the mailing list up into several lists. 
 
 Are others in favour of doing this? Or not?


I'll put my hand up for not splitting the list and also for leaving as-is.
I can deal with the volume and think the continual cross-over between standards opinion/theory and practice is pretty valuable for all the reasons mentioned.

the pointers to succinct explanations on Russ' maxdesign site (http://webstandardsgroup.org/resources/) or elsewhere on the web seem to work well and keep the repetitive 'how-to' emails (that are always going to come up no matter what you do) to a minimum thread length.

pete


Peter Ottery
Lead Web Designer
f2 network - www.f2.com.au
02 8596 4450





[WSG] classguide

2004-02-26 Thread Peter Ottery



hiya,

I noticed that the 
much publicized new qantas airline - http://www.jetstar.com/- 
launchedtheirsite with a css layout.
I havent had a real 
look at the code, but my question is more about class and id names. when you 
have a pretty complicated site and you end up using some sort of naming 
convention for classes/ids like they have on jetstar such 
as:

class="c1FsFc"

...that classname 
obviously means something to the web team at jetstar but no one else. does 
anyone put together a document on handover detailing what everything means in 
their css to aid any changes down the track that someone else may have to make? 
kinda like a "classguide" as opposed to a styleguide? it'd involve layout 
classes and stuff aswell - so wouldn't be as easy as just a page with an example 
of each style applied to a bit of text ... 

interested if anyone 
has this sort of thing or similar built into their process and any experiences 
youve had.. ?

pete


RE: [WSG] A new standards based smh.com.au/technology

2004-02-25 Thread Peter Ottery
Title: RE: [WSG] A new standards based smh.com.au/technology





Hi Tim,
thanks for yr kind words :)


I was going to send a note around to the list when we fixed a 
few things up with it but just havent had time...


ok, so few points:


*  yep, the new tech section is our first live site 
 using css for layout. any site we build from 
 scratch from this point will be using css for layout. 
 if we're ammending old sites we'll probably use the existing 
 (table) layout, but it'll be a case by case thing.


* we were all quite stoked in the design team when we
 got to the end of the first day and hadnt recieved 
 one email from a user saying the layout was funked up
 or they couldnt read the text or any of the other usual
 emails we get when we launch something of a decent profile


* the validating thing is difficult - for the reasons you 
 pointed out mostly. I think wired had some similar issues 
 with ad tags etc when they launched. There's probably some 
 other bits of code that arent validating either that we 
 can improve on as we go. the projects move so fast that 
 its very difficult to do anything past making sure it 
 looks decent in IE5, 5.5, 6, Opera, Mozilla, Safari - and 
 then we're away. We value the importance of validation bigtime, 
 but we dont kill ourselves over it. hence we've chosen 
 the 'transitional' approach.


* we've learnt more about css layouts since the design was 
 locked down (first week of jan) and while the positioning 
 of the left and right columns are floats in this design, 
 we'll be using absolute positioning for those columns in the 
 future. mainly to get the main content further up in the markup.


*  to answer How were the 'forces of power' in f2 convinced 
 to invest in web standards and what commitment by management 
 was needed? question:


 a) we illustrated how much money we'd save on serving costs 
 due to lighter pages. Its hard to predict an exact figure but I 
 think it'd run into hundreds of thousands of dollars once 
 we convert the whole network over to css. 


 b) we are obviously very focussed on budgets etc - its a 
 commercial business - so as sites are needing quicker and 
 quicker redsigns to keep up with the market and advertising 
 needs we had to standardise and make redesigns as simple as possible.


 c) better markup = better chances of ratings on search engines


 d) at the moment our 'network' of sites doesnt look much like a 
 network. css is going to help standardise elements and the look  feel.


 e) easier implementation for the dev guys. now that the 
 pages are cut up into little bit size chunks (divs), they 
 arent fooling around with our non-breaking spaces, br tags,
 col/rowspans in tables other stuff. and that one has just 
 been proven. easiest and smoothest implementation of one 
 of our designs yet.


 f) pages load faster


We're also lucky to have a great very persuasive manager 
ourselves who was able to put all this into a message that 
was even more attractive to the wider Management who really 
just want to know does it look great? and how much 
did it cost?.


In short, we're pretty excited. And a little nervous. Youve 
gotta understand, this is pretty nerve racking putting such 
a high profile design up, (i think its over 400,000 unique 
users a month now for just this section) and having the design 
community/this list check it out :) you know that feeling you 
get when you preview something in opera and your heart jumps up 
into your throat as youre waiting on it to load.. :)


anyway, thumbs up to Andrew Coffey, one of our 4 designers 
(including myself) here that was the lead designer on this one. 
Let us know if you can spot any major display errors or anything. 
In saying that, we've learnt a lot since this design got locked 
down (as is the way with this css game - its so hard to keep up! :) 
so keep an eye out for some major improvements across the whole 
smh/age sites proper over the next few months.


if anyones got any other questions, let us know, i could 
talk underwater about this stuff ;-)


pete 



Pete Ottery
Lead Designer
f2 - fairfax interactive network
P: 02 8596 4450
E: [EMAIL PROTECTED]





-Original Message-
From: Tim Lucas [mailto:[EMAIL PROTECTED]]
Sent: Thursday, February 26, 2004 1:00 AM
To: [EMAIL PROTECTED]
Subject: [WSG] A new standards based smh.com.au/technology




Just received an email[1] from my SMH subscription stating they've 
launched a new website, SMH.com.au technology:
 http://www.smh.com.au/technology


I have to admit. I was a little cynical and was preparing myself for an 
onslaught of presentational markup and zilch semantic markup. Off I went 
and viewed the source of the new website and... low and behold... its 
semantic markup laid out purely with CSS (otherwise known as a CSS-P 
layout).


Hats off to the f2 network web team (I know you're on this list!) for 
moving SMH's policies toward a 

RE: [WSG] A new standards based smh.com.au/technology

2004-02-25 Thread Peter Ottery
Title: RE: [WSG] A new standards based smh.com.au/technology





 I'd certainly like to use them if you have no objections.


of course not, its an important message. gotta get it out there :)


we're going to try to put together a whats new about the design page on the site with some more concise detail on it for future designs. that'll hopefully be a good page to point those clients to aswell :)

pete


-Original Message-
From: Nick Lo [mailto:[EMAIL PROTECTED]]
Sent: Thursday, February 26, 2004 11:20 AM
To: [EMAIL PROTECTED]
Subject: Re: [WSG] A new standards based smh.com.au/technology




Hi Pete,


Funny, I was going to mention this to the list but I hesitated. 
However, after your reply below I'm glad Tim didn't hesitate. I don't 
know about anyone else, but your reasons why, coming from such a high 
profile site, are a great advertisement/example to Australian clients 
of reasons to use web standards.


I'd certainly like to use them if you have no objections.


Nick


 Hi Tim,
 thanks for yr kind words :)

 I was going to send a note around to the list when we fixed a
 few things up with it but just havent had time...

 ok, so few points:

 *   yep, the new tech section is our first live site
     using css for layout. any site we build from
     scratch from this point will be using css for layout.
     if we're ammending old sites we'll probably use the existing
     (table) layout, but it'll be a case by case thing.

 *   we were all quite stoked in the design team when we
     got to the end of the first day and hadnt recieved
     one email from a user saying the layout was funked up
     or they couldnt read the text or any of the other usual
     emails we get when we launch something of a decent profile

 *   the validating thing is difficult - for the reasons you
     pointed out mostly. I think wired had some similar issues
     with ad tags etc when they launched. There's probably some
     other bits of code that arent validating either that we
     can improve on as we go. the projects move so fast that
     its very difficult to do anything past making sure it
     looks decent in IE5, 5.5, 6, Opera, Mozilla, Safari - and
     then we're away. We value the importance of validation bigtime,
     but we dont kill ourselves over it. hence we've chosen
     the 'transitional' approach.

 *   we've learnt more about css layouts since the design was
     locked down (first week of jan) and while the positioning
     of the left and right columns are floats in this design,
     we'll be using absolute positioning for those columns in the
     future. mainly to get the main content further up in the 
 markup.

 *   to answer How were the 'forces of power' in f2 convinced
     to invest in web standards and what commitment by management
     was needed? question:

     a) we illustrated how much money we'd save on serving costs
     due to lighter pages. Its hard to predict an exact figure but I
     think it'd run into hundreds of thousands of dollars once
     we convert the whole network over to css.

     b) we are obviously very focussed on budgets etc - its a
     commercial business - so as sites are needing quicker and
     quicker redsigns to keep up with the market and advertising
     needs we had to standardise and make redesigns as simple as 
 possible.

     c) better markup = better chances of ratings on search engines

     d) at the moment our 'network' of sites doesnt look much like a
     network. css is going to help standardise elements and the 
 look  feel.

     e) easier implementation for the dev guys. now that the
     pages are cut up into little bit size chunks (divs), they
     arent fooling around with our non-breaking spaces, br tags,
     col/rowspans in tables other stuff. and that one has just
     been proven. easiest and smoothest implementation of one
     of our designs yet.

     f) pages load faster

 We're also lucky to have a great very persuasive manager
 ourselves who was able to put all this into a message that
 was even more attractive to the wider Management who really
 just want to know does it look great? and how much
 did it cost?.

 In short, we're pretty excited. And a little nervous. Youve
 gotta understand, this is pretty nerve racking putting such
 a high profile design up, (i think its over 400,000 unique
 users a month now for just this section) and having the design
 community/this list check it out :) you know that feeling you
 get when you preview something in opera and your heart jumps up
 into your throat as youre waiting on it to load.. :)

 anyway, thumbs up to Andrew Coffey, one of our 4 designers
 (including myself) here that was the lead designer on this one.
 Let us know if you can spot any major display errors or anything.
 In saying 

[WSG] double quoting

2004-02-24 Thread Peter Ottery
Title: double quoting





Hi guys,


theres a CMS (content management system) I'm dealing with that is converting some double quotes to single quotes, so this...

div id=content


...becomes... 


div id='content'


...when published.


this is on a XHTML transitional page.


Now, I'm a bit removed from the CMS itself, but the dev guy (i'm just a front end guy) thats dealing with it said it may take a little while to correct this but in the meantime he didnt think it was a problem for any browsers so it would be low priority.

Can anyone shed some light on whether this is true or whether some browsers will choke on single quotes? I'm a little sceptical about the low priority and am worried about crucial bits of content like this going screwy...

cheers,
pete ottery





RE: [WSG] double quoting

2004-02-24 Thread Peter Ottery
Title: RE: [WSG] double quoting





 James wrote:


  So, as far as I can tell, single quotes 
  on your attribute values are perfectly 
  acceptable (for xhtml1).
  Havent done any real testing in browsers, 
  but I'd say it is a non-issue.


nice! hey thanks for digging that up :) very appreciated.


wow, the dev guy here was right. wonders will never cease. ha! kidding. very very kidding :)


*slowly walks out of room backwards*


pete






RE: [WSG] Opera

2004-02-18 Thread Peter Ottery



 I'm curious - 
does anyone really think that getting things spot on for Opera is important? 


I'm 
not sure (someone else on the list may be) but I think Opera is *very* close to 
adhering to all the CSS2 specs - meaning if you get your page looking sweet in 
Opera (and mozilla/firebird) everything goes well from there... so yeah, Opera 
is pretty important from my perspective..

I find 
IE is pretty forgiving, so your page may lookfine in IE - but it still may 
have little errors here and there without you knowing. 

pete 
o



  -Original Message-From: Universal Head 
  [mailto:[EMAIL PROTECTED]Sent: Thursday, February 19, 2004 
  8:45 AMTo: [EMAIL PROTECTED]Subject: Re: [WSG] 
  Opera
  I'm curious - does anyone really think that getting things spot on for 
  Opera is important? Hasn't this browser got a miniscule user base? And Opera 
  seems to give me almost as many problems as IE anyway. 
  Interested ... 
  Peter 


RE: [WSG] CSS Rules - Naming Conventions

2004-02-15 Thread Peter Ottery
Title: RE: [WSG] CSS Rules - Naming Conventions





yeah I'm known to use


id=wrap
id=masthead
id=nav
id=sidebar
id=footer etc etc


all the time trying to keep the names non-specific to the layout (like id=lefthandnav) cause when/if it changes later to a horizontal nav across the top i'd feel a bit silly :)

having a standard set is particularly handy if you have a bunch of sites that use the same convention. makes for easier changes later...

i'd be interested to hear if there were problems with hyphens in names? i use them little. i knew underscores were no good, and i think i remember reading somewhere that names that *started* with a number were also problematic.. all ears if someone has some conclusive info..

cheers,
pete




-Original Message-
From: Stumpy [mailto:[EMAIL PROTECTED]]
Sent: Monday, February 16, 2004 4:24 PM
To: [EMAIL PROTECTED]
Subject: [WSG] CSS Rules - Naming Conventions




Just wondering what peoples thoughts/methods are when
naming your DIV's, ID's, etc. I vaguely remember IE4
not supporting underscores or hyphens, and therefore
use camel case, but I'm wondering if people use
various standard names like container, body, header,
footer, etc...


Cheers,
Craig


Try the new improved Yahoo! Australia  NZ Search at http://www.yahoo.com.au
*
The discussion list for http://webstandardsgroup.org/
* 





RE: Opening pages in new windows... was Re: [WSG] XHTML (OT??)

2004-02-08 Thread Peter Ottery
Title: RE: Opening pages in new windows...  was Re: [WSG] XHTML (OT??)






 p.s. I don't work for f2.com.au


i do :)


although before i look at the code behind that example (*preparing to grimace*) I'll let you know we have got a fair way to go with standards in general.

we are on it though. right now in fact! :)


and this list is helping bigtime.


cheers,
pete





RE: [WSG] Second try with [a name]

2004-02-04 Thread Peter Ottery
Title: RE: [WSG] Second try with [a name]





Taco wrote: 


 my suggestion was to put nbsp; between 
 the tag, and then set its style to not 
 display so it does not take up any space, 
 something like a name=c44 class=anchor/a


If you set display:none on the links opera and mozilla wont recognize them to be on the page and therefore the links *to* them dont work.

you might be better off making font-size: 1px with a colour to match the backgound so they are still there, just invisible.

or doing this as was suggested earlier i think can avoid all this...
a name=c44 class=anchor /


pete





RE: [WSG] What Causes Selection Problems In IE.

2004-01-29 Thread Peter Ottery
Title: RE: [WSG] What Causes Selection Problems In IE.





Russ wrote:
 Here is a test page to show you. Check it with Win/IE6:
http://www.maxdesign.com.au/jobs/css/try-and-highlight-me.htm


mmm, interesting, without wanting to sound like an IE fan ;-), I can select that text no problem using Win (XP) with IE6.

i can drag and select, double click selects a word, triple click selects all the words... no probs


pete





[WSG] a horizontal ol drops the numbers..?

2004-01-19 Thread Peter Ottery



gurus,
can anyone tell me 
why this code...
-

style 
type=text/cssli {display: inline}/style

ollisome 
text/lilia little more text/lilianother 
bit/lilieven a bit 
more/li/ol

-

...drops the numbers 
from the start of each list item as soon as you make the list run 
horizontally?
I want to keep the 
numbers at the start of each item(its for a horizontal 'step by step' type 
indicator) so if anyone has any insights on how to achieve that, that would be 
tops,

cheers,
pete


RE: [WSG] big trouble...still!

2004-01-14 Thread Peter Ottery
Title: RE: [WSG] big trouble...still!





 Can someone please check again for me?


yep, its good to go,
it did crash my IE6 on Win2k before, but all is fine now.
pete





[WSG] ordered list for events

2004-01-13 Thread Peter Ottery



Hi 
all,
I've got a simple 
list of events with dates and am trying to keep it as a simple ordered list. 


http://www.c41.com.au/test.htmlshows 
my example with everything else stripped out. (the css is inline just for ease of creating the 
example.)

I thought I had it 
sorted until I realised that it goes a bit out of whack when the event name is 
long and wraps back down underneath the date.
I'd like to have the 
event name wrap - but just under itself - basically the same as a simple but ye 
olde table structure would where each date/event name were in a different table 
cell.

any ideas on how to 
get this working nicely or a better way of doing it?

pete 
ottery




RE: [WSG] ordered list for events

2004-01-13 Thread Peter Ottery
Title: RE: [WSG] ordered list for events





thanks everyone! 
in response to a few of those questions:


Gary wrote:
I realise you have said you want to keep it as a simple ordered list - but 
I am not sure of the reason why.


 glory ;-)
 nah, I guess I'm just getting a real kick out of 
 not using tables wherever possible. I still 
 use them (tables) every day for anything 
 tabular  more complex than this, 
 ie: we're still friends ;-)


Scott wrote:
why did you use an ol?


 to be honest (and a little embarressed), i didn't 
 know any better. there, i said it :) 
 i havent used DL's before, but i will be now.


Russ wrote:
 Many ways to skin a cat. A standard table is acceptable but so is a definition list:
 http://www.maxdesign.com.au/jobs/css/peterottery.htm


 many, many thanks. that fits my needs exactly 
 and i even got a file named after me! ;-)


thanks all, extremely helpful.


pete





RE: [WSG] Strange Netscape list button behaviour

2003-12-14 Thread Peter Ottery
Title: Strange Netscape list button behaviour



hiya,

yeah, 
i'm seeing the prob in IE6 PC aswell...
its a 
1 pixel white border being added to some a's within LI's and not 
others.

ie: 
where youve got the below (in red) in your 
stylesheet, some have border-right set to 1px, some have it set to none, and 
some are missing. If you make them all the same yr sorted. i think. 


hey 
all, am new here by the way, just signed up today. um. hi :)

incidently, i used the mozilla bookmarklet called "edit styles" on this 
page
http://www.squarefree.com/bookmarklets/webdevel.html
to 
edit and view the css changes live. it rocks.

cheers,
pete


/* 
front page *//* -- 
*/

#support { background: 
#e58200;border-top: 1px solid #fff; border-right: 1px solid 
#fff; }#consulting { background: 
#966a22;border-top: 1px solid #fff; border-right: 1px solid 
#fff; }

#procurement { background: 
#324e57;border-top: 1px solid #fff; border-right: 1px solid 
#fff; }

#network {background: #003c85;border-top: 1px solid 
#fff; border-right: none; }

/* 
services *//* -- */

#adhoc { background: 
#e58200;border-right: 1px solid #fff; 
}#server { background: 
#966a22;border-right: 1px solid #fff; }

#help { background: 
#324e57;border-right: 1px solid #fff; }

#itpartner {background: #003c85;border-right: none; 
}

  -Original Message-From: Universal Head 
  [mailto:[EMAIL PROTECTED]Sent: Monday, December 15, 2003 4:43 
  PMTo: [EMAIL PROTECTED]Subject: [WSG] Strange 
  Netscape list button behaviour
  HELP!
  
  http://universalhead.com/clients/oceanwavedigital/support_server.html
  
  I've tried everything, but I can't work out why the CSS for the left menu 
  is not working properly in Netscape (PC and Mac - works fine in IE). There are 
  1 and 2 pixel differences in the width of the list element buttons. I've tried 
  fiddling with the list css in every possible combinations and I can't see the 
  logic behind why this is happening.
  
  I'd really appreciate it if anyone could come up with an explanation for 
  this.
  
  Cheers
  Peter-- 

  peter gifforduniversal 
  head design that 
  worksvisit 7/43 bridge 
  road stanmore nsw 
  2048 
  australiacall (+612) 9517 
  1466fax (+612) 9565 
  4747email 
  [EMAIL PROTECTED]site 
  www.universalhead.com


  1   2   >