Re: [WSG] Blueprint & Grids

2009-03-17 Thread Robert O'Rourke

James Jeffery wrote:
After reading 'Transcending CSS' I have learnt that grids are not a 
replacement for table based layouts (as has been drummed into me by so 
called evangelists on IRC). I understand the importance of grids in 
print and non-web media and now want to start using them.


I've started using Blueprint. I quickily scrolled through the CSS file 
and got a grasp for it.


My problem is this. In the book I am seeing examples where they are 
using 4 and 5 columns. I have developed a layout, which uses the 
divine proportion. So far I have the container, and 2 divs. Now, 
within these grids do I use more columns to go with the layout and 
structure of the design? And if so, how can I overlap? For example, in 
the "main-content" area I might have 5 columns, now lets say using 
Blueprint and my own CSS I want to use 4 columns for the content and 1 
for meta date per article. How do I use all 4 and leave the one?


Sounds like a silly, vaugue, question ... I know. But I'm a little 
taken by this and am eager to learn because I feel this is going to 
greatly boost productivity.


Thanks

--
James Jeffery
Web Developer and iPhone Applications Developer
m: 07964722061


Hi James,

First I'd say you can't really mix a grid framework like blueprint and 
the divine proportion. You're best off using blueprint to create the 
entire grid structure or none of it.


Blueprint offers class names for styling divs at various widths so your 
meta data would be in a div with a width that corresponds to the width 
of 1 of your columns, and your post content would be in a div that spans 
the width of four of those columns. You don't actually have 5 divs each 
with the width of one column because you couldn't get the content to 
span across 4 of them.


The column widths provide a guide for your grid - your actual content 
divs will typically be a multiple of a single column width.


Have a look at this page http://designinfluences.com/fluid960gs/
It's a similar grid system to blueprint (better IMO) but under the 
16-column grid header (you may have to click it) there are a bunch of 
examples of the different widths of containers you can have. You may 
want 8 1-column-width containers next to 2 4-column-width containers.


-Rob


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] IE and the element

2009-02-23 Thread Robert O'Rourke

Patrick H. Lauke wrote:

On Mon, Feb 23, 2009 at 3:39 PM, Robert O'Rourke  wrote:

  

I don't really know how toread the DTDs properly



Yeah, it's obscure for sure.

  

http://www.w3.org/TR/html401/interact/forms.html#edef-BUTTON> - -
   (%flow; <http://www.w3.org/TR/html401/sgml/dtd.html#flow>)*
-(A|%formctrl;
<http://www.w3.org/TR/html401/sgml/dtd.html#formctrl>|FORM|FIELDSET)
   -- push button -->



Using Toolman's excellent 2005 article "The Art of Reading a DTD"
http://www.autisticcuckoo.net/archive.php?id=2005/05/01/art-of-reading-dtd
I think the above can be decyphered as:



opening and closing tags are required, it can contain any number of
flow elements (block or inline), but can't CONTAIN links, other form
controls, forms or fieldsets.

P
  


Thanks Patrick, that's a really useful link.
So I guess it's just up to John whether to use javascript or regular 
links now.


-Rob


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] IE and the element

2009-02-23 Thread Robert O'Rourke

There was a wee bug (or two!) in that link I posted, very sorry.

http://www.sanchothefat.com/dev/sfhelp/validations.php

If you validate that page now it works with the buttons outside of a 
form. They do however need to be contained by a block element such as a div.



***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] IE and the element

2009-02-23 Thread Robert O'Rourke

Nick Cowie wrote:

2009/2/23 Frank Palinkas :
  

IMHO, not very semantic in nature. We need the button element to be able to
carry a valid link-type attribute. Enclosing it in a form just don't cut it.



We are talking HTML 4 here, so to have a link you have to use an
anchor tag, a form or javascript.

Frank is correct, a link is semantically correct way to go and to get
the behaviour John wants, he is better off using javascript than a
button. Though I don't know of a way of disabling a link with
javascript
  


You can remove the href attribute and save it in a variable to add back 
later, though I don't think that's John's problem. Having the buttons 
disabled was just so he didn't have to remove them when they weren't 
needed to keep the design consistent. You could use a  element 
instead with a class name eg. Next.


Don't forget if it's a form you probably don't want to make it rely on 
javascript.



The form option, gives more control, but is less semantically correct
than a plain link and will work with javascript disabled.

You can use a button outside of a form  and attached javascript to it.
This might not be semantically correct, does everything John wants.
Only problem does not work with javascript disabled.
  


Unfortunately not valid HTML according to my tests but it will work.

Alternatively you can use syntax such as id="nextButton">Next and attach javascript with that. The 
type=button attribute means nothing will happen when you click it unless 
you attach behaviour via JS.


-Rob


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] IE and the element

2009-02-23 Thread Robert O'Rourke

Patrick H. Lauke wrote:

On Mon, Feb 23, 2009 at 2:10 PM,   wrote:
  

Surely the button element is REQUIRED to be enclosed in a  ??



Is it though? Just looking at HTML 4.01, I don't think it's
forbidden/invalid to have form elements outside of 
http://www.w3.org/TR/html401/interact/forms.html#edef-BUTTON and even
in HTML 5 I don't get the impression they have to
http://www.w3.org/TR/html5/forms.html#the-button-element

(Sorry, genuine question...not trying to be facetious).

P
  


I don't really know how toread the DTDs properly but the following from 
the HTML4 Strict Doctype seems to suggest they need to be inside a form.


http://www.w3.org/TR/html401/interact/forms.html#edef-BUTTON> 
- -
(%flow; )* -(A|%formctrl; 
|FORM|FIELDSET)
-- push button -->


I did some tests anyway to be sure 
http://www.sanchothefat.com/dev/sfhelp/validations.php and Michael is 
exactly right.


-Rob


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] IE and the element

2009-02-23 Thread Robert O'Rourke

Frank Palinkas wrote: 
On Mon, Feb 23, 2009 at 1:43 PM, Nick Cowie > wrote:


Rob wrote:
>Buttons were mainly designed as triggers for javascript behaviour,

I disagree, if you look at the original HTML 4 material, you will see
that the button element promoted as an improved input element.

Why not
foo
--
Nick Cowie
http://nickcowie.com

