Re: [WSG] TARGET in 4.01 Strict

[Hope Stewart]

On 16/2/06 11:47 AM, "Al Sparber" <[EMAIL PROTECTED]> wrote:

>> Al Sparber:
>>> If popup windows are scripted you reuse the same window object over
>>> and over. You can never have more than one open. Your statement is
>>> only true if the target attribute is used.
>> 
>> Doesn't this present yet another usability problem where you might
>> open a link in the window.object over the top of a link the user has
>> decided to keep but has returned to your page to follow other links
>> (the original reason for popping a window)?
> 
> I'm not sure what you mean - wait.. let me do a quick test and perhaps
> you can explain what you mean in a bit more detail.

I have found some instances where having not only pop-up windows but
multiple pop-ups to be very user-friendly.

For example: I needed to look through about 200 photos of a jazz band on a
professional photographer's website to select about 6 for final use. The
thumbnails were on several pages. Clicking a thumbnail opened an enlargement
with the photo's unique ID number in a separate window without all the
browser's normal toolbars.

By allowing me to have multiple pop-up windows open at the same time, I
could easily go from one thumbnail page to the next and readily compare
several photos side-by-side to choose the preferred ones. I didn't have to
keep track of which thumbnail page they come from, nor did I have to go back
to any of the thumbnail pages I had already viewed to access an enlargement.

Pop-ups have been over-used and abused over the years but there are still
some instances where they can be user-friendly.

Horses for courses.

Hope Stewart



**
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] just sharing the frustration

[Hope Stewart]

The "Find And Replace" feature in Dreamweaver can also be a huge time saver.
Other programs probably have this same feature. For example:
Replace all: 
With: 
(and remember to add  to the beginning of the first line and  to
the end of the last line.)

Then use the Dreamweaver command "Apply Source Formatting" to make the code
more readable.

It might be safer (and easier), however, to use this feature by first
pasting the text into a blank html page, do all your editing there and then
copy/paste the re-formatted text into your real page. That way you don't run
the risk of accidentally altering code you didn't want altered.

HTH,
Hope Stewart


On 15/2/06 2:59 PM, "Zulema" <[EMAIL PROTECTED]> wrote:

> Wow! I will remember all this for the next time, since I do a lot of
> Word-to-HTML converting.
> 
> The crazy thing about this one particular Word doc was that it wasn't in
> formatted bulleted lists because it was copy extracted from a PDF we got
> from the client as it seems they didn't have the original copy deck
> anymore I think.


**
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] Re: [WSG Announce] Three upcoming WSG events

[Hope Stewart]

On 27/10/05 2:41 PM, "russ - maxdesign" <[EMAIL PROTECTED]> wrote:

> -
> Melbourne WSG
> -
> Date: Thursday 10 November, 2005
> http://webstandardsgroup.org/go/event48.cfm
(snip)
> -
> 2. Sydney WSG
> -
> Date: Thursday 10 November, 2005
> http://webstandardsgroup.org/go/event47.cfm
(snip)
> -
> 3. Inaugural Canberra WSG
> -
> Date: Thursday 11 November, 2005
> http://webstandardsgroup.org/go/event49.cfm


Interesting date for Canberra. I always suspected that Canberra was not in
sync with the rest of the world!  ;-)

**
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

[Hope Stewart]

On 12/10/05 12:10 AM, "Townson, Chris" <[EMAIL PROTECTED]> wrote:

> I think my point here is this: HTML is really a text-based medium. Images
> have very little "meaning", for example, to a screenreader.

Then why is there an  element? And what about those who can't read but
enjoy using the internet for it *visual content*? Let's not exclude
pre-schoolers and those with a mental disability like my friend's 21 yr old
autistic son who can't read but enjoys surfing the web.

And for some sites the main content is visual not text-based, like for a
photographer or an artist. I don't buy a photograph or painting because I
like its text-based description.

Hope Stewart

**
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] Avoiding the evil

[Hope Stewart]

On 10/10/05 3:38 PM, "Christian Montoya" <[EMAIL PROTECTED]> wrote:

> Read this aloud: 
> 
> 909 anystreet
> ithaca, new york
> 
> Did you stop at the line break? Did it matter? My point is that we don't need
> to make the line break obvious to the screen reader.

For this address it doesn't matter, but for this real address it does:

Lewisham Road North
Prahran VIC

Perhaps adding a comma at the end of the first line would indicate a pause
to a screen reader?

**
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

[Hope Stewart]

Now that's a good argument, Richard! And just when I had been persuaded to
use . hm.

On the second website I ever made using web standards I do have one logo for
browsers and a cut-down version for print. But when I was making the site, I
didn't know about putting images in the background using css (I was still
trying to figure out the box model, floats, etc).

