Re: [WSG] Image Replacement

[Tim]

Pardon a newbie perspective, I like to show my skip navs a few pixels  
up, but visable, useful to see it as well as have it there, I hide it  
with a no show in the printing stylesheet. It allows easier keyboad  
navigation I think. I'm not sure of any SEO penalty for -9000 pixels,  
why not just a few pixels north of absolute screen top?



 tabindex="1">Skip Nav 



Stylesheet
.SkipNav{color:#330099;font-size:60%;position:relative;left:.2em;text- 
align:left;font-family:Georgia,"Courier New",Times,"Times New  
Roman",serif;margin-top: -.2em;margin-bottom:  
-1em;text-indent:-2em;line-height:30%;}


I've been working on seven different versions, trying to line up the  
homepage with div instead of tables in all version I can find of Win  
and Mac browsers, Javascript switches stylesheets.


Yikes! I was not ready for this yet, but they should be almost closely  
aligned, some work to do yet. Please let me know if there any major  
bugs, Safari can put BODY:after content at the top of the body the muck  
up all that absolute positioning, I tried em's for flexible font  
sizing, but had to go to pixels for accuracy, hope I am almost there.


My pithy advice, make the skip nav a few pixels up, but just visible  
with a good rollover or onfocus title.


Thanks for the postings you all let me listen in to and learn from.

Tim

http://www.hereticpress.com/index.html


On 18/07/2006, at 2:22 PM, Lachlan Hardy wrote:


On 7/18/06, Paul Bennett <[EMAIL PROTECTED]> wrote:


text-indent: -9000px;
may get our site penalised by search engines.
People often talk about this. Does anyone have any specific references  
of it actually occurring? I've not seen it yet



I can live with this, as the content is still accessible.
Question is, what am I missing? Is it ok to do this, or is there some  
horrible hidden issue I'm not aware of?
Not a hidden issue, particularly. Just that your image will not resize  
when people resize their text. It depends how concerned you are about  
that


In such situations I typically use, sIFR. It usually meets my client's  
requirements for headings in atypical fonts, while still providing  
what I consider an acceptable level of accessibility. Everyone's needs  
are different (as is said so often on this list), so it may or may not  
meet your needs this time (or ever)


If you haven't looked at it before, see  
http://www.mikeindustries.com/sifr/


Although you might also be interested in the development of sIFR 3.0 -  
http://novemberborn.net/sifr3


Lachlan Hardy

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

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

The Editor
Heretic Press
http://www.hereticpress.com
Email [EMAIL PROTECTED]



**
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] Image Replacement

[Mike at Green-Beast.com]

Paul wrote:
> I'm concerned that using CSS like:
> text-indent: -9000px;
> may get our site penalised by search engines.

As long as the real text which is accessible to search engine spiders (and 
other users with similar limitations as spiders) is also visible on the page 
to sighted users, you should be fine. Google will have no problems.

For accessibility, the text content must be available with CSS on with 
images off, and css off with images off, and not put to the page via 
user-side scripting like JavaScript or be image-reliant.

In not accessible as described above, that is a problem with some users. And 
if you have text content somehow hidden form view, yet visible only to 
spiders, that can be a problem with the search engines.

An image with alt text is fine as it satisfies the requirements of all 
users.

Hope this helps.

Sincerely,
Mike Cherim
http://green-beast.com/








**
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] Image Replacement

[Lachlan Hardy]

On 7/18/06, Paul Bennett <[EMAIL PROTECTED]> wrote:
I'm concerned that using CSS like:text-indent: -9000px;may get our site penalised by search engines.People often talk about this. Does anyone have any specific references of it actually occurring? I've not seen it yet
I can live with this, as the content is still accessible.Question is, what am I missing? Is it ok to do this, or is there some horrible hidden issue I'm not aware of?
Not a hidden issue, particularly. Just that your image will not resize when people resize their text. It depends how concerned you are about thatIn such situations I typically use, sIFR. It usually meets my client's requirements for headings in atypical fonts, while still providing what I consider an acceptable level of accessibility. Everyone's needs are different (as is said so often on this list), so it may or may not meet your needs this time (or ever)
If you haven't looked at it before, see http://www.mikeindustries.com/sifr/Although you might also be interested in the development of sIFR 3.0 - 
http://novemberborn.net/sifr3Lachlan Hardy