IMHO, not very semantic in nature. We need the button element to be 
able to carry a valid link-type attribute. Enclosing it in a form just 
don't cut it. It must be able to stand by itself as an alternative 
means to activate a hyperlink, as another aspect of its functionality.


Med vennlig hilsen / Kind regards,

Frank M. Palinkas
Technical Writer, Opera Software
http://dev.opera.com/articles/accessibility/ 



I've asked on the WHATWG mailing list before whether they will consider 
adding the href attribute to buttons and inputs in HTML5 but no one 
really noticed it. Maybe someone with a bit more clout could do the same?


Also thanks for educating me Nick, the button element is an improvement 
semantically and more useful from a CSS point of view aswell. I hadn't 
considered that.



In terms of an immediate solution it look like there isn't one without 
using CSS and :hover to make the links in question and submit buttons 
look and behave the same way.


-Rob


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] IE and the element

2009-02-23 Thread Robert O'Rourke

John Horner wrote:

I adopted the use of the  element in an application I'm working
on, used like this:

foo

one main reason I liked buttons is that they can be disabled with an
attribute, which was useful for things like keeping a "next" button
everywhere, so that the layout was consistent, but disabling it when
there was no "next" page to go to.

Also I could build up the right URLs (complex ones using query strings)
which populate the HREFs on the server side and have a click which just
followed that link rather than submitting a form, which would mean using
a number of hidden fields and branching based on the button name.

This is valid HTML, though it might be an unorthodox approach, and it
worked well until I tested the code in IE. In IE6 it just plain doesn't
work, the buttons don't respond to clicks. Unless they're set to
"disabled" in which case they *do* work.

Any ideas or workarounds? Or am I just going to have to re-code
everything?
  


Buttons were mainly designed as triggers for javascript behaviour, as 
they don't really do anything. You'll either just have to use plain 
links (which you could always style similarly to your submit buttons) or 
only use submit buttons with name attributes and handle them accordingly 
server-side eg:








These are the only non-javascript cross browser solutions to your 
problem that I know of.


-Rob


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] label:hover - more harm than good?!

2009-02-04 Thread Robert O'Rourke

tee wrote:




Thanks Rob, and David.

If the label and the checkbox or select have matching 'for' and 'id' 
attributes they should be getting focus when clicked. As far as the 
value label:hover goes I tend not to make labels change colour on 
hover as they may be misinterpreted as links. If you want people to 
know that they can click on the label text use 'cursor: pointer;'.



It communicates that something can be clicked, and if it doesn't 
change colour it should communicate that it won't take you away from 
the current page.


Good point! I didn't give it a good thought about hover suggets that 
it's a link.


tee


No worries. It's always tempting and I sometimes use :hover on the 
inputs themselves but it's part of the whole "don't make me think" way 
of doing things. If you think something may cause a website visitor to 
pause and think "what was that about?" then you need to pull the styling 
back a bit.


-Rob


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] label:hover - more harm than good?!

2009-02-02 Thread Robert O'Rourke

tee wrote:
I use "label:hover" for a site, it's working fine when there is one 
input field or radio button. But it's creating a confusion for client 
on checkboxes and select option as clicking on the label text trigger 
no focus /selection on checkbox or option.



One oversight I did that added extra confusion was to make the 
label:hover and a:hover the same color, so this is remediable, but 
different hover color for label still couldn't solve the above problem.


So I am wondering if label:hover adds no benefit to a site.

tee


Hi Tee,
If the label and the checkbox or select have matching 'for' and 'id' 
attributes they should be getting focus when clicked. As far as the 
value label:hover goes I tend not to make labels change colour on hover 
as they may be misinterpreted as links. If you want people to know that 
they can click on the label text use 'cursor: pointer;'. It communicates 
that something can be clicked, and if it doesn't change colour it should 
communicate that it won't take you away from the current page.


-Rob


***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: memberh...@webstandardsgroup.org
***



Re: [WSG] your best practise for CSS sprites for elements that have no height declared

2008-11-24 Thread Robert O'Rourke

[EMAIL PROTECTED] wrote:
If I remember rightly if you are able to save the image with a 
transparent background it keeps the file size lower because a 
transparent pixel takes less space than a pixel with colour 
information. 




It may be possible to get better compression on a file that contains
lots of pixels of the same colour, but all pixels require the same basic
storage, regardless of whether they are transparent or not!

Mike


Mike Brockington
Web Development Specialist

  


Sorry I should have been specific - my above comment is based on my 
experience of exporting 8-bit PNGs from FireWorks. When I made a large 
area transparent (the background area around the text for a navigation 
sprite) it gave me quite a significant sizer difference compared to a 
filled background.




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



Re: [WSG] your best practise for CSS sprites for elements that have no height declared

2008-11-24 Thread Robert O'Rourke

tee wrote:
I am trying to optimize a site, though the file sizes of the overall 
images aren't so much of a problem but the http requests. So I am 
attempting to put 10 icons in one gif file, the individual icon size 
is merely 600b and the dimension is 18px by 12px.


I made a 18px by 150px to hold 10 icons vertically, that makes the 
size a mere 4kb, problem is, there is no width declared in the list 
element that the icon is declared as background image, so when I make 
the font size bigger, the 2nd icon in the vertically order see 
through; one more increasement, I can see the 3rd and half of the 4th 
icons. so I estimate I have to give a least 80px space in height to 
prevent this from happening, by doing so, the file size is double.


I guess this is alright as it reduces 9 http requests, but for other 
big images, I estimate I might have to make the height over 1500px to 
solve the problem that occurs when font size increases. I guess this 
is a twofold question: 1) How do you do to prevent the above issue 
from happening, if possible?; 2) Does this method really justify the 
reduces of http requests?



Thanks!

tee


If I remember rightly if you are able to save the image with a 
transparent background it keeps the file size lower because a 
transparent pixel takes less space than a pixel with colour information. 
You can put a coloured outline around the sprites themselves to avoid 
jagged edges in IE.


-Rob



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



Re: [WSG] Missing Icon and strange Legend margin in IE7

2008-11-24 Thread Robert O'Rourke

Cole Kuryakin wrote:

Hello All -

...

First, go here with FF:
http://www.koisis.com/.clients/asdem/dev/index.php?cmd=004004