So my work-around (kids, don't try this at home!) was to put both logos in
the html in separate divs but display only one by using display:none on the
unwanted div. See for example:
http://www.harbourmarine.com/products/quick-release-hooks.html
http://www.harbourmarine.com/css/print.css
http://www.harbourmarine.com/css/products.css

Not particularly elegant but it works.

Hope Stewart

On 10/10/05 12:01 PM, "Richard Czeiger" <[EMAIL PROTECTED]> wrote:

> However, there is an argument that has the logo in the CSS particularly for
> branding purposes. Hear me out...
> 
> You put the logo in the CSS. Nice and big and branded etc...
> Then you make a special logo for, oh I don't know, mobile devices. Small,
> crisp, pixel perfect.
> Now your users can see both and mobile users don't get frustrated waiting eons
> for your massive logo to show up on their mobile browser (not that it fits
> inside the window anyway).
> 
> Doing it this way IS good branding.
> It's also about controlling HOW you want your logo to appear in certain
> context. Anyone that's written a Corporate Style Guide will know what I'm
> talking about...
> 
> You've also got to ask the question, that if people have CSS switched off,
> it's probably because they don't want to see any non-relevant information
> (visual or textual) possibly becuase of bandwidth restrictions etc...
> 
> If you've semantically coded your header with something like:
> 
> 
>   Company Name
> 
> 
> Then they'll still see the name of your company - which still lets them know
> who they're dealing with and that that company cares about how they prefer to
> view the web. That's also good braning (maybe more on the brand personality
> side of things rather than the brand visual side).

**
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

[Hope Stewart]

On 10/10/05 11:25 AM, "adam reitsma" <[EMAIL PROTECTED]> wrote:

> I would definitely want the company logo as an IMG element.
> 
> If your company's site was to be viewed without the use of CSS, would you
> still want the logo the appear? I would.

Really, really good point! Thanks, I hadn't thought of that. And if images
are turned off, at least you'd have the alt text.


Hope Stewart

**
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] Avoiding the evil

[Hope Stewart]

On 10/10/05 9:47 AM, "Jon Tan" <[EMAIL PROTECTED]> wrote:

> Tantek Celik talks about the  and  tags in his Elements of
> Meaningful XHTML presentation at WE05 available here:
> http://www.odeo.com/audio/270419/view

I was present for Tantek's talk and I thought he said  was used
only for information about the author, not for various adddresses that might
be listed on a Contact Us page. I don't recall what he said about . I'll
have to download the podcast and listen to it again -- it will be a
pleasure!
> 
> My suggestion would be that  is not necessary when the same visual
> effect can be achieved with  around each address item which is then
> style span{display:block} with CSS. Each span could have a semantically
> useful classname or you could look in to the hCard microformat:
> http://microformats.org/wiki/hcard

I considered using  but to me the code looks much cleaner and the css
has one less item by using . (I like the less-is-more concept.)

Hope Stewart

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

[Hope Stewart]

I've only started using web standards this year. This list has been an
invaluable source of knowledge (thanks everyone -- keep it up!).
 
There was a thread earlier this year that discussed how images that are
presentational and not part of the content should be placed as background
images through the css and not coded into the html with the . This
makes a lot of sense.
 
With all sites I've worked on, I'd say that the company logo falls into this
presentational category. But I wasn't aware of this concept for my first few
sites, so I have some sites where the company logo is part of the html and
others where it is part of the css.
 
It is now interesting to compare the two methods and I would argue that,
from a marketing point of view, a company logo should not be a background
image. This is why:
 
When you watch a page load in your browser, it's a bit like watching
dominoes falling: you see a cascade of the page elements fall into place and
come to rest. How fast this happens depends on the speed of your internet
connection. When the company logo is coded into the html, it is often one of
the first images to load and it is in-your-face while everything else is
loading. But when the logo is a background image, it is one of the last
things to load. From a marketing point of view, this is not desirable.
 
What do others think? I am quite happy to be persuaded otherwise by a sound
logical argument/discussion!

Cheers,
Hope Stewart

**
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] Avoiding the evil

[Hope Stewart]

I'm getting the hang of this whole Web Standards way of designing a website
and for the most part can totally avoid using . But in the example below
I'm unsure whether I should in fact avoid using :
 
All correspondence should be addressed to:
The Secretary
Your Club
PO Box 999
Anytown VIC 3000
 
How do others code an address? My feeling is that semantically it should be
contained within one paragraph or entity of some sort. But if you were using
a screen reader, how would you differentiate one line from the next?

If I were to use an ordered list with list-style-type set to none, would
this be semantically correct? Is there a better way?

Hope Stewart

**
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] Text Size Statistics

[Hope Stewart]

On 2/9/05 11:08 AM, "Terrence Wood" <[EMAIL PROTECTED]> wrote:

> I'm not sure if it's the designer/developers domain to educate people on
> how to use their browsers, we should focus more on removing barriers to
> content.

If text-resize icons (such as a small A and a big A) were by default in a
browser tool bar, this would help educate users that they can resize text --
and then perhaps websites using fixed-sized fonts would get some complaints
from IE users being unable to change the font size. Empower the people!

Perhaps the w3c, in addition to encouraging browser developers to adopt Web
Standards, could encourage them to adopt text-resize icons. (Does the w3c
have a Suggestions Box?)

Safari gives you the option of adding text-resize icons to tool bar. I find
this very handy -- handier than using keyboard shortcuts because when I'm
surfing on the web my hand is constantly on the mouse clicking or scrolling
away.