**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] Image Replacement

[Paul Bennett]

Hi all,

I'm fighting through the wads of info (and opinions) out there about CSS image 
replacement.

I'm concerned that using CSS like:
text-indent: -9000px;
may get our site penalised by search engines.

Feeling overly pragmatic, I added the following to a page in development:



It works (shows just the image, as expected) in Opera 9, IE 6, IE 7, and 
firefox 1.5. With styles on and images off, the header style rules are applied 
(to the ALT text) as normal, with a small 'missing image' border applied in 
Opera.

I can live with this, as the content is still accessible.

Question is, what am I missing? Is it ok to do this, or is there some horrible 
hidden issue I'm not aware of?

Paul


**
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] Form check

[Germ]

Im going to agree with these two...I have filled out some forms before that were just as long but on seperate pages and they also had a progress bar on the bottom telling the user how far into it had they been and how far to go.
It does look nifty thoughOn 7/18/06, Christian Montoya <[EMAIL PROTECTED]> wrote:
I need to agree with David re:http://www.stthomasaquinasacademy.org/employment.mgiPlease please please consider breaking this form into multiple pages.
You can post the results of each page to the next and display what hasbeen completed already below the current section. The gradient andlegends are "nice" and I could sit here and oggle over little
graphical effects, but all of that is moot to usability here. I wouldalso suggest providing more separation between different sections.Christian Montoyachristianmontoya.com
 ... portfolio.christianmontoya.com**The discussion list for  
http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help
**-- JP2 Designshttp://www.jp2designs.com

**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] Form check

[Philippe Wittenbergh]

On Jul 18, 2006, at 3:45 AM, Jeff Van Campen wrote:


By the way, this brings up an interesting issue. Does anyone know of
if Mozilla provides a guide to which Firefox versions are based on
which Mozilla builds?  Is the relationship even that clear any more?


Check out the user agent string. (Open the about box and you'll see it)
 ex: Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; en-US; rv: 
1.9a1) Gecko/20060713 Minefield/3.0a1


The key is v:1.9a1 which points to Gecko 1.9, the current trunk builds

Fx 1.0.x is based on Gecko 1.7
Fx 1.5.0.x is based on Gecko 1.8
Fx 2.0 will be based on Gecko 1.8.1
Fx 3.0 will be based on Gecko 1.9

Philippe
---
Philippe Wittenbergh






**
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] Design community in Cambridge?

[Tom Worthington]

At 05:51 PM 7/14/2006, Matthew Pennell wrote:
... Is anyone aware of any web standards community setup type things 
in Cambridge (UK) ...


You might try the Cambridge University engineering people 
.


ps: I missed them on my last visit to Cambridge 
.




Tom Worthington FACS HLM [EMAIL PROTECTED] Ph: 0419 496150
Director, Tomw Communications Pty LtdABN: 17 088 714 309
PO Box 13, Belconnen ACT 2617http://www.tomw.net.au/
Director, ACS Communications Tech Board   http://www.acs.org.au/ctb/
Visiting Fellow, ANU  Blog: http://www.tomw.net.au/blog/atom.xml  




**
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] gmail is ignoring "display:none" - what to do?

[David McKinnon]