You'll notice in the UL a heading called "Getting Help". In that the single
LI that follows there's a little question-mark icon (which sit's in a span
tag). That's the way it should look.

Now, within the fieldset (pink box) there are two Legend items (green boxes)
with two other large question mark icons with "Personal Information" and
"Curriculum Vitae" next to each.

This is the way that should look also.


Now, head over to the same link with IE7.

What you'll see in IE 7 is that the little question-mark icon in the
"Getting Help" UL/LI has vanished, and the Legends within my fieldsets have
shifted to the right.



Can anyone please show me the error of my ways in regards to both of these
issues?

Great appreciation in advance!

Cole
  


Hello,

I haven't had time to check the image issue but the legends being 
shifted right is an IE oddity affecting versions 7 and below.


In your IE stylesheet you need to target the versions mentioned above so 
the following should work for you:


* html legend { margin-left: -7px; }  /* IE lte 6 */
*+html/*/*/ legend { margin-left: -7px; } /* IE 7 */

-Rob



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



Re: [WSG] Disappearing legends in IE 6

2008-11-17 Thread Robert O'Rourke

Christian Montoya wrote:

Hello list. I just put up a new design at http://christianmontoya.com
and I'm just trying to "make it work" in IE 6. The one problem that's
left is that the legends on my fieldsets don't show up. If you view it
in IE 6 you'll see just white spaces in place of them. Can anyone
suggest a fix? Thanks in advance.
  


When you highlight it it's just a thin band. Check your line-height on 
that element, you could also try setting a height in ems on it.


This line in blueprint's ie.css is also worth investigating:

* html legend {margin:-18px -8px 16px 0;padding:0;}

I've never had to apply negative top margin to a legend.

HTH,
Rob




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



Re: [WSG] iphone should not be part of your url

2008-07-23 Thread Robert O'Rourke
Incase it hasn't come up yet the reason for doing this is pretty 
straight forward. You might want to serve up the same content but with a 
BIG reduction in the amount of markup used and smaller image files. 
Bandwidth costs money on a mobile and your users will appreciate the 
reduced costs and download times when browsing your site. Having said 
that it's only really an issue for content and markup heavy sites such 
as facebook.


Rob


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



Re: [WSG] Semantic coding of "posted in"

2008-06-13 Thread Robert O'Rourke

Rick Lecoat wrote:

On 13 Jun 2008, at 04:05, Jason Ray wrote:


Definition lists are for definitions, which this is not.


Not necessarily so. The W3C gives character dialogue as an example 
usage of a DL http://www.w3.org/TR/html401/struct/lists.html#h-10.3 
which seems to encourage finding less literal uses for it -- and 
plenty of designers use the tag to semantically group collections of 
semantically-connected text chunks/images etc in all manner of 
creative ways.




Where's the character dialogue example?  I thought that the example 
found at http://tantek.com/presentations/2005/03/elementsofxhtml/ (the 
slide called XHTML compound: Conversation) was much better semantically.


What's actually wrong with using a simple unordered list? For example:


   Posted in:
   
  ...
  ...
   


-Rob


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



Re: [WSG] animated gif not animating...

2008-06-10 Thread Robert O'Rourke

[EMAIL PROTECTED] wrote:


HI,

 

I have an ajax call in my page and while loading I am showing an 
animated loading gif animation. Sometimes  In IE the animated gif is 
not animating.


Anybody knows why?

 


Thanks a ton in advance..

 


Thanking you

*Naveen Bhaskar *



Can you provide a link to the page or a demo Naveen? To get this working 
most scripts I've seen insert the image into the HTML immediately after 
the page loads but hide it, either off-screen or using 
style="display:none;". Then when the script displays the image it is 
already loaded and animating.


I guess in IE it can't buffer an animated gif while the rest of your 
script runs.


-Rob


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



Re: [WSG] styling address tag or microformat hcard

2008-06-05 Thread Robert O'Rourke

tee wrote:


On Jun 4, 2008, at 2:07 AM, Robert O'Rourke wrote:

 So you could have:




Rob, thank you so much!

It still wrapped inside the  tag, I afraid it may throw the 
site into hundred lines of errors if I remove the address tag 
altogether in many of the php and phtml files. Guess I just have to 
live with it.


Best,
tee


No problem, I don't think there will any problems with removing the 
 tags but it depends on whether or not you have the time to go 
through the templates and test it out. I'm doing the same thing myself 
at the moment inbetween other projects so hopefully they'll consider 
changing the markup with a future release.


-Rob



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



Re: [WSG] styling address tag or microformat hcard

2008-06-04 Thread Robert O'Rourke

tee wrote:


On Jun 3, 2008, at 4:49 PM, tee wrote:




Thierry


afaik, the address element is not supposed to contain this kind of
information as it is related to the people who "maintain/are 
responsible"

for the document itself (or a section of the document).


It's a plain English but I read it many times, still I don't quite 
understand what you meant by 'not supposed to contain this kind of
I look into the Mage folder, and the file I found that maybe 
controlling the address globally is located in 
'Mage/Customer/etc/config.xml'.




Forgot to add, strictly speaking, that address is xml format, not html 
address tag correct?


here is the code:

HTML
true



I found this 'How to add style to XML'in W3C site.
http://www.w3.org/Style/styling-XML

tee


It won't be that XML that you are styling, it just allows you to define 
an HTML snippet that is used when the template calls addresses. 
Everything inbetween the  section in the  
tag will be written into the HTML so you can write your custom HTML 
there. So you could have:




-Rob


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



Re: [WSG] styling address tag or microformat hcard

2008-06-03 Thread Robert O'Rourke

Thierry Koblentz wrote:

Hi Tee,
 
  

In Magento, they use
...
for customer address.



afaik, the address element is not supposed to contain this kind of
information as it is related to the people who "maintain/are responsible"
for the document itself (or a section of the document).

 
  

It lacks flexibility for styling as I can't have other html tags place
inside the address tag. I  wonder if there is a semantical way to do
it and that it produces no validation error. Also,  if any of you have
started developing sites in Magento, do you know if I can incorporate
Microformat hcard easily?



That's the way to go, but I don't know about Magento
  


Hi Tee,