Hope Stewart

**
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] New front page for http://abc.net.au/

[Hope Stewart]

Geoff,

One problem that I've found in both Firefox & Safari is that when I increase
the font size the search box and its button disappear from the page.

Hope Stewart


On 4/8/05 7:18 PM, "Geoff Pack" <[EMAIL PROTECTED]> wrote:

> Hi all,
> 
> Thanks for all the comments on the new ABC home page. I did the front-end
> coding, so I'm responsible for *some* of the issues raised.
> 
> The resizing thing:
> I would have also preferred a scalable layout or a stylesheet switch, but the
> design differences are sufficiently great that I had to build 2 html pages.
> They are pulling different includes, in a different order for a start. I
> tested the script pretty extensively, but if you have problems, email me and
> I'll look into it.
> 
> The ABC (the New Media department anyway) is moving generally towards
> fixed-width centered layouts. Again, not my preference.
> 
> Navigation: 
> The previous drop-down menus didn't test very well, and the click-through
> stats showed the in-page links were used much more. The new global nav and the
> "Explore the ABC" were quite popular.
> 
> The global nav coding was constrained by the fact that it has to go on all ABC
> pages as a single include file. Putting the style tag in the include (and so
> inside the body) was a compromise to get it to work without having to edit
> code across the whole of the ABC. We are fixing it for the new/recent pages
> soon. Old pages was will probably stay broken.
> 
> The Banner:
> Making it an html image instead of a CSS background was done so the banner
> appears in CSS impaired browsers and in PDAs where the rest of the page will
> be unstyled.
> 
> Font-sizing:
> Constant source of argument with designers, who always want it too small. Up
> to now I've been using the body {font-size:0.76em} trick (most of the recent
> ABC TV sites for example.) But the differences in IE when browser text size
> settings become much too great. So I've started using font-size:76% instead,
> which seems to work better.
> 
> Accessibility:
> We haven't paid a lot of attention to it apart from making sure the html is
> clean/semantic and adding the skip links. we test pretty widely across
> browsers. Point taken about the missing title attributes, but given the number
> of links, and the fact they come from some many different people in different
> program areas, it is probably not going to get fixed.
> 
> BTW, if there is anything that particularly annoys (or pleases) you, send
> feedback via the contact form if you want it formally logged. We do make
> changes based on feedback we receive.
> 
> 
> cheers,
> 
> Geoff Pack
> Developer,
> ABC New Media and Digital Services

**
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] Problem in Firefox on initial page load only

[Hope Stewart]

On 27/7/05 8:00 PM, "Jorge Laranjo" <[EMAIL PROTECTED]> wrote:

>> At the bottom of the page, you have a 
>> make that &nbps;
> 
>  
> 
> Note,   and not &nbPS;

When I've needed to clear a floated, I've used:



which seems to work, though I haven't tested it in *every* browser.

Are there any advantages of using   over
? I've never put a " " inside the
. Should I?

Hope Stewart

**
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: Broadleaf

[Hope Stewart]

On 26/7/05 7:07 PM, "Mugur Padurean" <[EMAIL PROTECTED]> wrote:

> True, but how do you keep your site local on the web?
> And what if my bussiness in Romania on dial-up finds your services in
> Australia (aimed at local "broadbanders") so attractive that wants to do
> business with you? Hey, maybe this way i can get my business on the broadband
> "level" but here in Romania ! What, you were planning to turn me down ...
> becouse i'm on dial-up in Romania?

The site is not aimed at local broadbanders. It is aimed worldwide at large
corporations and multinationals like Exxon Mobil, Petrobras, Woodside LNG,
Qatar Petroleum, China Petroleum Corp, Egypt Petroleum Co, Hyundai Heavy
Industries, Nigeria LNG Ltd, Shell, PEMEX. These are some of my client's
customers.


**
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: Broadleaf

[Hope Stewart]

On 26/7/05 4:18 PM, "Mugur Padurean" <[EMAIL PROTECTED]> wrote:

> And accessibility means access for everyone regardless of technology
> availability or other kinds of disabilities.
> I think web standards were meant to raise awareness first and give an impulse
> to all of us to build a better web. A web for everyone, everywhere !

I agree that those are the ideals we should try to achieve.

And "Mugur Padurean" <[EMAIL PROTECTED]> also wrote:

> Hello, reality check here.

But part of the reality is that many websites have a specific target market.
One site I work on has a very narrow, highly specialized market. My client
knows his customers and potential customers. They are all on broadband. They
have to be for their industry.

As such, I was instructed to design the site for broadband access. The
client is the one calling the shots and paying the bill. We, as designers,
give advise regarding the pros & cons of various requests by the client and
may recommend other alternatives. But in the end, the client has the final
say. That is the reality. --  But we can still try to make the site as
accessible as possible within the client-defined framework.


Hope Stewart

**
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] Understanding inheritance (well, trying to)

[Hope Stewart]

Thanks Russ & Joe. It all makes sense now! I had never come across the
specificity rules before. (Then again, a year ago I had never heard of web
standards.) This is a rather handy thing to know.