Lately I've been checking my pages with Fangs 
(http://www.standards-schmandards.com/fangs) a Firefox extension which 
emulates what a screen reader reads.

I've found it very helpful for this kind of question.

David

On 05/07/2006, at 5:14 PM, Jake Badger wrote:

Sorry, I should have phrased that better. I meant if you're going to 
have captions, wouldn't one of the reasons be for screen readers?


On Wed, 05 Jul 2006 08:09:03 +0100, "Patrick H. Lauke" 
<[EMAIL PROTECTED]> wrote:

Jake Badger wrote:

Don't tables need captions for screen readers?


Not necessarily. It's not an either/or situation. Even without a
caption, a table can be perfectly accessible and fine for screen 
reader

users (for instance, if there was enough information preceding the
table, such as an introductory paragraph that is visible to 
*everybody*,

or a heading, etc).

P
--
Patrick H. Lauke
__
re·dux (adj.): brought back; returned. used postpositively
[latin : re-, re- + dux, leader; see duke.]
www.splintered.co.uk | www.photographia.co.uk
http://redux.deviantart.com
__
Web Standards Project (WaSP) Accessibility Task Force
http://webstandards.org/
__


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

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




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

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





**
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] Form check

[Dean Matthews]

On Jul 17, 2006, at 2:15 PM, Jeff Van Campen wrote:


I tried the following, however, and it seemed to do the trick:

fieldset {
   clear:both;
}


On Jul 17, 2006, at 2:30 PM, David Dixon wrote:
Adding a clear:both to your "#horizForm fieldset" definition seems  
to clear the problem nicely in FF 1.5.


Thanks guys, that did it.

Now I just have to sort out some wonky minimum width issues in FF.

On Jul 17, 2006, at 2:46 PM, David Dixon wrote:

I have to say that personally i think the form is a little "too much".


Well, it is a very large form and there are certainly use-ability,  
aesthetic, and functional trade-offs. Your points are well taken. I  
thought about different background colors for sections but thought  
that was "too much" design.


Design follows function or KISS (keep it simple etc. ...)

Thanks,

Dean




**
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] Form check

[Christian Montoya]

I need to agree with David re:
http://www.stthomasaquinasacademy.org/employment.mgi

Please please please consider breaking this form into multiple pages.
You can post the results of each page to the next and display what has
been completed already below the current section. The gradient and
legends are "nice" and I could sit here and oggle over little
graphical effects, but all of that is moot to usability here. I would
also suggest providing more separation between different sections.

--
--
Christian Montoya
christianmontoya.com ... portfolio.christianmontoya.com


**
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] Form check

[Tom Livingston]

On 7/17/06 2:45 PM, "Jeff Van Campen" <[EMAIL PROTECTED]> wrote:

> By the way, this brings up an interesting issue. Does anyone know of
> if Mozilla provides a guide to which Firefox versions are based on
> which Mozilla builds?  Is the relationship even that clear any more?
> 
> Thanks,

I believe FF2.0 is based on the Moz 1.8 tree, which is newer than FF1.5x

IIRC...

-- 

Tom Livingston | Senior Multimedia Artist | Media Logic | ph:
518.456.3015x231 | fx: 518.456.4279 | mlinc.com




**
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] Form check

[David Dixon]

Look like someone beat me to the mark on that one :)

Just to turn the tide a little, while the form itself is well 
constructed, and the use of a gradient adds a little extra dimension to 
the form, I have to say that personally i think the form is a little 
"too much".


I get about half way down the form, and most of what i can see is just 
fieldsets within fieldsets within fieldsets within fielsets... while 
this in itself is not really a problem, I think the visual impact is a 
little confusing when actually using a form "what section am i filling 
out again?". I find myself having to scroll back up the page too often 
to find out exactly where I am. I'd also question the logic behind some 
of those fieldsets... a phone fieldset with only 1 field nested in an 
address fieldset?


Dont get me wrong, I think it commendable to try and adopt a tableless 
structure for such a long and complex form. I think however, that 
personally, I would look rethink the structure of the form a little, and 
maybe make sub-fieldsets a little less "rigid" in appearance. I also 
think that for such a large form, an explanation of all the sections 
wouldnt be a bad idea (so people are prepared for what needs to be 
filled out).