under 
app/design/frontend/default/default/template/customer/address.phtml you 
can use this code inplace of where it says '..' (line 
30 or thereabouts).


   
   
   $_address->toString("{{firstname}}"); ?>
   $_address->toString("{{lastname}}"); ?>

   
   
   $_address->toString("{{street}}"); ?>
   $_address->toString("{{city}}"); ?>
   $_address->toString("{{regionName}}"); ?>
   $_address->toString("{{postcode}}"); ?>

   
   
   T: $_address->toString("{{telephone}}")); ?>

   
   

It's not ideal, there might be some missing fields for example so it's 
usually best to only write out the surrounding HTML when the variable is 
present. There's a bunch of places where addresses appear aswell as this 
but that don't give you an easy way of separating out the parts of the 
address eg. book.phtml - for that file i just replaced  with 
.


Hope that gets you started

-Rob


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



Re: [WSG] Marking up company logo

2008-05-30 Thread Robert O'Rourke

[EMAIL PROTECTED] wrote:

If you want to look at things from that angle, then we have to make a
split between what the user wants - news, information, entertainment,
etc.
what the commissioner wants,
and what the search engines want.

All sites on the web arguable fall into one of three categories:
Hobby sites,
Businesses,
Promotional sites (for businesses mainly)
  


Web Apps, Teaching sites, intranets, social networking???


NB The difference between the latter two may not be obvious to the
end-user - it is a business decision made by the owner.

For sites that do fall into the latter category, whether or not they
carry news items, the site is NOT 'about the news' it is about promoting
the larger business.

Clearly every site needs to make the right balance between the needs of
the users, the owners and the search engines, but any suggestion that
this can be covered by a single sweeping, blanket statement is a
surprise from someone with your reputation and experience.
  
Regards,Mike


  

-Original Message-
From: [EMAIL PROTECTED] 
[mailto:[EMAIL PROTECTED] On Behalf Of Stuart Foulstone

Sent: Friday, May 30, 2008 9:37 AM
To: wsg@webstandardsgroup.org
Subject: RE: [WSG] Marking up company logo


But the Webpage (or the entire site for that matter) is not be 
about "The Sun" or "The Times" - it's about the news.  And the 
news is what the user is looking for.



Stuart is talking from the perspective of SEO. It would be desirable for 
a website like 'the times' to be the top result when you google 'news'. 
You're right that it depends on context. Lea and I think Ben Buchanan 
mentioned that they use  for company name on the home page which is 
an excellent idea. Think about it, unless the company/website name has 
absolutely nothing to do with what it does then for a home page the 
company name is key. Especially so for well known brands or for any site 
that wants to be found by name and not just through it's normal content. 
Some sites have only a home page and hidden content that requires 
registration eg. facebook.


I still think using hCard markup for the website name and logo is a good 
alternative to add to this argument.


-Rob


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



Re: [WSG] Marking up company logo

2008-05-28 Thread Robert O'Rourke

Chris Pearce wrote:


Hi,

For a few years now I’ve been marking up a clients company logo as a 
. I just wanted to get an idea of how many people actually do this 
compared to using a html image tag? I believe a  is more 
semantically correct however I’d be interested in seeing what other 
people on this list think.


Cheers



Hi Chris,

I've often asked myself whether h1 was the best thing to use, and I used 
it primarily because it was the first thing to appear on the page and I 
wanted my headings in a logical order.


I now use the hcard microformat to mark up the company name and logo 
because it offers some decent semantic class names and can be exported eg.




http://www.example.com";>

Company Name





You can then extend the vcard using the include-pattern elsewhere on the 
page such as the footer or just leave it as a simple vcard.


http://microformats.org/wiki/hcard

Regards,
Rob


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



Re: [WSG] Tag for quotes

2008-05-20 Thread Robert O'Rourke

Rob Enslin wrote:
Please could someone help me decide which is the most appropriate tag 
to use with quotes? These are actual comments made by folk during a show.


For example:



LIW 2007 was a great show for Technogym. We showcased an 
exciting 7 new products which our customers loved. LIW is a great 
event to help us showcase our products and present our latest 
solutions to the market!

TECHNOGYM UK LTD

or



LIW 2007 was a great show for Technogym. We showcased an 
exciting 7 new products which our customers loved. LIW is a great 
event to help us showcase our products and present our latest 
solutions to the market!

TECHNOGYM UK LTD

Any help most appreciated.

Thanks,

Rob 


Hi Rob,

In this case I'd use the  element personally eg.


   
  LIW 2007 was a great show for Technogym. We showcased an exciting 
7 new products which our...

   
   TECHNOGYM UK LTD


Alternatively use  to wrap the quote itself, and  to mark up 
the source of the quote.


The spec has some more examples: 
http://www.w3.org/TR/html401/struct/text.html#h-9.2.2


Regards,
another Rob


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



Re: [WSG] possible to make absolute position moves down with fontsize resize?

2008-05-16 Thread Robert O'Rourke


Lately I have coded many templates that clients wanted an element 
that aligns horizontally and has it stayed at the bottom of a 
content  block. The only way I could think is using absolute 
position, but it  creates an overlapping problem with font size 
resize. I am curious if  there is a technique that I am totally 
unaware of (already googled and  visited the archive of css-d).


example ($xx/month):
http://lotusseedsdesign.com/s/raz_compare_plans.html

Thank you!


tee


Thomas Thomassen wrote:
Add some padding at the bottom of the content with the same size as 
the absolutely positioned element. That should prevent the preseeding 
content to not overlap. You might have to do some position and size 
adjustments to make it all fit again after you add the padding.




While that will work quite nicely you could also avoid absolute 
positioning altogether. Because those ordered lists are all nicely lined 
up you could set the min-height rule on them instead of .box_res and 
.box_biz eg.


add this:

.box_res ol,
.box_biz ol {
min-height: 220px; /* dont forget IE<=6 needs a fallback */
}

and remove the positioning from .price:

#content p.price {padding-left: 20px;}

Then you may need to tweak the margin/padding on p.price to get it perfect.

Another way to do this would be to set the min-height on .box_res and 
.box_biz to a value in ems (so they stay the same height on text resize) 
although that approach isn't entirely bullet-proof if the text in those 
boxes is likely to change.


Pick your favourite solution :)

Regards,
Rob


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