Cheers,
Hope Stewart

**
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] Understanding inheritance (well, trying to)

[Hope Stewart]

There's something about inheritance that I don't understand. Say in my style
sheet I have:

body { color: black }
#content {}
#hilite p { color: red }

If I have three paragraphs in the div #hilite and I want the text of one of
them to be black instead of red, I define this class for that paragraph:

.normal { color: black }

But I find this doesn't work. For it to work, I have to define the class
with the div ID, like this:

#hilite .normal { color: black }

What is it about the laws of inheritance that means the class alone won't
work??

Hope Stewart

**
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] Printing problems with Firefox

[Hope Stewart]

I've created my very first style sheet for printing. It works beautifully in
IE6 but has major issues in Firefox.

In Firefox on the particular page I've been testing, after it prints the
logo and page header it prints nothing else on the first page. The second
page is ok but then the third page doesn't resume where the second page left
off. The last bullet list and photo from the webpage don't get printed.

The specific page & ccs can be found at:
http://www.harbourmarine.com/service.html
http://www.harbourmarine.com/css/print.css
http://www.harbourmarine.com/css/products.css


Another issue I'm having with this page in Firefox is quite weird. When I
scroll down to the bottom then back up again, a series of horizontal lines
appear through the top two images to the right of the main text. The exact
number of lines and their position varies. What is causing this and is there
a fix?

cheers,
Hope Stewart

**
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 size in a table

[Hope Stewart]

On 4/7/05 2:42 PM, "russ - maxdesign" <[EMAIL PROTECTED]> wrote:

> Hope could just have easily changed from an incomplete HTML4.01 Transitional
> doctype to a complete version. This is not a criticism of Hope, as she may
> have had other reasons for moving to XHML.

This was not a conscience nor educated decision. As a newbie to css and web
standards, I have been learning by using resources such as this helpful
list, various books (as recommended on this list), and templates offered on
the web. 

The main template I've been using is derived from Owen Briggs' generic text
styles template found at:
http://www.thenoodleincident.com/tutorials/typography/
and
http://www.thenoodleincident.com/tutorials/typography/template.html

It is from this template that I picked up
http://www.w3.org/1999/xhtml"; xml:lang="en" lang="en">

I would be very interested to know the pros & cons of using this!

Regards,
Hope





**
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 size in a table

[Hope Stewart]

On 4/7/05 1:23 PM, "Webmaster" <[EMAIL PROTECTED]> wrote:

> This was bugging me for ages too. I don't know _why_ it does it but my
> workaround to-date has simply been to implicitly set font-size for p, td and
> li. My table and list text usually display larger when I only set the
> font-size in the body element.
> 
> I've asked this question before but is there a "standard" way to set the
> font size across all elements (irrespsective of inheritance)?


Thanks for your input. I had set the font-size for p ul and li and had used
these tags within the td tags, but it still did not work.

Russ supplied the answer for me: I was using the wrong doctype. I've
changed:




to:

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>
http://www.w3.org/1999/xhtml"; xml:lang="en" lang="en">

and all works beautifully. I don't fully understand all the components of
doctypes, but the one I'm now using is working. Compare
http://hopestew.customer.netspace.net.au/index.html

to:
http://hopestew.customer.netspace.net.au/index2.html

The *only* difference in the code of these two pages are the first two
lines, yet the font size behaves itself in the table on the second page
because of the doctype.

I don't know whether is would help in your case, but it created a miracle in
mine!

Hope

**
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 size in a table

[Hope Stewart]

Thanks, Russ! I've fixed the doctype on the real page and it works
beautifully now. 

The page is on a site with a non-web standards design that I've "inherited".
It's due for a revamp in a couple of months when I plan to introduce
standards. I thought I'd start to experiment with this new page but made the
mistake of using a copy of an old page as my starting point. Updating the
doctype hadn't occurred to me -- but it will now!

Thanks again,
Hope

On 4/7/05 11:18 AM, "russ - maxdesign" <[EMAIL PROTECTED]> wrote:

> You have an incomplete doctype which makes browsers go into quicks mode and
> then font size inheritance is ignored inside a table.
> 
> Russ

**
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] font size in a table

[Hope Stewart]

I created a simple webpage containing a few paragraphs, a list and a table
(for tabular data). For some reason that I cannot for the life of me work
out, the font size of the text is much bigger in the table than elsewhere on
the page. (Tested in FF, Safari, Opera/mac). It's driving me nuts! I want
the text in the table to be the same size as elsewhere! What am I doing
wrong??? Could someone please enlighten me?

A mock-up of the page is here:
http://hopestew.customer.netspace.net.au/

And the css is here:
http://hopestew.customer.netspace.net.au/css/style1.css


Hope Stewart

**
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 and valid XHTML

[Hope Stewart]

Thanks Daniele. I'll give it a go.

On 30/6/05 3:19 PM, "INFOPRE" <[EMAIL PROTECTED]> wrote:

> if browser doens't have plug-ing, you can insert a tag image
> with alt attribute that describe use of flash in your site.
> 
> If you are interested to create an accessibile  flash site,
> this is for you http://www.macromedia.com/resources/accessibility/
> 
> cheers
> 
> Daniele
> http://www.gizax.it/
> Gizax Studios, Internet Accessibility