Thanks,

David.

Jeff Van Campen wrote:

Hi Dean,

I'm not sure why Firefox is ignoring your clearer div.

I tried the following, however, and it seemed to do the trick:

fieldset {
clear:both;
}

The forms look really nice, btw.

(FF 1.5.0.2 on Linux, Opera 9.00 on Linux)

-jeff


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

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







**
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] Form check

[Jeff Van Campen]

Hi again Dean,

I've had a look around and this seems to be related to this Mozilla bug:
https://bugzilla.mozilla.org/show_bug.cgi?id=309550

It looks as if this has been fixed in Mozilla 1.8.1.  I'm not sure
which Mozilla build FF 1.5 was based on, but this bug pretty clearly
describes the issue you're having.  There is also a suggested
workaround attached to this bug:
https://bugzilla.mozilla.org/attachment.cgi?id=209461

Hope this helps.

By the way, this brings up an interesting issue. Does anyone know of
if Mozilla provides a guide to which Firefox versions are based on
which Mozilla builds?  Is the relationship even that clear any more?

Thanks,

-jeff

On 7/17/06, Jeff Van Campen <[EMAIL PROTECTED]> wrote:

Hi Dean,

I'm not sure why Firefox is ignoring your clearer div.

I tried the following, however, and it seemed to do the trick:

fieldset {
clear:both;
}

The forms look really nice, btw.

(FF 1.5.0.2 on Linux, Opera 9.00 on Linux)

-jeff




**
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] Form check

[David Dixon]

Hi Dean,

The problem appears to be with your use of floating elements.

Adding a clear:both to your "#horizForm fieldset" definition seems to 
clear the problem nicely in FF 1.5.


Thanks,

David

Dean Matthews wrote:

Tried my first table-less form but it's breaking in Firefox.

<http://www.stthomasaquinasacademy.org/employment.mgi>

Suggestions for fix appreciated.
Thanks,

Dean




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

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




__ NOD32 1.1664 (20060717) Information __

This message was checked by NOD32 antivirus system.
http://www.eset.com






**
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] Form check

[Jeff Van Campen]

Hi Dean,

I'm not sure why Firefox is ignoring your clearer div.

I tried the following, however, and it seemed to do the trick:

fieldset {
   clear:both;
}

The forms look really nice, btw.

(FF 1.5.0.2 on Linux, Opera 9.00 on Linux)

-jeff


**
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] Form check

[Dean Matthews]

On Jul 17, 2006, at 11:37 AM, Joe wrote:

it may be your div.clearer's.  FF does not recognize a div unless  
it has
content.  Place a   inside of each of those and you should be  
good to

go. (maybe) :)


Joe I thought you had it, but no joy.

There is certainly something Firefox doesn't like about the clearer  
div that works with the other browsers.


Still open for ideas.

Thanks,

Dean




**
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] Form check

[Mya]

Ah okay. Sorry, missed the nesting. Definetly try what Joe (Jough)
said about the   inside the divs.

Mya

On 7/17/06, Dean Matthews <[EMAIL PROTECTED]> wrote:

On Jul 17, 2006, at 11:28 AM, Mya wrote:

> From what I see you're missing  ... see below...

No, the closing fieldset tags are at the end so that the nesting of
categories comes out right.

Thanks for the thought though.

Dean




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

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





--
I clicked. I saw. I moved on to the next web page.


**
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] Form check

[Dean Matthews]

On Jul 17, 2006, at 11:28 AM, Mya wrote:


From what I see you're missing  ... see below...


No, the closing fieldset tags are at the end so that the nesting of  
categories comes out right.


Thanks for the thought though.

Dean




**
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] Form check

[DEL PICCOLO Julien]

Hello,This is my first contribution so i hope i don't reply the wrong wayI'm using my 12" Powerbook (1024x768) :The form is looking quite good on Safari 2.0.4 but it's going too far on the right side with the fox 
1.5.0.4.I don't have time to look for your code now because i'm at work and i already have to work on my website ;).
Keep it up !