Re: [WSG] Older Browsers

2008-05-08 Thread Robert O'Rourke

Krystian - Sunlust wrote:

IE5 ?
Each time I hear about IE5 I want to laugh, honestly, IE6 is old, and
most companies that actually create revenue in our modern times use
Vista and IE7, who would worry/use IE5?
My friend who I just finished designing website for is using IE6 but
his computer is like 2-3 years old, what kind of a company uses that
old hardware ??

Anyway, end with the rant, in my opinion there should be some strong
compaign to cut the usage of IE5 and IE6 because it's just silly to
try to develop modern websites in our "web 2.0" world for those
useless browsers.
It's like trying to design new aeroplanes and test them with steam
engines instead of jet ones.

Get a grip, for old browsers theres only one kind of a website I would
create: "Click this button to download Firefox".

Regards,
  


I had a customer recently whom I had prepared a rough demo page for, it 
worked for ie6,7, Opera and FF but when I got some feedback they weren't 
happy in the slightest because I'd sent them a mess. Anyway, we checked 
the server logs and it turned out they were using an unpatched IE5 on an 
unpatched windows 98! (which of course was perfectly reasonable, just 
uncommon).


We convinced them to upgrade their IT equipment but it was an eye 
opener. It never pays to assume that everyone is/should be bang up to 
date just because you are sick of working around IE bugs (we all are). 
Assumption is the mother of all ups. If you don't write CSS for 
those very old browsers eg. IE5.x (which I must admit I don't) I find it 
best to hide the CSS from those browsers altogether using conditional 
comments and the media attribute when linking to CSS. Using the same 
approach you can add a note to say why the site looks the way it does.


re. 'some strong campaign': http://www.savethedevelopers.org/

-Rob


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



Re: [WSG] Site review

2008-02-25 Thread Robert O'Rourke
No big layout issues at all but on a quick perusal there are few things 
I've noticed:


The stripey background - close thin stripes get flickery and a bit 
distracting when the page is scrolled


IE:
   - the search area needs some cross-browser attention. font-sizes, 
input widths and the submit button padding are a bit dicey (but at least 
similar in IE).


   - the text 'Search:' has lost the clear-type filter that IE7 
imposes. I only know of this to happen when another IE CSS filter is 
applied to the element or its parent. Typically it's the opacity filter 
that's the culprit but it doesn't look like you've used that and I don't 
know off the top of my head what else causes it.


-Rob


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



Re: [WSG] how to set table column widths with CSS

2008-01-11 Thread Robert O'Rourke

Katrina wrote:

Gday,

Can someone please remind me how to set the width on a simple table 
column without suffering classitis?


Doctype: HTML4.01 strict. Must validate.

Thanks!
Kat



Hi Kat,

  I tend to mark up my tables using something like this:


   
   
   Column 1
   Column 2
  
   
   
  
 value 1
 value 2
  
   


It is attribute heavy but you can use the following CSS:

#c1 { width: 70%; } // column header width sets whole column width
#c2 { width: 30%; }

Works quite well for me cross-browser. Plus it's probably semantic 
(whatever that really means...)


-Rob


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



Re: [WSG] Opera files antitrust against MS: standards one part

2007-12-14 Thread Robert O'Rourke

Jason Pruim wrote:


On Dec 14, 2007, at 12:09 PM, Genesis One And One wrote:



I want another OS that works like Windoze but is better than Windoze. 
I wish Mozilla would develop one. Their products are already consumer 
friendly etc. Imagine a FFOS. I would imagine M$ poor customer 
support and glitchy software would warp forward. I'd imagine it would 
become superior. Because that's what a serious competitive market 
does to companies that want to compete and win.


Ummm... There already is... www.apple.com No virus's


Not quite true but quickly fixed: 
http://www.symantec.com/enterprise/security_response/weblog/2006/07/macinenterprise_mac_os_x_virus.html



, no spyware, no adware, the stability of unix at the core


I've heard good and bad about the stability of macs, especially since 
the move to intel chipsets.


, and the GUI of an easy to use interface. They also have great 
customer service both on the phone, and in person...  I've dealt with 
both.




I think the reason OSX does well is because apple have complete control 
over the hardware, I can't remember who said it first but the fact is if 
microsoft built a microsoft computer specifically for running windows it 
would probably be at least as good as if not better than a mac. Macs 
aren't for people on a budget. A PC that is made up of components from 
umpteen different manufacturers can't really compete when it comes to 
the overal experience. Plus what's easier to support, a relatively small 
amount of Mac+OSX (which is a very well defined product) or the vast 
majority of PC users running Windows on god knows what?


Ubuntu is coming along nicely, good for all kinds of development at the 
very least. It also has the stability of unix.


-Rob


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



Re: [WSG] Web Design Test - IE Users

2007-09-21 Thread Robert O'Rourke

Joseph Taylor wrote:

Hey everyone!

I wanted some of you windows users to test out this site if you'd be 
so kind on your IE browsers.


http://steveframe.sitesbyjoe.com

Please let me know if there are any layout issues you encounter (float 
drops etc)


Some pages won't validate because I'm scraping the table-laden content 
from the parent company's awful, though I try to clean them up 
somewhat (sales and rental search).


I noticed a couple heading issues on my old win2k server, but it has 
an odd resolution and things look as horrible as they possibly could...


Thanks in advance!



Very nice Mr Taylor,

One section that needs some attention is the search form, there's about 
15 errors that HTML Tidy caught that are producng some odd effects (/>s in the ?). Once you have that validated it should start to 
look more consistent cross-browser, let us know once you've done that. 
Also this little snippet will prevent the dropdown button from 
overlapping the text in the options on the dropdowns:


option { padding-right: 0.5em; }

Cheers,
Rob


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



Re: [WSG] Font sizing: top down or bottom up

2007-09-05 Thread Robert O'Rourke

Middle out?

I don't really worry about the font-size other than to leave the default 
on the body tag at 100%.
From there I size fonts relatively up or down depending on the design, 
if it's my own design I never dip below 12px. As long as you don't use 
px for font-sizing in the CSS the site is accessible (within the context 
of font size) IMO. It may not be immediately accessible in its default 
state but if font-size is such a problem then the people who make 
browsers should consider it as much as we do (there's only so much we 
can do) and offer some accessibility controls on the toolbar, like IE7s 
zoom button. It may not be the best way but at least it's right there 
for the user to see as opposed to ctrl & + or ctrl & mousewheel.



Don't get hung up on it, just take it into consideration when you design.

Rob


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



Re: [WSG] Looking for a Stylesheet Switcher Script

2007-08-03 Thread Robert O'Rourke

Ryan Moore wrote:

page cannot be displayed...???

On 8/2/07, *Robert O'Rourke* <[EMAIL PROTECTED] 
<mailto:[EMAIL PROTECTED]>> wrote:




http://webrocket.ulmb.com/ability/
<http://webrocket.ulmb.com/ability/>



Strange, works for me...
The alistapart article someone sent you looks like a good solution. Same 
thing I guess but it won't conflict with scriptaculous (I assume because 
the article is from 2001).