**
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 and valid XHTML

[Hope Stewart]

I have a page containing this code:





It validates as xhtml 1.0 Transitional.

My question, however, is how do I make it accessible? What is the Flash
equivalent to the alt attribute?

Hope Stewart

**
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] Making PDF and Word files accessible

[Hope Stewart]

Hi Angela,

On 3/6/05 8:36 PM, "Angela Galvin" <[EMAIL PROTECTED]> wrote:

> Secondly, with the Word documents, if there is an easier way to convert
> them to HTML? At the moment I am saving as HTML from Word, taking them
> into Dreamweaver and using 'Clean up Word HTML'. After that I use 'Find
> and replace' to strip out all ,  and attributes from 
> such as "class" and "style". At which point I still have to mark up the
> document with proper headings, bulleted lists, etc. A little
> time-consuming and fiddly to say the least!

I see that your email was sent using Apple Mail. Assuming you are also using
Dreamweaver on a Mac, you can try what I do: cut & paste the Word doc into
AppleWorks. Then either save the AppleWorks doc as html or cut & paste from
AppleWorks into Dreamweaver. AppleWorks strips out all the Word rubbish.

HTH,
Hope Stewart

**
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] alt tags and image captions

[Hope Stewart]

Having never seen/heard a screen reader in action, I am uncertain about how
to make some aspects of coding user-friendly for those using screen readers.
Specifically, I find my alt tags are almost always the same as my captions.
For example, if I insert an image of Joe Smith, my code might look something
like this:


Joe Smith

Does the screen reader read, "Joe Smith Joe Smith"? If so, I would have
thought that this repetition would get very annoying especially if there are
a lot of images on the page.

Could someone please enlighten me?

Hope Stewart

**
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] Formatting tables

[Hope Stewart]

Thanks for your suggests, James. I'm currently reading through the w3.org
spec whose link Lachlan Hardy gave:
http://www.w3.org/TR/REC-CSS2/tables.html

I'll then give the table another go and if I'm still having problems will
certainly cry out for help again. I like figuring out things for myself, but
it is wonderful having this group as a back-up!

Cheers,
Hope


On 10/5/05 5:50 PM, "James Ellis" <[EMAIL PROTECTED]> wrote:

> Do you have a link to the table in question so we can see whats not
> working (and the way you want it to work?)
> 
> hint : 
> border-collapse : collapse;  gets rid of the need for cellpadding and
> cellspacing in the html
> 
> Yes, it's better to put all your presentational code in the CSS.

**
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] Formatting tables

[Hope Stewart]

Can anyone recommend a website with indepth instructions/info on formatting
a table (being used for tabular data!) using web standards & css? I've tried
putting all the formatting in my css file, but it doesn't seem to work so
I'm obviously not doing something right.

For example, instead of


I left out the cellpadding attribute in the table tag and added this to my
style sheet:

td {
padding: 0.5em 5px 2em 0;
}

but it didn't work.

Also, am I best off defining the table width in the style sheet or in the
?

Regards,
Hope Stewart

**
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] Dreamweaver templates and CSS

[Hope Stewart]

Hi Joshua,

Which version of Dreamweaver are you using? I use MX 2004 on a mac (which
probably has different quirks to the win version) and am not having the
problems you describe, though I've only been using CSS-based layouts for a
few months (and am heavily using templates).

The problem I am having, however, is trying to select text in an editable
DIV region. In the templates, I'll write short messages to remind me or
others as to what content goes where in each column, eg "main content goes
here", "main photo goes here", etc. But when I create a new page from the
template and then try to select the text "main content goes here", I can't
do it in Design View. I have to go into Code View. When there are a few
lines of text in the editable DIV region, then it's no problem.

I never had this problem with templates using table-based layouts.

Regards,
Hope Stewart


On 7/5/05 4:42 PM, "Joshua Street" <[EMAIL PROTECTED]> wrote:

> We're developing a website from a layout a client purchased from some
> online layout service (of course, .PSD and table-based HTML layout
> only), and they were going to manage their content using Dreamweaver
> template files... but when we turned the layout to something CSS-based
> it went and made a horrible mess of the layout in Dreamweaver, to the
> point where it's not only unlike the appearance of the site in the
> browser, but completely uneditable.
> 
> http://www.joahua.com/blog/2005/05/07/wysiwtf has screenshots in Firefox
> and Dreamweaver respectively...
> 
> Has anyone else seen this kind of mess before?  Aside from "browser
> testing" Dreamweaver as though it were another user agent, is there
> anything that can be easily done to fix it?
> 
> We're probably just going to use a content management system instead,
> but it's a bit frustrating...

**
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 please - Rowing History

[Hope Stewart]

On 30/4/05 12:31 AM, "Drake, Ted C." <[EMAIL PROTECTED]> wrote:

> The top nav does bizarre things when you get off the index page. On one
> page, the tabs were replaced with underlined text, yet the dropdowns
> continued to work. When I went deeper, the navigation was missing entirely.