**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] Form check

[Shlomi Asaf]

joining him :)
really nice form (IE7 Beta3)
 
On 7/17/06, Tom Livingston <[EMAIL PROTECTED]> wrote:
No time to look at the moment but wanted to say that that's one nice lookin'form.(Opera 9.01 Mac)


**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] Form check

[Joe]

Looks great so far! 

I haven't had the chance to extensively look into it, but from what I can
see it may be your div.clearer's.  FF does not recognize a div unless it has
content.  Place a   inside of each of those and you should be good to
go. (maybe) :)

As for visuals in IE, I'd like to say you really do have a knack for visual
design with standards implementation.  Keep it up!

Jough

> -Original Message-
> From: listdad@webstandardsgroup.org [mailto:[EMAIL PROTECTED]
> On Behalf Of Dean Matthews
> Sent: Monday, July 17, 2006 9:02 AM
> To: wsg@webstandardsgroup.org
> Subject: [WSG] Form check
> 
> Tried my first table-less form but it's breaking in Firefox.
> 
> 
> 
> Suggestions for fix appreciated.
> Thanks,
> 
> Dean
> 
> 
> 
> 
> **
> The discussion list for  http://webstandardsgroup.org/
> 
>  See http://webstandardsgroup.org/mail/guidelines.cfm
>  for some hints on posting to the list & getting help
> **




**
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] Form check

[Tom Livingston]

On 7/17/06 11:01 AM, "Dean Matthews" <[EMAIL PROTECTED]> wrote:

> 

No time to look at the moment but wanted to say that that's one nice lookin'
form. 

(Opera 9.01 Mac)

-- 
Tom Livingston | Senior Multimedia Artist | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com



**
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] Form check

[Mya]

Hi Dean,


From what I see you're missing  ... see below...





. add  ..




Equal Employment Statiscal Information


Same is true for Address under Employment History, Employer 2, Employer 3, etc.

Mya

-

On 7/17/06, Dean Matthews <[EMAIL PROTECTED]> wrote:

Tried my first table-less form but it's breaking in Firefox.



Suggestions for fix appreciated.
Thanks,

Dean




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

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






--
I clicked. I saw. I moved on to the next web page.


**
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] Form check

[Dean Matthews]

Tried my first table-less form but it's breaking in Firefox.



Suggestions for fix appreciated.
Thanks,

Dean




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

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

FW: [WSG] site check and code review

[Tom Livingston]

> From: Tom Livingston <[EMAIL PROTECTED]>
> Date: Mon, 17 Jul 2006 09:25:18 -0400
> To: 
> Conversation: [WSG] site check and code review
> Subject: Re: [WSG] site check and code review
> 
>> I wanted to ask for a site check and code review please.
>> Any suggestions for maybe writing the code different or maybe better are
>> welcome.
> 
> Looks great. Checked on Mac Opera 9.01.
> 
> Oh and IMHO, I¹ve seen many more boring pages than this!
> 
> One comment, the ³Tokoriki Diving² header graphic is screaming for
> anti-aliased edges!
> 
> Nice!

Oh, and with my browser window at 800 wide, I get no horizontal scroll...


-- 
Tom Livingston | Senior Multimedia Artist | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com



**
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] site check and code review

[Tom Livingston]

 


On 7/15/06 4:39 AM, "Elle Meredith" <[EMAIL PROTECTED]> wrote:

> I wanted to ask for a site check and code review please.
> Any suggestions for maybe writing the code different or maybe better are
> welcome.

Looks great. Checked on Mac Opera 9.01.

Oh and IMHO, I¹ve seen many more boring pages than this!

One comment, the ³Tokoriki Diving² header graphic is screaming for
anti-aliased edges!

Nice!

-- 
Tom Livingston | Senior Multimedia Artist | Media Logic |
ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com



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

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