Rob


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



Re: [WSG] Looking for a Stylesheet Switcher Script

2007-08-02 Thread Robert O'Rourke

Ryan Moore wrote:
I'm looking for a Stylesheet Switcher Script that users can use to 
dynamically change text sizes on the fly. 

Our text size is already quite legible and sized in em's for easy 
resizing, but i've been told by the powers that be that we also need a 
style sheet switcher. 


Anyone know where i can find a nice script for this?

RM



You don't necessarily need a style sheet switcher for that. If its the 
global font-size you're changing just some javascript to edit the css 
property and a cookie to store the user preference as they navigate 
between pages would be sufficient.


I'm in the jquery camp when it comes to creating simple js effects like 
this. Are you comfortable with writing javascript at all? If not there's 
a a plugin I saw a while ago that might be of interest.


http://webrocket.ulmb.com/ability/

Ironically though the page has a js popup ad the first time you go to 
it... the plugin seems to be alright though.


Rob


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



Re: [WSG] Absolute positioning in the flow of the document?

2007-08-02 Thread Robert O'Rourke

Paul Collins wrote:

Hi all,

...snippy snippy...

Sorry for the long email, but my basic question is, does anyone have
another suggestion of positioning that second level nav without taking
it out of the document flow?

Thanks for any help!
Paul
  


Hi Paul,

   Your menu seems fine when I resize three times, in practice it's 
quite unusual to need more than that so I'd say you've done a sterling 
job so far (I like your design too!). There is a solution to the links 
wrapping however and that is to implement a min-width on the page body. 
Of course this would look out of place with the header image after a few 
resizes.

   In my opinion you don't need to change anything.

   Rob


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



Re: [WSG] auto-hiding bottom part of bg image when resizing fontsize

2007-06-18 Thread Robert O'Rourke

Tee G. Peng wrote:


On Jun 18, 2007, at 11:49 AM, Thierry Koblentz wrote:




I may be wrong, but I'm not sure ie6 does transparent border (if I 
recall,

it turns them black).



Yeah, it doesn't. I actually not sure how to write the rule.
I had {border-top: 5px transaprent},
{border-top: 5px; border-color: transaprent}

It doesn't work in Firefox and Safari, then I realized even if I got 
it correct it probably won't won't in IE.


So I used {border-top: 5px solid wheat } /* wheat the same color as 
the h2 background */


sorry about that, thanks for the gotcha Thierry!



By the way, I have a question regarding fixed background position

it doesn't work in this way in Safari and Firefox either.
#container {background: url(image.jpg) fixed no-repeat}
so I changed to
 #container {background-position: fixed}


Im pretty sure it was working for me in Firefox just before... the 
background image scrolled with the page. Not sure why it wouldn't have 
worked for you.




But I am certain this works
body {background: url(image.jpg) fixed no-repeat}

why?


It's one of IE6's many peculiarities, I just came across this adaptation 
of Eric Meyer's complex spiral demo after some googling:

http://www.gunlaug.no/tos/borrowed/complexspiral.html

should make things a little clearer regarding background attachment.




tee


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








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



Re: [WSG] auto-hiding bottom part of bg image when resizing fontsize

2007-06-18 Thread Robert O'Rourke

Tee G. Peng wrote:


On Jun 18, 2007, at 9:39 AM, Robert O'Rourke wrote:



Hi Tee,
nice looking page! It doesn't get a vertical scroll bar though 
(firefox 2 latest)...
could you attach the background image to the bottom of the main 
content area as opposed to a fixed position on the body? that way it 
would move up if the text size was reduced.


Thanks Rob.

I think for notebook users,  vertical sroll bar will show . Moving 
photo to the container creates a small problem, with vertical 
scrolling, the tagline image jumps. I need to work out a precise 
calculation in pixel or change that big image to alpha PNG.


One other thing I noticed was when you hover the large links they 
change height slightly, looks nice but when you hover just on the 
edge you get some mad flickering. You could maintain the height by 
replacing the padding with a transparent border.


 Ah yah! I was thinking to have a pseudo javascript transition effect  
:). Thanks for the tips!



tee



All looking good now, just that fixed background to sort out. You either 
need to make that top banner into a png overlay to go over the photo of 
Wanda or simply remove the fixed declaration from the container 
background style. I think IE6 only respects background position fixed on 
the body element which I guess is why you had it there to begin with... 
In that case I think Jamie's solution is the one to go for, along with 
an alpha png top banner and the background fixed as you had it before.


Nice work =]

Rob



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



Re: [WSG] auto-hiding bottom part of bg image when resizing fontsize

2007-06-18 Thread Robert O'Rourke
sorry Tee, misread your question. Put the background image in the div 
that has the white background (#container i think) and it won't show up 
below the footer.


@Jamie: that password isn't stupid just because it gives firebug a hard 
time. Why not use chris pederick's developer toolbar AND firebug? you 
can have your cake and eat it too.




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



Re: [WSG] auto-hiding bottom part of bg image when resizing fontsize

2007-06-18 Thread Robert O'Rourke

Tee G. Peng wrote:
In this page I have the photo placed in body background with fixed 
position. When fontsize enlarge, the bottom part of the photo shows 
the background color which is fine because I intentionally wanted it 
appears as if it's part of the design, however when fontsize reduces, 
the footer moves up as expected, but I want to make the bottom part of 
photo moves up with the footer.


I can't think of a way to make it happens. Can it be done with CSS?

http://project.lotusseedsdesign.com/wandahennig/

login: public/public

thanks!

tee



Hi Tee,
nice looking page! It doesn't get a vertical scroll bar though (firefox 
2 latest)...
could you attach the background image to the bottom of the main content 
area as opposed to a fixed position on the body? that way it would move 
up if the text size was reduced.