Thanks for your feedback Ted. This is a site I started working on well
before I had ever heard of web standards and table-less layouts. The site
has over 1,000 pages so far but will probably have over 5,000 plus a
database by the time I'm done.

My original table-based layout is weighed down by lots of javascript for
drop-down menus and this was only going to get worse. Instead of continuing
with this non-web-standards design, I decided that all new sections of the
site will be created using web standards. Eventually I will transfer all
current pages into this design as well. But at the moment, only pages in the
"world-u23-championships" directory
 have this new
design.

I'm presuming that the "bizarre things" you noticed were because you
navigated outside the "world-u23-championships" directory. If this is NOT
the case, please let me know!

Regards,
Hope

**
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 please - Rowing History

[Hope Stewart]

On 29/4/05 1:30 PM, "David" <[EMAIL PROTECTED]> wrote:

>> Seems fine on this end, although I  can't for the life of  me figure
>> out  what the b&w image is that appears to be a grasshopper?
>> 
> 
> 
> 
> Haha - It's a grasshopper wearing a jail bird stripy outfit- haha..
> Actually, looks like people rowing - like they're supposed to be in
> motion. ( I think)

It's part of the sponsor's banner that I have no control over. David is
correct. It's an aerial view of two people in stripy singlets rowing. If you
are really keen  :-)  you can have a look at a larger version of the image
at the sponsor's site: http://www.sykes.com.au/_home.asp
which I will quickly add I have never had anything to do with.

I need to email their web developer to encourage him in the nicest way
possible to look into web standards (trying to bring this thread back on
topic) or at least to test the site in browsers other than just IE/win. It
does not work (ie no menu bar -- a fairly critical item) in Firefox/win/mac
and Safari. It does work in IE6/win and Opera/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] site check please - Rowing History

[Hope Stewart]

On 28/4/05 8:46 PM, "Graham" <[EMAIL PROTECTED]> wrote:

> The only thing I really don't like is that when you click a link the top
> menu disappears and the only way I can get it back is to click the Back
> button. (I'm using IE6)

If you click one of the links in the top green menu, it takes you to a
different section of the site where my old table-driven design is. Only this
World Under 23 Championships section has the new css design so far -- and
it's not officially online yet.

In this new section, I changed the old design by adding in the top green
menu with drop-downs, the Search form and, underneath the top green menu,
another drop-down menu for quick navigation within this section. If you
click just within this section, you'll see how these items are on each page.

All new sections will now have this format. Eventually, I'll convert the old
sections into this new design. (Actually, I'll probably get my 18-year-old
to do it. She's just "bumped" into a BMW and has an $1800 bill to pay. Ouch!
She'll be motivated!)

Thanks for your input.

Cheers,
Hope

**
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 please - Rowing History

[Hope Stewart]

On 28/4/05 6:27 PM, "[EMAIL PROTECTED]" <[EMAIL PROTECTED]> wrote:

> 2 errors in home page
> http://validator.w3.org/check?uri=http://www.rowinghistory-aus.info/world-u23-
> championships/index.html

Thanks for this. Just goes to show that I need to validate EACH time I make
changes!

Cheers
Hope(less)

**
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 please - Rowing History

[Hope Stewart]

Thanks Thierry for your detailed reply! I've implemented all your
suggestions except the IE5/mac dropdowns -- I haven't had time to look at
the suggested link yet, but I will.

Regards,
Hope


On 28/4/05 2:27 PM, "Thierry Koblentz" <[EMAIL PROTECTED]> wrote:

> ope Stewart wrote:
>> comments. The design is very basic, but I've never claimed to be a
>> graphic designer!
> 
> It looks nice (I'd use a darker green for body though)
> I think you *need* to include a skipnav link.
> 
>> I have been unable to test the new pages in Opera/win and IE5/win, so
>> would be grateful if someone could have a look for me, particularly
>> in regards to the drop-downs.
> 
> IE5.1 and 5.5 Win:
> It looks really good in both versions, but the wrapper is not centered. For
> this, you'll need to use "text-align:center" in body and then
> "text-align:left" in #wrapper.
> As a side note, you can use "#00c" instead of "#cc" for your color
> declarations (format #aabbcc becomes #abc)
> For "margin:1.2em 0em 1.2em 0em" you can go shorthand like this
> "margin:1.2em 0" (a 0 is a zero, no matter what dimension you chose).
> 
>> The drop-downs do not work in IE5.2/mac, but each of the first level
> 
> This technique works in IE5 Mac:
> http://www.tjkdesign.com/articles/dropdown/default.asp
> If you read the last page of this article ("pushing the envelope"), you'll
> see that it is also a bit better in term of accessibility (re: tabbing
> navigation and JS-challenged browsers)
> 
> Nice work, good luck with this project
> 
> HTH,
> Thierry | http://www.TJKDesign.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
**

[WSG] site check please - Rowing History

[Hope Stewart]

I've been working on a huge site for over a year and it still has a long way
to go. Unfortunately, I had not heard about Web Standards until well after
starting this site, but it's never too late!

The latest section I'm about to add to the site is totally CSS and not a
table in sight, except for tabular data. And after several days of trying, I
finally got Suckerfish drop down menus to work. (Drop down menus are a
non-negotiable requirement of the client, as is the huge sponsor's logo at
the top of each page.)

It is very important that this site be accessible and last well into the
future -- unlike a commercial site, it is unlikely to get a major re-design
every few years. So, I'd be very interested hear your comments. The design
is very basic, but I've never claimed to be a graphic designer!

The new draft section (on the World Under 23 Rowing Championships) can be
found at:

http://www.rowinghistory-aus.info/world-u23-championships/index.html


Compare this to my original bandwidth-hungry, table-orientated layout:

http://www.rowinghistory-aus.info/olympic-games/index.html

I have been unable to test the new pages in Opera/win and IE5/win, so would
be grateful if someone could have a look for me, particularly in regards to
the drop-downs.

The drop-downs do not work in IE5.2/mac, but each of the first level links
will go to a page containing all the links in the drop-downs. So,
accessibility is not reliant on the drop-downs.

Regards,
Hope Stewart

**
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] To float or not to float

[Hope Stewart]

On 25/4/05 8:09 PM, "Ingo Chao" <[EMAIL PROTECTED]> wrote:

> The problem here is the first rule: you forgot the ";", so a parser
> could read this:
> 
> #right {
>width: 45%;
>border: 1px solid black;
>}

D'oh!!

> 
> now you might wonder why this does not fit side-by-side in FF, OP, but
> in IE.
> 
> IE/Win has a buggy float implementation. And an element with a dimension
> like "#right" is layoutet as a rectangular object which indeed sits at
> the right side of the preceding float #left.
> 
> compare IE and FF/Op/Saf:
> 
> #right {
>width: 45%;
>background: maroon;
>}
> #left {
>float: left;
>width: 25%; /* for demonstration */
>background: navy;
>}
> 
> Content for id "left" goes here
> Lorem ipsum  put in a long text here so we can see
> what happens when the line wraps.
> 
> IE6: the maroon block starts next to the navy float with a a width of
> 45% (overall width: 25% + 45%)
> 
> IE5.5: the maroon block starts next to the float, with a width of (45%
> of the space beneath the float 75% = 33,75%, overall 25%+33,75% =
> smaller than IE6)
> 
> Browsers that follow the specs show: the maroon block and the float
> display at the same top left of the containing element. The maroon block
> is overlapped by the float, and the line boxes "float" literally. The
> overall width of this construct is 45% (smallest).
> 
> Another aspect why I'd vote for floats is that recent browsers do have
> some problems calculating percentage widths of a. p. blocks with respect
> to their containing block (and not to the parent).
> 
Thanks for your advice!

