[WSG] Structuring CSS
Lets have it. How are you guys structuring your CSS files? I have been having a think about this over the last few days. My research attempts have failed because most the articles i came across were outdated - so i tend not to trust them. One method i thought about (not sure if it's been coined) is one based on Software Engineering principles, obeying rules such as decoupling et cetera. Maybe by using these principles modules can be included by importing the needed CSS file (and path) in the root CSS file. As i am writing this i am certain CMS systems use this method of structuring CSS. I am sick to death of having to over comment my CSS files to find what it is i'm looking for. I would much rather break up my layout into semantic chunks and create a seperate CSS file for each chunk (i.e navigation, content, footer). I'm guessing this sort of structuring comes at a cost because a number of requests need to be made to the server. Regards James Jeffery *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Structuring CSS
re - How are you guys structuring your CSS files?
for me, multiple css files for different parts of the page is harder
to manage. I'm pretty old school keep everything within the 1 css
file (within reason). this also means 1 http request which is good.
exceptions are if you had a massive admin section or something you'd
probably create a separate, additional, css file just for those pages.
to make it easier to find stuff in a css file i tend to structure my
css roughly like the html...with tabbed in sub sections
so:
#header {stuff here}
#logo {...}
#nav {...}
#content {...}
#main-column {...}
.featurebox {...}
#sidebar .featurebox {...}
i find this helps me when revisiting a file after a while. i also
format my css so they dont wrap for each attribute or whatever...
meaning each rule takes up 1 line. the tabbed formatting really comes
into play there and you can very quickly scan down the doc to find the
section you need... much like you scan a html structure.
an example of mine (albeit not meticulously formatted):
http://www.mollio.org/css/main.css
of course firebug makes finding stuff so much easier these days,
giving you a filename and line number! its almost cheating... ;-)
my 2c
pete ottery
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] Structuring CSS
Now that's a question to spark debate! Without leaning one way or another there are a number of different approaches you might try. Have you considered CSS frameworks such as Blueprint CSS[1] or the 960 grid system[2]? These approaches help to standardize your CSS by providing the basic page layout with cross-browser compatible, minimal and semantic markup. You are then left to style (bring life to) the page with the content and look and feel. There is also the old-school developer approach where you get a little more freedom. You start by resetting your css [3], then set all of your basic styles and general classes (which probably differ little across sites) and set your site/section/page/page sub-section specific styles. Traditional developers like this approach because they use their own naming conventions, and often can re-use the base css files. I'm guessing this sort of structuring comes at a cost because a number of requests need to be made to the server. You're certainly right with the cost in terms speed, by increasing the number of CSS files, but what about the cost of development time, readability and re-usability? -- Matt Fellows http://www.onegeek.com.au/ References: [1] - http://code.google.com/p/blueprintcss/ [2] - http://960.gs/ [3] - http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Breadcrumbs showing organisational structure and usability
Lib, I don't think you should leave the list over one person's comments if you are benefiting from other people's feedback. Libraries probably shouldn't fit under individual departments, but under the organisation's umbrella - I am particularly thinking of university libraries. If you are a specialised library (eg, music, medicine or law) then you should fit under the parent library which should fit under the main university's site. A particular department can link to your site from theirs, but you shouldn't fit into their hierarchy. Like you say, people use a library website for different reasons than a departmental website - you can even argue that a library forms its own department. You may even have need for specialised web templates if you have online catalogues or databases, etc. which may not fit in well with the purpose of the rest of the organisation's web templates. In my opinion, your 'breadcrumbs' or organisational structure, should probably look something like: Parent Org Library Specialised Library (Subcategory ) Current Page or Parent Org Library (Subcategory ) Current Page If I was a user, that's how I would search for you on an organisation's website. Jason On Tue, Jun 10, 2008 at 11:38 AM, libwebdev [EMAIL PROTECTED] wrote: Wow. Make a genuine enquiry, and get this. I see this list is living up to its reputation for rudeness that I was warned about before I joined. I asked for opinions on the use of breadcrumbs for the reason I stated: because I was under the impression that they showed the user's path to the current page, and the ones we're being urged to employ simply show organisational structure. I even asked Am I wrong?, and was prepared to take the information on board if organisational structure as breadcrumbs was considered acceptable. Some people have been courteous enough to express their views on the matter, and I thank them very much for that. They seemed perfectly capable of doing so without reading non-existant motives into my question. I'm not interested in gathering guru evidence to support my own view. Our webmaster would not be the slightest bit interested in anything this group has to say, what with the CMS-driven invalid muck with URLs that look like mathematical formulas that he cranks out. @Anton We are permitted, with good grace and with genuine offers of help if we need it, to have our site reside outside the CMS. I know for a fact that when someone did ask why is the library outside the CMS?, the webmaster told them because they can do it themselves. He's fine with it. It's people like me who get thanked on a daily basis for having an intuitive, fast-loading, accessible, usable web site ... thank goodness you're not in with the rest of them. ... your site is better and so much easier to use. Web standards and interoperability?? The webmaster gets a distinct deer-in-the-headlights look on his face when I utter words such as those. That is why we're out of it and will stay out of it until the organisation reuqests that we join. Incidentally, it appears I was mistaken in my original post: the breadcrumb trail will *not* include the current page, but will appear like so (on 200+ pages): Parent Org Clinical Services Library This seems even less effective than I originally thought. Clinical Services have nothing to do with us, and we have nothing to do with them, and we have a clear link back to the parent org on every page of our site. We used to be under IT, then under Executive. It changes all the time because they don't know where we fit. I know our user-base, and they are simply NOT going to say oh, now I've finished with the library site, I think I'll just pop up to Clinical Services. They use our site for reasons completely unrelated to the department above us, and indeed that of our parent org. I will, however, consider carefully the comments of those who offered their views on this type of breadcrumb usage. I don't particularly enjoy being abused by strangers for posting an honest question, so I think it's time I unsubscribed. Is that petulant enough for you Mark, or should I also slam the door on my way out? thanks, lib. On Fri, Jun 6, 2008 at 5:13 PM, Mark Harris [EMAIL PROTECTED] wrote: libwebdev wrote: My organisation manages around 7000+ pages for 100s of departments, using a CMS. Mine is the only department outside the CMS, just because we can. We have been persuaded (read: bullied) to redesign our header to exactly match that of the parent organisation. I have no problem with that per se, but theirs includes breadcrumbs, and we don't want 'em. Who pays your bills? Golden Rule is that the guy with the gold makes the rules. Suck it up. Because we can is not a valid reason to do anything. You are part of the organization, yes? Therefore you should fit within its structures and strictures, whether you like that or not. If they are wrong,
Re: [WSG] Marking up multiple form inputs
Tables shouldn't be used for layouts, use style sheets instead, but they should be used for *information* which lends itself well to a table. If you are trying to display data in an organised format, which requires columns and rows, then use a table. Jason On Tue, Jun 10, 2008 at 11:37 AM, Chris Pearce [EMAIL PROTECTED] wrote: Hi, Would the following layout be best marked up using a table: *Column Header* *Column Header* [label tag] [input tag] [input tag] [label tag] [input tag] [input tag] [label tag] [input tag] [input tag] Cheers [image: cid:image001.gif@01C7B8BB.D6C86180] http://www.bluearcgroup.com/ solutions for a digital world *Exchange Server 2007* Built-in Protection, Anywhere Access, Operational Efficiency *BLUEARC WILL HELP YOU MAKE THE MOVE. FIND OUT HOW*http://www.bluearcgroup.com/content.asp?z=6c=104p=494f=2 ** level 1, 11 albany street st leonards nsw 2065 *p:* 02 9467 2500 *d:* 02 9467 25 *f:* 02 9431 5999 *e:* [EMAIL PROTECTED] *w:* www.bluearcgroup.com *ARE YOU READY FOR NEXT GENERATION WEB TECHNOLOGY?* Leading the way in Web Content Management, *IgnitionSuite Version 3.0*prepares you for the future of the web. *To learn more call 9467 2500 or email [EMAIL PROTECTED][EMAIL PROTECTED] * *Privileged - Private Confidential* This email and files transmitted with it are intended solely for the use of the addressee(s) and may contain information which is confidential or privileged. If you are not the intended recipient, be aware that any disclosure, copying, distribution or use of this email or any attachment is prohibited. If you receive this email and you are not the addressee, or you have received this email in error, please disregard the contents of the email, delete the email and notify the author immediately. P Please consider the environment before printing this e-mail *** 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] ***image001.gif
RE: [WSG] Marking up multiple form inputs
Hi, I realise tables shouldn't be used for layouts. Doesn't this information suit a table structure though (tabular data)? If not what would you use? Cheers [cid:image001.gif@01C8CAF6.0206E130]http://www.bluearcgroup.com/ solutions for a digital world Exchange Server 2007 Built-in Protection, Anywhere Access, Operational Efficiency BLUEARC WILL HELP YOU MAKE THE MOVE. FIND OUT HOWhttp://www.bluearcgroup.com/content.asp?z=6c=104p=494f=2 level 1, 11 albany street st leonards nsw 2065 p: 02 9467 2500 d: 02 9467 25 f: 02 9431 5999 e: [EMAIL PROTECTED]mailto:[EMAIL PROTECTED] w: www.bluearcgroup.comhttp://www.bluearcgroup.com/ ARE YOU READY FOR NEXT GENERATION WEB TECHNOLOGY? Leading the way in Web Content Management, IgnitionSuite Version 3.0 prepares you for the future of the web. To learn more call 9467 2500 or email [EMAIL PROTECTED]mailto:[EMAIL PROTECTED] Privileged - Private Confidential This email and files transmitted with it are intended solely for the use of the addressee(s) and may contain information which is confidential or privileged. If you are not the intended recipient, be aware that any disclosure, copying, distribution or use of this email or any attachment is prohibited. If you receive this email and you are not the addressee, or you have received this email in error, please disregard the contents of the email, delete the email and notify the author immediately. P Please consider the environment before printing this e-mail From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Jason Ray Sent: Tuesday, 10 June 2008 12:22 PM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Marking up multiple form inputs Tables shouldn't be used for layouts, use style sheets instead, but they should be used for information which lends itself well to a table. If you are trying to display data in an organised format, which requires columns and rows, then use a table. Jason On Tue, Jun 10, 2008 at 11:37 AM, Chris Pearce [EMAIL PROTECTED]mailto:[EMAIL PROTECTED] wrote: Hi, Would the following layout be best marked up using a table: Column Header Column Header [label tag] [input tag] [input tag] [label tag] [input tag] [input tag] [label tag] [input tag] [input tag] Cheers [cid:image001.gif@01C8CAF6.0206E130]http://www.bluearcgroup.com/ solutions for a digital world Exchange Server 2007 Built-in Protection, Anywhere Access, Operational Efficiency BLUEARC WILL HELP YOU MAKE THE MOVE. FIND OUT HOWhttp://www.bluearcgroup.com/content.asp?z=6c=104p=494f=2 level 1, 11 albany street st leonards nsw 2065 p: 02 9467 2500 d: 02 9467 25 f: 02 9431 5999 e: [EMAIL PROTECTED]mailto:[EMAIL PROTECTED] w: www.bluearcgroup.comhttp://www.bluearcgroup.com/ ARE YOU READY FOR NEXT GENERATION WEB TECHNOLOGY? Leading the way in Web Content Management, IgnitionSuite Version 3.0 prepares you for the future of the web. To learn more call 9467 2500 or email [EMAIL PROTECTED]mailto:[EMAIL PROTECTED] Privileged - Private Confidential This email and files transmitted with it are intended solely for the use of the addressee(s) and may contain information which is confidential or privileged. If you are not the intended recipient, be aware that any disclosure, copying, distribution or use of this email or any attachment is prohibited. If you receive this email and you are not the addressee, or you have received this email in error, please disregard the contents of the email, delete the email and notify the author immediately. P Please consider the environment before printing this e-mail *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED]mailto:[EMAIL PROTECTED] *** *** 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] *** inline: image001.gif
Re: [WSG] Marking up multiple form inputs
As far as I can tell without knowing the specifics of the data, it looks like information that suits a table - just as you have displayed it. I was confused by your question starting with 'Would the following layout...' so I thought it was worth pointing out that layouts shouldn't be done using tables. Jason On Tue, Jun 10, 2008 at 12:32 PM, Chris Pearce [EMAIL PROTECTED] wrote: Hi, I realise tables shouldn't be used for layouts. Doesn't this information suit a table structure though (tabular data)? If not what would you use? Cheers [image: cid:image001.gif@01C7B8BB.D6C86180] http://www.bluearcgroup.com/ solutions for a digital world *Exchange Server 2007* Built-in Protection, Anywhere Access, Operational Efficiency *BLUEARC WILL HELP YOU MAKE THE MOVE. FIND OUT HOW*http://www.bluearcgroup.com/content.asp?z=6c=104p=494f=2 ** level 1, 11 albany street st leonards nsw 2065 *p:* 02 9467 2500 *d:* 02 9467 25 *f:* 02 9431 5999 *e:* [EMAIL PROTECTED] *w:* www.bluearcgroup.com *ARE YOU READY FOR NEXT GENERATION WEB TECHNOLOGY?* Leading the way in Web Content Management, *IgnitionSuite Version 3.0*prepares you for the future of the web. *To learn more call 9467 2500 or email [EMAIL PROTECTED][EMAIL PROTECTED] * *Privileged - Private Confidential* This email and files transmitted with it are intended solely for the use of the addressee(s) and may contain information which is confidential or privileged. If you are not the intended recipient, be aware that any disclosure, copying, distribution or use of this email or any attachment is prohibited. If you receive this email and you are not the addressee, or you have received this email in error, please disregard the contents of the email, delete the email and notify the author immediately. P Please consider the environment before printing this e-mail *From:* [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] *On Behalf Of *Jason Ray *Sent:* Tuesday, 10 June 2008 12:22 PM *To:* wsg@webstandardsgroup.org *Subject:* Re: [WSG] Marking up multiple form inputs Tables shouldn't be used for layouts, use style sheets instead, but they should be used for *information* which lends itself well to a table. If you are trying to display data in an organised format, which requires columns and rows, then use a table. Jason On Tue, Jun 10, 2008 at 11:37 AM, Chris Pearce [EMAIL PROTECTED] wrote: Hi, Would the following layout be best marked up using a table: *Column Header* *Column Header* [label tag] [input tag] [input tag] [label tag] [input tag] [input tag] [label tag] [input tag] [input tag] Cheers [image: cid:image001.gif@01C7B8BB.D6C86180] http://www.bluearcgroup.com/ solutions for a digital world *Exchange Server 2007* Built-in Protection, Anywhere Access, Operational Efficiency *BLUEARC WILL HELP YOU MAKE THE MOVE. FIND OUT HOW*http://www.bluearcgroup.com/content.asp?z=6c=104p=494f=2 level 1, 11 albany street st leonards nsw 2065 *p:* 02 9467 2500 *d:* 02 9467 25 *f:* 02 9431 5999 *e:* [EMAIL PROTECTED] *w:* www.bluearcgroup.com *ARE YOU READY FOR NEXT GENERATION WEB TECHNOLOGY?* Leading the way in Web Content Management, *IgnitionSuite Version 3.0*prepares you for the future of the web. *To learn more call 9467 2500 or email [EMAIL PROTECTED][EMAIL PROTECTED] * *Privileged - Private Confidential* This email and files transmitted with it are intended solely for the use of the addressee(s) and may contain information which is confidential or privileged. If you are not the intended recipient, be aware that any disclosure, copying, distribution or use of this email or any attachment is prohibited. If you receive this email and you are not the addressee, or you have received this email in error, please disregard the contents of the email, delete the email and notify the author immediately. P Please consider the environment before printing this e-mail *** 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] Help setting current menu state on level2 menus
Susie Gardner-Brown wrote:
But when the link has sub-menu items under it, all of those get the
same treatment! Because the styles are applied to the list item. Can
anyone think of a way to do this that would not affect the sub-menu?
http://crunchie.tedi.uq.edu.au/trials/UCTLC/stLucia.html
Add specificity to the selectors for sub-menu styles...
#lhnav #navcontainer li li a { ... }
#lhnav #navcontainer li li a:hover { ... }
...to make those styles override ACTIVE styles on first level.
BTW: font-resizing doesn't play well with that menu in any browser, and
IE/win's em font-resizing bug[1] doesn't help much either.
regards
Georg
[1]http://www.gunlaug.no/contents/wd_additions_13.html
--
http://www.gunlaug.no
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
[WSG] Should we design for 800x600 screens?
Hi, I have a question I'd like to poll people about. Should we still bother designing to fit in with 800x600 screen resolutions or is it Ok to just design for 1024x768 and not worry about smaller resolutions? I know applications like Google Desktop make it more complicated and am interested to hear people's views. IceKat PS- If this has been asked before I apologise and ask if it's possible to see mail archives to see the responses. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Should we design for 800x600 screens?
make it fluid and everyone will be happy :) doesn't matter if we have 300px or 1280px, your website should (ok, with some restrictions, like 800-1024) adapt to user's needs 2008/6/10 IceKat [EMAIL PROTECTED]: Hi, I have a question I'd like to poll people about. Should we still bother designing to fit in with 800x600 screen resolutions or is it Ok to just design for 1024x768 and not worry about smaller resolutions? I know applications like Google Desktop make it more complicated and am interested to hear people's views. IceKat PS- If this has been asked before I apologise and ask if it's possible to see mail archives to see the responses. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** -- []'s - Rochester Oliveira Web Designer Itajubá - MG - Brasil *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Should we design for 800x600 screens?
Rochester oliveira wrote: adapt to user's needs That is the key. If the users are technical you would not bother designing for 800 x 600 screens if the users are internal and they work on smaller screens, you would. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Should we design for 800x600 screens?
Depends on the targeted audience and what designer I work with. Sometimes we design for 800x600 while other times the designer we create for 1024 and we have no choice but to use those dimensions whether we like it or not. IceKat wrote: Hi, I have a question I'd like to poll people about. Should we still bother designing to fit in with 800x600 screen resolutions or is it Ok to just design for 1024x768 and not worry about smaller resolutions? I know applications like Google Desktop make it more complicated and am interested to hear people's views. IceKat PS- If this has been asked before I apologise and ask if it's possible to see mail archives to see the responses. *** 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] Help setting current menu state on level2 menus
Hi Georg
Thanks for that. I'll have a go. You always seem to help me - thank you so
much!!
Re the font-resizing - sigh!! For a lot of the websites we develop at the
university here, we're supposed to use this awful template, which includes
the lefthand menu like this. In the template it's all in tables!! I got the
way of doing this menu from http://demo.pixelsandpages.com/test_dual.html
and I thought it covered all problems!
I looked at your page about this. I already have the base body font size set
at 62.5%. Are you saying that if I add in html{ font-size: 100%;}
before that it will be OK?
Of course, I'm a Mac-user, who pretty much uses Firefox all the time. But I
do have XP and IE6 installed in Parallels so I check on that. But I guess
usually after I've developed in FF Mac ... :)
Thanks again
susie
On 10/6/08 1:18 PM, Gunlaug Sørtun [EMAIL PROTECTED] wrote:
Susie Gardner-Brown wrote:
But when the link has sub-menu items under it, all of those get the
same treatment! Because the styles are applied to the list item. Can
anyone think of a way to do this that would not affect the sub-menu?
http://crunchie.tedi.uq.edu.au/trials/UCTLC/stLucia.html
Add specificity to the selectors for sub-menu styles...
#lhnav #navcontainer li li a { ... }
#lhnav #navcontainer li li a:hover { ... }
...to make those styles override ACTIVE styles on first level.
BTW: font-resizing doesn't play well with that menu in any browser, and
IE/win's em font-resizing bug[1] doesn't help much either.
regards
Georg
[1]http://www.gunlaug.no/contents/wd_additions_13.html
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] Marking up multiple form inputs
sorry again, I can send you some samples if you wish s. On Tue, Jun 10, 2008 at 9:52 AM, sundar [EMAIL PROTECTED] wrote: Hi, Don't use table for this particular layout, keep the markup like label, input input Remove the table, put a fieldset around then apply float to label input and set width which matches your layout. Also I can't sent you some samples if you wish Thanks Sundar On Tue, Jun 10, 2008 at 7:07 AM, Chris Pearce [EMAIL PROTECTED] wrote: Hi, Would the following layout be best marked up using a table: *Column Header* *Column Header* [label tag] [input tag] [input tag] [label tag] [input tag] [input tag] [label tag] [input tag] [input tag] Cheers [image: cid:image001.gif@01C7B8BB.D6C86180]http://www.bluearcgroup.com/ solutions for a digital world *Exchange Server 2007* Built-in Protection, Anywhere Access, Operational Efficiency *BLUEARC WILL HELP YOU MAKE THE MOVE. FIND OUT HOW*http://www.bluearcgroup.com/content.asp?z=6c=104p=494f=2 ** level 1, 11 albany street st leonards nsw 2065 *p:* 02 9467 2500 *d:* 02 9467 25 *f:* 02 9431 5999 *e:* [EMAIL PROTECTED] *w:* www.bluearcgroup.com *ARE YOU READY FOR NEXT GENERATION WEB TECHNOLOGY?* Leading the way in Web Content Management, *IgnitionSuite Version 3.0*prepares you for the future of the web. *To learn more call 9467 2500 or email [EMAIL PROTECTED][EMAIL PROTECTED] * *Privileged - Private Confidential* This email and files transmitted with it are intended solely for the use of the addressee(s) and may contain information which is confidential or privileged. If you are not the intended recipient, be aware that any disclosure, copying, distribution or use of this email or any attachment is prohibited. If you receive this email and you are not the addressee, or you have received this email in error, please disregard the contents of the email, delete the email and notify the author immediately. P Please consider the environment before printing this e-mail *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** -- Sundar -- Sundar *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***image001.gif
Re: [WSG] Should we design for 800x600 screens?
Jermayn Parker wrote: If the users are technical you would not bother designing for 800 x 600 screens Hmmm? I wonder if that's strictly true, given the surge in ultralite notebooks like the ASUS EEEPC. My new one ( a 900 - c'mon NZCouriers, just deliver the thing!) will have 1024 as a default but my wife's 1st gen Linux one has a much smaller screen and (I think) has a max 800x600 res - I know a lot of geeks who've picked up one of these as a travelling tool because they're just that much easier to manage on a plane or in a briefcase. I was using Her one last night to check on some details about a program we were watching on TV and getting very frustrated at having to scroll sideways to see the sidebar on the right. Other small-form user devices will have similar issues. I think I used my Palm Tungsten PDA a whole 1 time to surf and then decided to use something else with a decent screen size. And then there's the people who have nice big screens but have reduced viewports because using the web is only part of what they do and they really need to see as much of that spreadsheet as they can if the users are internal and they work on smaller screens, you would. As someone else said, fluid design is the way to go, when you know you can't control every user's technology and/or preferences. And it'll work better in the future when the technology changes again. cheers mark *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Marking up multiple form inputs
Hi, Don't use table for this particular layout, keep the markup like label, input input Remove the table, put a fieldset around then apply float to label input and set width which matches your layout. Also I can't sent you some samples if you wish Thanks Sundar On Tue, Jun 10, 2008 at 7:07 AM, Chris Pearce [EMAIL PROTECTED] wrote: Hi, Would the following layout be best marked up using a table: *Column Header* *Column Header* [label tag] [input tag] [input tag] [label tag] [input tag] [input tag] [label tag] [input tag] [input tag] Cheers [image: cid:image001.gif@01C7B8BB.D6C86180] http://www.bluearcgroup.com/ solutions for a digital world *Exchange Server 2007* Built-in Protection, Anywhere Access, Operational Efficiency *BLUEARC WILL HELP YOU MAKE THE MOVE. FIND OUT HOW*http://www.bluearcgroup.com/content.asp?z=6c=104p=494f=2 ** level 1, 11 albany street st leonards nsw 2065 *p:* 02 9467 2500 *d:* 02 9467 25 *f:* 02 9431 5999 *e:* [EMAIL PROTECTED] *w:* www.bluearcgroup.com *ARE YOU READY FOR NEXT GENERATION WEB TECHNOLOGY?* Leading the way in Web Content Management, *IgnitionSuite Version 3.0*prepares you for the future of the web. *To learn more call 9467 2500 or email [EMAIL PROTECTED][EMAIL PROTECTED] * *Privileged - Private Confidential* This email and files transmitted with it are intended solely for the use of the addressee(s) and may contain information which is confidential or privileged. If you are not the intended recipient, be aware that any disclosure, copying, distribution or use of this email or any attachment is prohibited. If you receive this email and you are not the addressee, or you have received this email in error, please disregard the contents of the email, delete the email and notify the author immediately. P Please consider the environment before printing this e-mail *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** -- Sundar *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***image001.gif
Re: [WSG] Should we design for 800x600 screens?
It probably has been asked before - but the answer is likely to change with time (as monitor sizes vary or normalize) so the question is still as relevant as ever. If you were to ask the question to Jakob Nielson, he would say optimize for 1024x768 [1] and provide a liquid content area. But you really need to look at it from a few angles: - Your intended audience i.e. Intranet users most likely won't be viewing your site on their mobiles or Playstations. But users of a social networking site might. - Screen resolution data. i.e. If you expect 95% of your audience to be using 800x600 then there is a compelling reason to optimize for that adapt to user's needs I agree - adapt to user's needs. However, a liquid layout in my opinion does not always offer that. Liquid layouts are generally a good idea, but are not always perfect. For example, how do you create a liquid layout to cater for a mobile and a widescreen plasma? You might try something like Switchy McLayout found at A List Apart [2], but these different mediums really require tailored content. Adapting to the user's needs in this case means providing different content and maybe even a different interface. To clarify my position though - I would agree with Jakob Nielson in the general sense, keeping my audience in mind. But knowing your user's will give you more insight into what you _should_ do. -- Matt Fellows http://www.onegeek.com.au/ [1] - http://www.useit.com/alertbox/screen_resolution.html [2] - http://www.alistapart.com/articles/switchymclayout *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Help setting current menu state on level2 menus
-Original Message- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Susie Gardner-Brown Sent: Monday, June 09, 2008 6:45 PM To: wsg@webstandardsgroup.org Subject: [WSG] Help setting current menu state on level2 menus Hi there I've been using the 456bereastreet.com method ( http://www.456bereastreet.com/archive/200503/setting_the_current_menu_state_ with_css/) to set the current menu state using css. Which is really great when there is only one level of menu items ... But I'm now trying to use it with 2 levels of menus, that incorporate background images for bullets and different colour schemes for the 2nd level ... (sigh - blame the graphic designer!) It works fine on the first level - see http://crunchie.tedi.uq.edu.au/trials/UCTLC/contacts.html But when the link has sub-menu items under it, all of those get the same treatment! Because the styles are applied to the list item. Can anyone think of a way to do this that would not affect the sub-menu? I've tried applying the id to the 'a' tag but that did nothing! See http://crunchie.tedi.uq.edu.au/trials/UCTLC/stLucia.html I did have a script that did this, but it didn't include background images, or separate colours/styles for the sub-menu items. And my javascript skills do not extend that far I'm afraid! Any thoughts would be great. I have spent too much time on this already, and need to know if I'm just trying to do something that will never be possible, and so should start again! In case you want to automate the process using a script: http://divahtml.com/products/divaGPS/current_menu_location.php There is a free version for DW users -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Help setting current menu state on level2 menus
Susie Gardner-Brown wrote:
Re the font-resizing - sigh!! For a lot of the websites we develop at
the university here, we're supposed to use this awful template,
which includes the lefthand menu like this. In the template it's all
in tables!! I got the way of doing this menu from
http://demo.pixelsandpages.com/test_dual.html and I thought it
covered all problems!
For a menu in isolation, yes. When placed in your layout its 'em' sizes
creates more problems than it solves.
Once you start using 'em' for dimensions _one_ place, you'll have to
make sure _all_ elements play well together when subjected to font-resizing.
I already have the base body font size set at 62.5%. Are you saying
that if I add in html{ font-size: 100%;} before that it
will be OK?
If you check with the CSS validator you'll see that a big chunk of your
stylesheet disappears in a Parse Error - including the font-size on
body. Fix that part and you'll fix the em bug.
Of course: such a small font-size as 62.5% as base will make the effect
of 'minimum font size' in Firefox and Opera ruin the page...
http://www.gunlaug.no/contents/wd_1_03_04.html
Of course, I'm a Mac-user, who pretty much uses Firefox all the
time. But I do have XP and IE6 installed in Parallels so I check on
that. But I guess usually after I've developed in FF Mac ... :)
Cross-checking _during_ development will save you time - tons of it.
Testing with regular browser-option well beyond what normal users will
expose your work to, will save you from having to deal with
user-introduced problems later on.
regards
Georg
--
http://www.gunlaug.no
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
RE: [WSG] Structuring CSS
How are you guys structuring your CSS files? I am currently in the process of restructuring our CSS. The approach I'm looking into is as follows: 1) use Eric Meyer's reset CSS to create a common base 2) use Blueprint's grid.css for the grid layer 3) use a component CSS layer to a) give a basic styling (only margin, padding, height, width) to site-wide components b) give full styling to cross-network components (so they appear the same) 4) use separate directories for skin-based CSS (contains colours, typography, bg images, borders,... and self-contained image directory) Once in production, so the plan, we can combine and compress 1-3 into one file. I like to use heavy commenting in CSS files and later compress them. All CSS files should be properly indented and have section headings (ie. /* =Heading here */). I'm open to comments on this scheme. The more discussion the better the end product. Cheers, Jens The information contained in this e-mail message and any accompanying files is or may be confidential. If you are not the intended recipient, any use, dissemination, reliance, forwarding, printing or copying of this e-mail or any attached files is unauthorised. This e-mail is subject to copyright. No part of it should be reproduced, adapted or communicated without the written consent of the copyright owner. If you have received this e-mail in error please advise the sender immediately by return e-mail or telephone and delete all copies. Fairfax does not guarantee the accuracy or completeness of any information contained in this e-mail or attached files. Internet communications are not secure, therefore Fairfax does not accept legal responsibility for the contents of this message or attached files. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Structuring CSS
Hi, Why have I been CC on all emails? warm regards, NICK BELL - WEB MARKETING EXPERTS INTELLIGENT WEBMARKETING HYPERLINK http://www.webmarketingexperts.com.au/www.webmarketingexperts.com.au PH +61 3 9667 0150 FAX +61 3 9667 0134 MOB +61 420 244 738 “Getting your site on Google 1st page can turn a hobby into a million-dollar business.” CNN Money _ From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Jens-Uwe Korff Sent: Tuesday, 10 June 2008 12:04 PM To: wsg@webstandardsgroup.org Subject: RE: [WSG] Structuring CSS How are you guys structuring your CSS files? I am currently in the process of restructuring our CSS. The approach I'm looking into is as follows: 1) use Eric Meyer's reset CSS to create a common base 2) use Blueprint's grid.css for the grid layer 3) use a component CSS layer to a) give a basic styling (only margin, padding, height, width) to site-wide components b) give full styling to cross-network components (so they appear the same) 4) use separate directories for skin-based CSS (contains colours, typography, bg images, borders,... and self-contained image directory) Once in production, so the plan, we can combine and compress 1-3 into one file. I like to use heavy commenting in CSS files and later compress them. All CSS files should be properly indented and have section headings (ie. /* =Heading here */). I'm open to comments on this scheme. The more discussion the better the end product. Cheers, Jens _ The information contained in this e-mail message and any accompanying files is or may be confidential. If you are not the intended recipient, any use, dissemination, reliance, forwarding, printing or copying of this e-mail or any attached files is unauthorised. This e-mail is subject to copyright. No part of it should be reproduced, adapted or communicated without the written consent of the copyright owner. If you have received this e-mail in error please advise the sender immediately by return e-mail or telephone and delete all copies. Fairfax does not guarantee the accuracy or completeness of any information contained in this e-mail or attached files. Internet communications are not secure, therefore Fairfax does not accept legal responsibility for the contents of this message or attached files. _ *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** Internal Virus Database is out-of-date. Checked by AVG. Version: 7.5.524 / Virus Database: 269.23.16/1433 - Release Date: 14/05/2008 4:44 PM Internal Virus Database is out-of-date. Checked by AVG. Version: 7.5.524 / Virus Database: 269.23.16/1433 - Release Date: 14/05/2008 4:44 PM *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Structuring CSS
The way I structure my CSS is very much like you said - taking the Software Development principles of Object-Oriented programming, and is pretty much inline with what everyone else has said. I generally break my CSS up to the following categories: - reset.css : Reset all browser defaults. Gecko, WebKit and Explorer based browsers all have different presets (lists are just one example) so this is very cruicial in making the look and feel consistent. - skeleton.css : Defines my main architectual skeleton, i.e. will it be a three-column layout? a fluid layout? a fixed width layout? This essentially allows me to reuse the CSS very efficiently. I can also switch between layouts very quickly. After that I generally make a judge call on how complex the organisation is and how the CSS might or will be overriden. In a large and complex organisation, that generally consists of smaller individual business I generally split the CSS up even further into the following categories: - content.css - typogaphy.css - forms.css - tables.css I might even go further by splitting the positioning away from the colour. It really depends on how confident the people within each different business are with CSS. This generally allows many people; with varying degree of confidence and skill level to make small changes which might be necessary for their particular business/branch. In regards to I'm guessing this sort of structuring comes at a cost because a number of requests need to be made to the server. this is generally untrue. In principle this is exactly how download accelerators work. They split a large file into smaller segments and sent multiple requests. Since the browser environment is completely multi-threaded it should actually boost performance. (Note: I am not 100% certain if this is the fact, but there is no evidence to suggest otherwise either). In the end you should also generally use a bridge file to connect all the CSS together. Hope that answers your question. On Tue, Jun 10, 2008 at 9:00 AM, James Jeffery [EMAIL PROTECTED] wrote: Lets have it. How are you guys structuring your CSS files? I have been having a think about this over the last few days. My research attempts have failed because most the articles i came across were outdated - so i tend not to trust them. One method i thought about (not sure if it's been coined) is one based on Software Engineering principles, obeying rules such as decoupling et cetera. Maybe by using these principles modules can be included by importing the needed CSS file (and path) in the root CSS file. As i am writing this i am certain CMS systems use this method of structuring CSS. I am sick to death of having to over comment my CSS files to find what it is i'm looking for. I would much rather break up my layout into semantic chunks and create a seperate CSS file for each chunk (i.e navigation, content, footer). I'm guessing this sort of structuring comes at a cost because a number of requests need to be made to the server. Regards James Jeffery *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** -- - Anton Babushkin *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Should we design for 800x600 screens?
I would say Absolutely, absoutely and absolutely! My reasoning for this is simple: what about the rest of those users who *don't browse the internet with the browser in full screen*? As a matter of fact I'm doing it right now, so thank god GMail scales gracefully, or I probably wouldn't use it! I think the big question is how scalable your web page becomes beyond 800x600 and that all really depends on the kind of content your web site is providing. If its something which can be extremelly useful for a Google Desktop application then perhaps you need to take that into account. If not, then perhaps rethink your strategy/approach. Thats my two cents. On Tue, Jun 10, 2008 at 1:28 PM, IceKat [EMAIL PROTECTED] wrote: Hi, I have a question I'd like to poll people about. Should we still bother designing to fit in with 800x600 screen resolutions or is it Ok to just design for 1024x768 and not worry about smaller resolutions? I know applications like Google Desktop make it more complicated and am interested to hear people's views. IceKat PS- If this has been asked before I apologise and ask if it's possible to see mail archives to see the responses. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** -- - Anton Babushkin *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Structuring CSS
Anton wrote... - In regards to I'm guessing this sort of structuring comes at a cost because a number of requests need to be made to the server. this is generally untrue. In principle this is exactly how download accelerators work. They split a large file into smaller segments and sent multiple requests. Since the browser environment is completely multi-threaded it should actually boost performance. (Note: I am not 100% certain if this is the fact, but there is no evidence to suggest otherwise either). - If its a small site, with not much traffic I think you'd be hard pressed to notice the difference. For large news sites that get smashed with traffic, I've sat there with a stopwatch and timed the difference (over different speed connections from dialup to broadband) between separate css files, and all in 1. And just having 1 file is definitely faster. in some cases it would bring the initial [1] load time [2] from something like 6 seconds down to 3 or 4. and then bringing all the css into the head of the page rather than a linked file chopped another second off. as i said - only applicable if extreme performance/optimisation is an issue - but it *does* make a difference. [1] - with an empty cache [2] - the time taken for the page text to appear, the page might continue loading for 10 or so seconds after this so loading in pics etc. mileage varies pete *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Should we design for 800x600 screens?
By subject... Should we design for 800x600 screens Design for? Not necessarily. Accommodate? Yes. Cheers. Mike Cherim http://green-beast.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Should we design for 800x600 screens?
Please remove me from this email chat. warm regards, NICK BELL - WEB MARKETING EXPERTS INTELLIGENT WEBMARKETING HYPERLINK http://www.webmarketingexperts.com.au/www.webmarketingexperts.com.au PH +61 3 9667 0150 FAX +61 3 9667 0134 MOB +61 420 244 738 “Getting your site on Google 1st page can turn a hobby into a million-dollar business.” CNN Money _ From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Anton Babushkin Sent: Tuesday, 10 June 2008 12:39 PM To: wsg@webstandardsgroup.org Subject: Re: [WSG] Should we design for 800x600 screens? I would say Absolutely, absoutely and absolutely! My reasoning for this is simple: what about the rest of those users who don't browse the internet with the browser in full screen? As a matter of fact I'm doing it right now, so thank god GMail scales gracefully, or I probably wouldn't use it! I think the big question is how scalable your web page becomes beyond 800x600 and that all really depends on the kind of content your web site is providing. If its something which can be extremelly useful for a Google Desktop application then perhaps you need to take that into account. If not, then perhaps rethink your strategy/approach. Thats my two cents. On Tue, Jun 10, 2008 at 1:28 PM, IceKat HYPERLINK mailto:[EMAIL PROTECTED][EMAIL PROTECTED] wrote: Hi, I have a question I'd like to poll people about. Should we still bother designing to fit in with 800x600 screen resolutions or is it Ok to just design for 1024x768 and not worry about smaller resolutions? I know applications like Google Desktop make it more complicated and am interested to hear people's views. IceKat PS- If this has been asked before I apologise and ask if it's possible to see mail archives to see the responses. *** List Guidelines: HYPERLINK http://webstandardsgroup.org/mail/guidelines.cfm; \nhttp://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: HYPERLINK http://webstandardsgroup.org/join/unsubscribe.cfm; \nhttp://webstandardsgroup.org/join/unsubscribe.cfm Help: HYPERLINK mailto:[EMAIL PROTECTED] [EMAIL PROTECTED] *** -- - Anton Babushkin *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** Internal Virus Database is out-of-date. Checked by AVG. Version: 7.5.524 / Virus Database: 269.23.16/1433 - Release Date: 14/05/2008 4:44 PM Internal Virus Database is out-of-date. Checked by AVG. Version: 7.5.524 / Virus Database: 269.23.16/1433 - Release Date: 14/05/2008 4:44 PM *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