One other thing I noticed was when you hover the large links they change 
height slightly, looks nice but when you hover just on the edge you get 
some mad flickering. You could maintain the height by replacing the 
padding with a transparent border.


hope that makes sense

Rob


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



Re: [WSG] resizing text via graphics/text?

2007-06-11 Thread Robert O'Rourke

Designer wrote:

Good Morning/afternoon/evening,

Further to recent discussions on text size, and in particular, using 
graphics sized in ems so that they resize, I've pondered the use of 
graphical text when wanting to use  an uncommon font.  So, I put a 
heading into a simple graphic (using the required text), but I've 
noticed that when the font is a thin, light font (sometimes called 
'spidery'), the quality falls through the floor on enlargement when 
sized in ems.


However, if the heading using the font is produced in Flash, the 
quality is maintained when resizing.  You can see an example, 
comparing  3 approaches ( flash, graphics in ems and graphics in 
pixels) here:


http://www.marscovista.fsnet.co.uk/newtemplate/flashtext.htm

I dare say this is nothing new, but I'd like to know if there are any 
(simple) improvements to be made to the approach I've used, and I'd be 
grateful for any useful comments.


Many thanks,


Hello,
being able to resize the flash text is pretty sweet. I don't know if 
you've ever seen sifr (http://www.mikeindustries.com/sifr/) but it's a 
well put together accessible solution for putting nice anti-aliased 
fonts on a page. If you can extend it to be re-sizable too it would be 
perfect.


All the best,
Rob
  



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



Re: [WSG] OT on list

2007-05-29 Thread Robert O'Rourke
I think it would be more useful to try an work out where Marvin is 
coming from when he mentions those two programs. He's on a web design 
course and has some awareness of web standards and that it's good to 
support screen readers. Some of these courses are still teaching 'Save 
as HTML' and bingo you're done (perhaps with some tweaks), whereas I 
assume most people on this list have got all the basic concepts down and 
write all their code by hand and are used to using css to convey design.


I'm guessing, and no offence to Marvin at all, that he's getting 
confused by the minefield of opinions that abound around the topic of 
web standards and is still working through the basic concepts and 
principles that we take for granted. I've not read the whole thread but 
I'm not sure anybody has actually tried to answer his questions.


So, Marvin,
Photoshop is for creating/editing graphics and sometimes designing a 
website.

You code your website content with HTML,
You then use the graphics/design created in photoshop via the CSS to 
style the HTML.


JAWS is then used by some people to read the HTML out.
Photoshop has nothing to do with web standards directly and JAWS 
compatibility is down to the quality of your HTML.


That's probably an over simplified explanation but my point is instead 
of arguing about what's OT at least try and get it onT where possible. 
We're here to educate aswell as discuss.


Rob


Jamie Collins wrote:

If you read what i said properly you will understand what i said.

Do you see the part that says'When Web Standards Are Involved'?
I didnt mention photoshop anywere, i said when Web Standards are 
Involved.


So since when does Photoshop mean Web Standards? Because i didn't say 
that.


On 5/29/07, *Hassan Schroeder* < [EMAIL PROTECTED] 
> wrote:


Jamie Collins wrote:
> Assistive Technology is by no means off topic when Web Standards
are
> involved.

!? and "Web Standards" and "Photoshop" intersect exactly where? :-)

--
Hassan Schroeder -
[EMAIL PROTECTED] 
Webtuitive Design ===  (+1) 408-938-0567   === http://webtuitive.com
opinion: webtuitive.blogspot.com





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



Re: [WSG] dl v table for form layout

2007-05-25 Thread Robert O'Rourke

Barney Carroll wrote:

Stuart Foulstone wrote:

Hi,

The "for" attribute should NOT be used when the label tag encloses the
label text.


What are the dangers?


Regards,
Barney



Hello,
Its probably not a danger per se for most people but if you ever use a 
cms that writes out form fields sometimes they write out hidden fields 
along with them, if these are wrapped in a label along with the intended 
input/select/whatever then firefox chokes, I can't remember now whether 
it was only when the visible input wrapped in the label had no id 
matching the for attribute. If the label wraps a select and there are 
hidden inputs inside that label then the select does not stay open 
unless you click and drag the mouse to the desired option.


Basically either way is fine, so long as it's one input per label.

Rob



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



Re: [WSG] Photo gallery markup & semantics

2007-05-22 Thread Robert O'Rourke

Jason Robb wrote:

Hello friends,

I'm marking up a group of (maybe 25-50) anchored images.
They need to be held tight to a grid, and I want about 6 or 8 to a row.
Here is the (lazy) table based solution: 
http://bws.jasonrobb.com/collections/


I've considered a few different approaches.
I want to know: What is the most semantic way to go about this?

[Note: trimmed down code]

1) Using DIV's to hold the anchored images:


 
 


2) Another method with a UL:


 
 


3) My least favorite (and likely wrong) choice - with a table:



 
 



It's been pickin' my brain for days.
The main reason I even considered a table is because the anchors leave 
an empty space between the images.
I've set up a test page here: 
http://bws.jasonrobb.com/content/image-test.html


What do you think is causing that extra space? How can I avoid/remove it?



What browser(s) do you get the space in? At a glance it looks fine to me 
in FF. And I would stick with the div for display, while lists are fun 
it looks odd with CSS off (my opinion of course, i hate lng 
pages), my preference is to keep imgs and anchors inline and then use 
vertical-align: middle; so they stretch across their container and stack 
fairly well in any situation. If you need captions and the like you'll 
need to use floats and if you need a solution for any situation e.g. if 
you don't know the aspect ratio/size of the images etc... etc... 
unfortunately a table is the only thing that really keeps a tight layout 
together. I figure a table of images isn't too big a travesty because it 
will read out sensibly but it's certainly not ideal.


I guess what I'm saying is it depends on the particular job you're 
doing, work out what is constant about the images you display and what 
might change then use whichever method is most appropriate. Hope thats 
some use to you.