**
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] To float or not to float

[Hope Stewart]

On 25/4/05 5:26 PM, "russ - maxdesign" <[EMAIL PROTECTED]> wrote:

> The biggest drawback of absolute positioning is that it is removed from the
> normal flow of the document. This means that any other content below will
> ignore the absolutely positioned content. For example, a footer may slide up
> under and be obscured by two absolutely positioned containers.

This is good to know.
> 
> Can I suggest two other options:
> 
> 1. a float left and a normal flow right column with left margin to give the
> illusion of columns (this should work well but will show the dreaded 3 pixel
> jog where the left column content butts against the right column content.
> 
> 2. float both columns - without seeing your particular circumstances, this
> is my preferred method as it immediately solves the three pixel jog issue.

At the moment, I just talking hypothetically -- I'm trying to get a better
understanding of how web standards work.

In my email, I was originally going to have a third option of floating both
columns, but when I tested it in Safari the columns sat on top of one
another instead of side-by-side. What is wrong with my CSS? This is what I
tried:

#right {
float: right
right: 10px;
width: 45%;
border: 1px solid black;
}
#left {
float: left;
left: 10px;
width: 45%;
border: 1px solid red;
}

**
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] To float or not to float

[Hope Stewart]

Say you want to create this two-column layout:

Content for id "left" Goes Here
Content for id "right" Goes Here

What, if any, are the advantages and/or disadvantages of (1) floating
neither column compared to (2) floating one column? Sample CSS:

(1) floating neither column:

#left {
position: absolute;
left: 10px;
width: 45%;
border: 1px solid red;
}
#right {
position: absolute;
right: 10px;
width: 45%;
border: 1px solid black;
}


(2) floating one column (say the left):

#left {
float: left;
left: 10px;
width: 45%;
border: 1px solid red;
}
#right {
position: absolute;
right: 10px;
width: 45%;
border: 1px solid black;
}


**
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] Two images on the one line

[Hope Stewart]

On 2/4/05 7:59 AM, "David Laakso" <[EMAIL PROTECTED]> wrote:

>> I used to think it was not semantic to place an image inside paragraph.
>> But
>> I've noticed many leading designers doing such and I believe I read
>> somewhere that it is actually appropriate and semantic to place an image
>> inside a paragraph tag.
>> 
>> Can anyone clarify this for me?
> Interesting, no?
> http://www.w3.org/Style/Examples/007/figures.html

What I find interesting/puzzling is that there are no closing paragraph tags
 :

> 
>height="200" alt="Eiffel tower">
> Scale model of the
>   Eiffel tower in Parc Mini-France
> 

Can someone explain?

Hope Stewart

**
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] displaying 2 photos with captions

[Hope Stewart]

On 28/3/05 12:43 PM, "Vicki Berry" <[EMAIL PROTECTED]> wrote:

> My personal approach is to use put captions in a  inside the div, and
> style that separately.  (So if your div is #image, then just use #image p
> which will style all s inside that div.)
> 
> The reason I do this is because I may want to place widths or margins on the
> caption that I may *not* want on the div itself.

A very good point. I hadn't thought about long captions which will need
width restrictions to preserve the layout. Thanks for this tip!

Hope

**
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] displaying 2 photos with captions

[Hope Stewart]

On 28/3/05 11:21 AM, "Scott Limmer" <[EMAIL PROTECTED]> wrote:

> Place each image/caption combination inside a div and float both of them
> to the left. As long as the combined width of the two divs isn't greater
> than the width of the parent element they should appear next to each
> other without any troubles.

Works like a charm! Thanks for that. I had tried two different approaches
that just wouldn't work. I've had to add, however, an empty div with a
"clear: both" after the photos to prevent the following paragraphs of text
from creeping into any leftover space to the right of the photos.

> As a side note I'd suggest doing your captions differently also. Rather
> than using a em/strong tag on every caption place it in a span with a
> class. Then apply the styles to that class. That way you don't have to
> write em/strong everytime you have a caption, and you can change the
> look of all captions easily if the need arise.

Thanks for this suggestion. I've actually put the definition for the
captions as part of the definition for the image div so that it
automatically formats the captions as I type without having to use a span.
(I've also dropped the em tag as, at least on the Windows machines I have,
italic is rendered very jaggedly even though on my old Mac it looks
beautiful -- but at least 99% of the client's customers seem to be using
Windows, so it's got to look good for them!)

Thanks for your help!

Hope Stewart

**
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] displaying 2 photos with captions

[Hope Stewart]

Help wean me from tables! I'm a WSG newbie. I created my first table-less
website -- a very basic pro-bono site -- in January. It was a good learning
experience, but now I'm tackling a more complicated site for a paying client
and need some help.

Within the main content div, I need to include photos with captions within a
grey box. When there is just one photo, I can do this. See draft:

http://www.harbourmarine.com/draft/products/capstans3.html

But most of the time I will need to have two photos side-by-side of varying
sizes and with captions. Using a table, I can do this in a flash. See:

http://www.harbourmarine.com/draft/products/capstans2.html

But I believe this is an inappropriate and unnecessary use of a table. How
do I replace this table with divs? There will be many product pages like
this one, but the photos will vary in size.

Hope Stewart

**
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] code formatting

[Hope Stewart]

Hi Lothar,

Thanks for the reference to Eric Meyer's "Uncollapsing Margins" article. It
was very informative and I have changed some of my CSS as a result.

It doesn't explain, however, why moving a  tag from a line on its own
to the end of the code of the previous line effected the page rendering in
IE. I find this very odd.

cheers,
Hope Stewart


On 21/2/05 11:48 AM, "Lothar B. Baier" <[EMAIL PROTECTED]> wrote:

> That sounds like uncollapsed margins. Eric A. Meyer has a good article
> on that:
> http://www.complexspiral.com/publications/uncollapsing-margins/
> 
> HTH
> Lothar
> 
> -- 
> www.markupmarks.de
> www.designdragon.de
> 
> Hope Stewart wrote:
> 
>> The div "content" is defined as having only a left margin. The div "footer"
>> is defined as having no margins. However, IE rendered the page with an
>> unwanted margin between these two divs.
>> 
>> By some fluke, however, I discovered (though I'm sure I'm not the first!)
>> that if I moved the  tag to the end of the previous line -- instead of
>> it being on a line by itself -- that the unwanted margin in IE disappears
>> and the page is rendered how I want it to be:
>> 
>> This is a paragraph
>> Top
>> This is all the copyright stuff.
>> 
>> So, it makes me wonder: Is there a way I should be formatting my code to
>> avoid browser rendering problems such as 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
**

[WSG] code formatting

[Hope Stewart]

Is there a recommended way of formatting the source code to avoid browser
rendering problems? I had a draft page that looked as it was intended in all
browsers (that I checked) except in IE6 (running on XP). The code was
written in this format:

This is a paragraph.
 Top

This is all the copyright stuff.


The div "content" is defined as having only a left margin. The div "footer"
is defined as having no margins. However, IE rendered the page with an
unwanted margin between these two divs.

By some fluke, however, I discovered (though I'm sure I'm not the first!)
that if I moved the  tag to the end of the previous line -- instead of
it being on a line by itself -- that the unwanted margin in IE disappears
and the page is rendered how I want it to be:

This is a paragraph
 Top
This is all the copyright stuff.

So, it makes me wonder: Is there a way I should be formatting my code to
avoid browser rendering problems such as this one?

Cheers,
Hope Stewart




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

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