Rob


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



Re: [WSG] ive given up on css

2007-05-16 Thread Robert O'Rourke

Susan Grossman wrote:


Today i just told them to go back to using table based layouts and i
will restrict my designs accordingly- i cant listen to the whining
anymore.

What would you have done in this situation?




Back to your original topic - the client is always right in the end.  
You can present white papers and expert opinions, but in the end the 
decision the client makes stands.


Dumping the client doesn't seem to be a pro attitude, though it may be 
how we feel  :)


I just wanted to emphasize that you did the right thing for the 
client, and that's what it's all about as long as the code is valid 
and accessible.




That's Kevin's problem, although the code might be valid it's very 
likely to be poorly accessible. You're absolutely right about not trying 
to force their hand. Accessibility is their concern if all you're doing 
is providing designs and they do the code. Bit more boring to design for 
I'd imagine but whatever puts food on the table.



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



Re: [WSG] ive given up on css

2007-05-16 Thread Robert O'Rourke

Nick Roper wrote:


Brilliant, now THAT's what the Web is all about. Forget all that 
standards stuff, clipart rules!


Shame they haven't got a pair of eyes that follow the mouse pointer 
though, they missed a trick there...


Still, I plan to follow their 10-point plan in future:

http://www.wizwebz.co.uk/what.htm

Actually, it's kind of made my day. WizWebz - you're a star - long may 
your wand work its weird magic...


Nick


Hear hear =]


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



Re: [WSG] ive given up on css

2007-05-16 Thread Robert O'Rourke

Nick Gleitzman wrote:


On 16 May 2007, at 11:28 PM, Nick Fitzsimons wrote:



http://www.wizwebz.co.uk ...


 



OK, enough - I quit. How can I possibly compete with these world-class 
designers?


N


It's a tall order for sure! That zen garden submission... wow... the CSS 
file is quite an amusing read too.
If you haven't clicked around wizwebz yet go to the 'what will it cost 
me' page for the best midi ever.


Rob



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



Re: [WSG] ive given up on css

2007-05-16 Thread Robert O'Rourke

Regnard Kreisler C. Raquedan wrote:
Ouch. I had a similar situation where the client just won't listen-- 
They wanted to integrate a part of an old website to a new one that I 
did that looks *exactly* as is. I followed what they wanted and now 
they have a mish-mash of junk code.


On 5/16/07, *kevin mcmonagle* <[EMAIL PROTECTED] 
> wrote:


Hi,
I have a client that i do a lot of web design for, i hand over
jpegs-they do the code. Ive been trying to get them to migrate to css
layouts for the last two years. They never took time to learn css
properly and only manage to hack layouts together. After ie7 came
out a
lot of the layouts broke and everybody's pointing fingers.

Today i just told them to go back to using table based layouts and i
will restrict my designs accordingly- i cant listen to the whining
anymore.

What would you have done in this situation?

-best
kevin mcmonagle




On the bright side at least they aren't slapping comic sans all over the 
show, that's my only client related gripe at the moment. I think in your 
situation though it's the choice of your client as to their code. 
Chances are at some point one of their customers will ask for some level 
of web standards then they'll be all ears to what you have to say. Just 
tell them to google conditional comments if they only have ie7 issues. 
At least you can give your other clients the good stuff.


Here's a link to put a smile on your face anyway, old school web design 
studio at it's best:

http://www.wizwebz.co.uk ... (I kinda like it for some inexplicable reason)

Take it easy
Rob


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



Re: [WSG] Simple to use page layout 'tool' ?

2007-03-12 Thread Robert O'Rourke

Chris Williams wrote:

A pen and a yellow legal pad.

  


hehe, or how about MS Paint? poor thing barely gets a look-in these days.
I think most of the comps I receive are done in word... Just find 
something they know how to use already, save faffing around with any 
software training and the speight of support calls it leads to.



-Original Message-
From: Nick Roper
Subject: [WSG] Simple to use page layout 'tool' ?

I hesitate to suggest anything like Dreamweaver. Does anyone know of 
anything fairly lightweight and foolproof?



  




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



Re: [WSG] web accessibility-some thoughts

2007-03-08 Thread Robert O'Rourke

Bob Schwartz wrote:

First a disclaimer:

This post does not reflect my personal views on web accessibility or 
handicapped persons, it is merely a collection of "academic" thoughts 
triggered by various posts of the past few days.


How and why did the web get singled out from among all of the other 
"publishing" mediums to be "by law"  accessible?


Because it's a lot more feasible I guess.



Why aren't book, magazine, and newspaper publishers "required" to 
produce an audio or braille version of everything they publish?


At the end of the day business is business. There are probably those 
companies that provide versions for those that want it as and when. It's 
not something that can be mass-produced and still be cost-effective.




Why aren't TV broadcasters and movie production companies "required" 
to sub-title all of their broadcasts or films, or have an "off screen 
reader" describing the scenes?


Because most people don't need them there. Anyway we have plenty of 
options like recording the shows we want to watch with sign language or 
extra voice-over or there's teletext subtitles (if that's still going). 
The difference with regard to the web is that accessibility on the web 
is for everyone whether they know it or not. a) they'll be able to find 
your site more easily, b) it will be clearer and simple to use, c) it 
will download more quickly... the list goes on. Its all about keeping 
people happy and coming back to your site.




Isn't saying one can't (shouldn't) use, for example, a popup window on 
a web site because screen readers have trouble with them, like telling 
Hollywood they can't (shouldn't) use certain special effects because 
the "off screen reader" would have trouble explaining them to a blind 
person?




I think those examples are too different to compare like that. I hate 
popups full-stop. Not having any is improving the friendliness of your 
site to everyone, not just screen-reader users. I'm pretty sure there 
are lots of movies out that have perfectly adequate spoken descriptions 
of what is going on. Even on regular telly now (after midnight admittedly).


Every kind of media makes some provisions for accessibility, maybe not 
perfect but it's better than nothing. Seeing as it's not to difficult to 
achieve on the web making sites accessible is a no-brainer. Whether it's 
the law or not there will always be some accessible sites and some not 
as with any media. We can either do our bit or create information that 
is less widely available than it could be.


regards,
Rob


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