Re: [WSG] Homepage Review: webnetdesignstudios.com
Thank you Lea. I removed the strong tag, and added the cite tag with a rule applied to the cite element that bolds the authors name. Seems to be the best of both worlds. Kind regards, Mario On Sun, 2 Oct 2005 22:58:19 -0400, Christian Montoya wrote: Isn't b still valid? If you want to have a weightless way of bolding the text, but don't want to mess with a span, use b . Yes, its 'valid', for low values of valid, but wrapping a cite element around the name screams 'this is who said it'; a b element tells you nothing. I just wish there were a way to link a cite and a q, the way we link labels and inputs. warmly, Lea -- Lea de Groot Elysian Systems - http://elysiansystems.com/ Brisbane, Australia ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Homepage Review: webnetdesignstudios.com
Michael,
I understand that the Internet is an electronic medium, and I#8217;m quite
aware of all the
browser nuances and additional devices employed to render websites. However,
what I said was that
the Internet is also a visual medium, which is an important aspect of site
design that must be
considered. Correct use of color, imagery, typography, links, etc are key
factors in creating a
quality site therefore to label the Internet as simply being an electronic
medium is overlooking
one of its most fundamental uses.
Furthermore, if there is a method that isn#8217;t widely supported then it
does become a personal
preference whether, or not I choose to use it in every instance. My courseware
states that
display: inline in IE5 is unsupported, however if that#8217;s untrue then
that#8217;s a relief,
but has nothing to do with me unlearning everything I thought was acceptable.
I agree with much of your input, and all the other members who were so gracious
enough to take
time to review the page, and provide their expert opinions. However, I'd be
remiss if I didn't
take exception to your closing remarks, which I interpreted as quite
condescending.
I#8217;ve been a designer for 8 years and a list member for 21 months. I
conduct courses is XHTML
and CSS at the local college, and take standards very seriously. I joined this
group for their
expert advice, and have always welcomed different opinions and points of view
in an effort to
enhance my knowledge and expertise. Normally, I#8217;d address this issue
off-line, but I think
it#8217;s important to express my opinion on this matter openly because there
are many beginners
to standards and the WSG who are reluctant to post questions for fear of being
chastised, or
criticized.
From my perspective I#8217;m only interested in learning about best practices
as it relates to
web standards. I think we should just stick to answering the questions, and
refrain from using a
patronizing tone, or making presumptuous inferences. Allow each member to
discern for themselves
the correct method to implement instead of being made to feel sub-standard.
I say this with all respect, and hope my input is received in the spirit it is
intended.
Respectfully yours,
Mario S. Cisneros
Hi,
I haven't followed this thread completely, but I wanted to comment on this
specific post
because some of your comments caught my eye and another view may come in
handy.
However, I think using strong to emphasize the author of the
testimonial is perfectly acceptable.
Because it's not going to bring about the total destruction of mankind, you
are more right than
not in the world of living and breathing, but in the world of standards,
it's not acceptable
and it's wrong. You might as well use a hn to ad visual emphasis. You are
attempting to
visually draw the readers eye to the name (e.g. bold), not necessarily add a
strong emphasis.
If it is visual, it presentation. If it's presentation, it's not structure.
To create a rule and use span tag is overkill.
I totally agree and, generally, I try not to use spans. Instead I mark up my
document in such a
way, limited as they are, the tags are as semantic as possible, while at the
same time, provide
me with hooks into my content without redundancy.
Someone (Josh I suppose) suggested that you use a span for the
testimonial, and while that is allot better (semantically speaking) than
what you are doing
now, it wouldn't have been my first choice. I would use a definition list
for this:
dl id=testimonial
dtJoe Coyle, President, www.coylemedical.com/dt
ddMr. Cisneros and his team have an extraordinary talent for customer
communication, market
vision, and web page design./dd
dl
And, if you absolutely have to have the commenter's name appear
*visually* beneath their comments, you could use the following (or similar)
CSS:
#testimonial * {
margin: 0;
padding: 0;
}
#testimonial {
width: 400px;
}
#testimonial dt {
margin-top: 80px;
}
#testimonial dd {
float: left;
margin-top: -80px;
}
Of course, you would have to tweak this (margins) per instance and it's not
thoroughly tested,
but should work OK in most browsers.
Additionally, the image is to provide a soft visual touch
There is also nothing stopping you from displaying the little person image
as a background on
your dt, but you certainly shouldn't be using an inline image as it is
purely presentational
and adds nothing to the content. If it were a photograph of the speaker, I
would use the image
within an additional dd.
Similarly the images in your header could be a replaced h1. There are
various methods
available to you; most have drawbacks, all are better than in a
non-semantic, inline image.
In terms of how you display an image on the page the rule is simple: If the
is content (as in
the speaker photograph in the above example), it
Re: [WSG] Homepage Review: webnetdesignstudios.com
Okay, most of the points I made still apply. 1) is out, because you've
ditched the JS menu. 2, 3, 4, 5 (less now) and 7 still apply. You've got
images where you could be using background images in a H4 for the
special offers section, and I'd lean towards doing part of your
testimonial bit differently. Perhaps:
p class=testimonialnamespanJoe Coyle,/span President/p and add
the rule
.testimonialname span {font-weight:bold}
to your CSS, instead of
pimg src=Images/Icons/comment.gif width=16 height=16
alt=Client Testimonial /strongJoe Coyle,/strong President/p
...because the name isn't really emphasised (which is what the strong
tag means), only styled differently, and the image has no semantic
weight (you've already said Client testimonial in the H2 immediately
above).
Text resizing isn't so bad, if you're prepared to accept your nav bar
breaking so quickly (it only scales one step up in Firefox here).
Only other suggestion I've got is to perhaps stick the Plans starting
at $24.95/month server graphic as part of a link background, instead of
just as an image... and, if you _do_ want to retain the image, change
the alt text to something more meaningful than web servers -- Plans
starting at $24.95/month would do nicely.
Regards,
Josh
On Sun, 2005-10-02 at 00:21 -0500, [EMAIL PROTECTED]
wrote:
Josh,
My sincere apologies!!
I failed to provide the URL to the development environment for the redesign:
http://www.webnetdesignstudios.com/index1.htm
This is my current site, and one of the reasons I've decided to implement a
re-design.
Sorry for the miscommunication.
Kind regards,
Mario
A few suggestions, in order of markup.
1) The JS menus are okay, if everything listed in them is accessible some
other way.
2) Your non-JavaScript link list (topnavbar) should be a list. And the
bullet images would be
better as background images or
list-style-image's.
3) Instead of having an image for your header, consider having a H1 that
says WebNet Design
Studios: A Progressive Web Design and Development Group and use an
image-replacement technique.
As the page title, this should carry greater semantic weight than it does
at present, which is
why I'd lean towards a H1 rather than a semantically neutral div with an
img inside.
4) If you change that to be a H1, then (this one is open to conjecture) I
think all the other
H1s on your page should become H2, etc.
5) Currently, your H1s have images inside them. Setting padding-left and a
background-image
would be a better alternative here. Use id or class to differentiate the
images between headers,
if this is what you need (at the minute, it looks like that's what your
design aims for).
6) You have a table that's semantically inappropriate under the Consumer
Shop heading
(summary=Consumer Shop id=table) -- these links should, again, be an
unordered list. To make
them use the space more
effectively, you can float them to make their appearance emulate a table.
With fluid layouts,
this has the added benefit of making
columns appear to appear and disappear as the layout scales -- though
this isn't a concern
here. You can also set a background image for list items instead of
including the img tag at
the start of each.
7) Finally, your footer should also be a list. I would use an image
replacement technique here
again, possibly putting your copyright
statement in a separate list to enable correct positioning (if you need
to... it's possible not
to, but might be easier that way).
AND -- this one is important -- text resizing (up) breaks immediately
because you've set the
heights of #integration, #consumer, #special, #starter, #site and #quote in
pixels. Unsetting
all of these doesn't particularly break anything, though when resizing the
length of the columns
relative to one another does fluctuate somewhat (I'm only
testing in Firefox, here). You can fix this by putting your #clear div
INSIDE the #wrapper div,
so that #wrapper extends as far as it has to, continuing the white
background all the way down
(I think... I've never been completely on top of that whole clearing thing,
so I'm not 100% sure
that'll work... the theory runs something like that, though. Play around.)
HTH,
Josh
Kind Regards,
Joshua Street
base10solutions
Website:
http://www.base10solutions.com.au/
Phone: (02) 9898-0060 Fax: (02)
8572-6021
Mobile: 0425 808 469
Multimedia Development Agency
E-mails and any
attachments sent from base10solutions are to be regarded as confidential.
Please do not
distribute or publish any of the contents of this e-mail without the
senderâ#8364;#8482;s
consent. If you
have received this e-mail in error, please notify the sender by replying to
the e-mail, and then
delete the
Re: [WSG] Homepage Review: webnetdesignstudios.com
Hi Josh,
I appreciate your input, and I concur with some of your points, and will apply
the changes
accordingly. However, I think using strong to emphasize the author of the
testimonial is
perfectly acceptable. To create a rule and use span tag is overkill.
Additionally, the image is
to provide a soft visual touch, I realize the importance of clean, well-written
code and content,
but the Internet is also a visual medium.
I don't agree that every horizontal navbar should be in a list especially since
display:inline
isn't supported in IE5, but that's a personal preference.
Again, I thank you for your advice, and as always I continue to learn more
about standards design
by being a part of this list!
Respectfully yours,
Mario
Okay, most of the points I made still apply. 1) is out, because you've
ditched the JS menu. 2,
3, 4, 5 (less now) and 7 still apply. You've got images where you could be
using background
images in a H4 for the
special offers section, and I'd lean towards doing part of your
testimonial bit differently. Perhaps:
p class=testimonialnamespanJoe Coyle,/span President/p and add the
rule
.testimonialname span {font-weight:bold}
to your CSS, instead of
pimg src=Images/Icons/comment.gif width=16 height=16
alt=Client Testimonial /strongJoe Coyle,/strong President/p
...because the name isn't really emphasised (which is what the strong tag
means), only styled
differently, and the image has no semantic weight (you've already said
Client testimonial in
the H2 immediately above).
Text resizing isn't so bad, if you're prepared to accept your nav bar
breaking so quickly (it
only scales one step up in Firefox here).
Only other suggestion I've got is to perhaps stick the Plans starting at
$24.95/month server
graphic as part of a link background, instead of just as an image... and, if
you _do_ want to
retain the image, change the alt text to something more meaningful than web
servers -- Plans
starting at $24.95/month would do nicely.
Regards,
Josh
On Sun, 2005-10-02 at 00:21 -0500, [EMAIL PROTECTED] wrote:
Josh,
My sincere apologies!!
I failed to provide the URL to the development environment for the redesign:
http://www.webnetdesignstudios.com/index1.htm
This is my current site, and one of the reasons I've decided to implement a
re-design.
Sorry for the miscommunication.
Kind regards,
Mario
A few suggestions, in order of markup.
1) The JS menus are okay, if everything listed in them is accessible some
other way.
2) Your non-JavaScript link list (topnavbar) should be a list. And the
bullet images would
be better as background images or
list-style-image's.
3) Instead of having an image for your header, consider having a H1 that
says WebNet Design
Studios: A Progressive Web Design and Development Group and use an
image-replacement
technique. As the page title, this should carry greater semantic weight than
it does at
present, which is why I'd lean towards a H1 rather than a semantically
neutral div with an
img inside.
4) If you change that to be a H1, then (this one is open to conjecture) I
think all the
other H1s on your page should become H2, etc.
5) Currently, your H1s have images inside them. Setting padding-left and a
background-image
would be a better alternative here. Use id or class to differentiate the
images between
headers, if this is what you need (at the minute, it looks like that's what
your design aims
for).
6) You have a table that's semantically inappropriate under the Consumer
Shop heading
(summary=Consumer Shop id=table) -- these links should, again, be an
unordered list. To
make them use the space more
effectively, you can float them to make their appearance emulate a table.
With fluid
layouts, this has the added benefit of making
columns appear to appear and disappear as the layout scales -- though
this isn't a concern
here. You can also set a background image for list items instead of
including the img tag
at the start of each.
7) Finally, your footer should also be a list. I would use an image
replacement technique
here again, possibly putting your copyright
statement in a separate list to enable correct positioning (if you need
to... it's possible
not to, but might be easier that way).
AND -- this one is important -- text resizing (up) breaks immediately
because you've set the
heights of #integration, #consumer, #special, #starter, #site and #quote in
pixels.
Unsetting all of these doesn't particularly break anything, though when
resizing the length
of the columns relative to one another does fluctuate somewhat (I'm only
testing in Firefox, here). You can fix this by putting your #clear div
INSIDE the #wrapper
div, so that #wrapper extends as far as it has to, continuing the white
background all the
way down (I think... I've never been completely on top of that whole
clearing thing,
Re: [WSG] Homepage Review: webnetdesignstudios.com
On Sun, 2005-10-02 at 12:22 -0500, [EMAIL PROTECTED] wrote: I appreciate your input, and I concur with some of your points, and will apply the changes accordingly. However, I think using strong to emphasize the author of the testimonial is perfectly acceptable. To create a rule and use span tag is overkill. Additionally, the image is to provide a soft visual touch, I realize the importance of clean, well-written code and content, but the Internet is also a visual medium. The Internet _is_ a visual medium, but, certainly in this instance, the visual element isn't content. (Cases where visual-only elements would be are photo galleries and sparkline graphics, et al.) This is a field in which absolutes are hard to find, but I personally think in this case your visual elements don't contribute to the _content_ of your site, but rather the presentation. This applies to both that server graphic and to the strong thing (though the latter is more debatable). If you want to _emphasise_ the author, then strong is correct. To me, that doesn't look as though it's something you would stress if you spoke it, so I'd use a child selector and span tag as per my suggestion. It seems to me to be a design decision, rather than a semantic one. But maybe not. I don't agree that every horizontal navbar should be in a list especially since display:inline isn't supported in IE5, but that's a personal preference. I wasn't aware this was an issue: http://www.richinstyle.com/bugs/ie5b.html#display would suggest that it's not. http://wellstyled.com/singlelang.php?lang=enpage=css-inline-blocks.html has some more that looks related... it looks achievable, but I haven't got IE5 here to test. Kind Regards, Joshua Street base10solutions Website: http://www.base10solutions.com.au/ Phone: (02) 9898-0060 Fax: (02) 8572-6021 Mobile: 0425 808 469 Multimedia Development Agency E-mails and any attachments sent from base10solutions are to be regarded as confidential. Please do not distribute or publish any of the contents of this e-mail without the sender’s consent. If you have received this e-mail in error, please notify the sender by replying to the e-mail, and then delete the message without making copies or using it in any way. Although base10solutions takes precautions to ensure that e-mail sent from our accounts are free of viruses, we encourage recipients to undertake their own virus scan on each e-mail before opening, as base10solutions accepts no responsibility for loss or damage caused by the contents of this e-mail. ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Homepage Review: webnetdesignstudios.com
Hi,
I haven't followed this thread completely, but I wanted to comment on
this specific post because some of your comments caught my eye and
another view may come in handy.
However, I think using strong to emphasize the author of the
testimonial is perfectly acceptable.
Because it's not going to bring about the total destruction of mankind,
you are more right than not in the world of living and breathing, but in
the world of standards, it's not acceptable and it's wrong. You might as
well use a hn to ad visual emphasis. You are attempting to visually
draw the readers eye to the name (e.g. bold), not necessarily add a
strong emphasis. If it is visual, it presentation. If it's presentation,
it's not structure.
To create a rule and use span tag is overkill.
I totally agree and, generally, I try not to use spans. Instead I mark
up my document in such a way, limited as they are, the tags are as
semantic as possible, while at the same time, provide me with hooks into
my content without redundancy.
Someone (Josh I suppose) suggested that you use a span for the
testimonial, and while that is allot better (semantically speaking) than
what you are doing now, it wouldn't have been my first choice. I would
use a definition list for this:
dl id=testimonial
dtJoe Coyle, President, www.coylemedical.com/dt
ddMr. Cisneros and his team have an extraordinary talent for customer
communication, market vision, and web page design./dd
dl
And, if you absolutely have to have the commenter's name appear
*visually* beneath their comments, you could use the following (or
similar) CSS:
#testimonial * {
margin: 0;
padding: 0;
}
#testimonial {
width: 400px;
}
#testimonial dt {
margin-top: 80px;
}
#testimonial dd {
float: left;
margin-top: -80px;
}
Of course, you would have to tweak this (margins) per instance and it's
not thoroughly tested, but should work OK in most browsers.
Additionally, the image is to provide a soft visual touch
There is also nothing stopping you from displaying the little person
image as a background on your dt, but you certainly shouldn't be using
an inline image as it is purely presentational and adds nothing to the
content. If it were a photograph of the speaker, I would use the image
within an additional dd.
Similarly the images in your header could be a replaced h1. There are
various methods available to you; most have drawbacks, all are better
than in a non-semantic, inline image.
In terms of how you display an image on the page the rule is simple: If
the is content (as in the speaker photograph in the above example), it
should be in the markup; otherwise, it should not.
I realize the importance of clean, well-written code and content,
but the Internet is also a visual medium.
Ahh, but it is not a visual medium. It is an electronic medium, of
which, some clients such as Web browsers like Firefox and Internet
Explorer can display visual presentation. Not all clients can do so
(screen readers for example) and users can force those that can, to not.
Paper is a visual medium. You can control all of it down to the glossy
UV coating, font size, image placement, and texture. You cannot control
my browser:
CSS off, images, off, font size increased:
http://961media.com/__temp/webnetdesignstudios-1.png
Images off, font size increased:
http://961media.com/__temp/webnetdesignstudios-2.png
I don't agree that every horizontal navbar should be in a list
especially since display:inline isn't supported in IE5, but that's a
personal preference.
There is really no such thing as personal preference when you are
dealing with a standard of any kind. There is the standard and then
there is all the other stuff; follow it or don't. There is allot of gray
in the standard of course, but a list is a list and how IE 5 deals with
your preferred CSS is not a deciding factor.
All of this aside, IE 5 handles horizontal navs derived from lists just
fine:
http://web-graphics.com/mtarchive/inline-mini-tabs.html
Most of the advice you will receive here is very sound and if you want
to learn more about standards design, you'd be wise to heed it. It is
difficult at times, but it's worth it. The first step, though, is
unlearning everything you though was acceptable.
--
Best regards,
M. Wilson
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
RE: [WSG] Homepage Review: webnetdesignstudios.com
dl id=testimonial dtJoe Coyle, President, www.coylemedical.com/dt ddMr. Cisneros and his team have an extraordinary talent for customer communication, market vision, and web page design./dd dl feel free to bite my head off - I haven't been following this thread closely. There seems to be a tendency lately to use definition lists for way more than I think they're supposed to be used for. In the above example, is this (semantically) equivalent to saying that the definition of 'Joe Coyle, President, www' is 'Mr. Cisneros and his team have an extraordinary talent for customer communication, market vision, and web page design'? Obviously untrue, but I'm open to 'enlightenment' ;) Paul ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Homepage Review: webnetdesignstudios.com
On 3/10/2005, at 2:28 PM, Paul Bennett wrote: There seems to be a tendency lately to use definition lists for way more than I think they're supposed to be used for. As someone who was at WE05, Tantek mentioned that using DL, DT and DD for anything other than definition lists is abuse!: http://tantek.com/presentations/2005/09/elements-of-xhtml/ - It is on slide 33. -- Cheers, Brett Taylor 3months.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Homepage Review: webnetdesignstudios.com
Since the testimonial is basically a quote, why not use the q element?
Then use the presidents name within the cite element. This way it is
semantic, and you still get to style the presidents name any way that you
feel fit!
Cheers
Nathan
- Original Message -
From: Michael Wilson [EMAIL PROTECTED]
To: wsg@webstandardsgroup.org
Sent: Monday, October 03, 2005 11:14 AM
Subject: Re: [WSG] Homepage Review: webnetdesignstudios.com
Hi,
I haven't followed this thread completely, but I wanted to comment on this
specific post because some of your comments caught my eye and another view
may come in handy.
However, I think using strong to emphasize the author of the
testimonial is perfectly acceptable.
Because it's not going to bring about the total destruction of mankind,
you are more right than not in the world of living and breathing, but in
the world of standards, it's not acceptable and it's wrong. You might as
well use a hn to ad visual emphasis. You are attempting to visually draw
the readers eye to the name (e.g. bold), not necessarily add a strong
emphasis. If it is visual, it presentation. If it's presentation, it's not
structure.
To create a rule and use span tag is overkill.
I totally agree and, generally, I try not to use spans. Instead I mark up
my document in such a way, limited as they are, the tags are as semantic
as possible, while at the same time, provide me with hooks into my content
without redundancy.
Someone (Josh I suppose) suggested that you use a span for the
testimonial, and while that is allot better (semantically speaking) than
what you are doing now, it wouldn't have been my first choice. I would use
a definition list for this:
dl id=testimonial
dtJoe Coyle, President, www.coylemedical.com/dt
ddMr. Cisneros and his team have an extraordinary talent for customer
communication, market vision, and web page design./dd
dl
And, if you absolutely have to have the commenter's name appear *visually*
beneath their comments, you could use the following (or similar) CSS:
#testimonial * {
margin: 0;
padding: 0;
}
#testimonial {
width: 400px;
}
#testimonial dt {
margin-top: 80px;
}
#testimonial dd {
float: left;
margin-top: -80px;
}
Of course, you would have to tweak this (margins) per instance and it's
not thoroughly tested, but should work OK in most browsers.
Additionally, the image is to provide a soft visual touch
There is also nothing stopping you from displaying the little person
image as a background on your dt, but you certainly shouldn't be using
an inline image as it is purely presentational and adds nothing to the
content. If it were a photograph of the speaker, I would use the image
within an additional dd.
Similarly the images in your header could be a replaced h1. There are
various methods available to you; most have drawbacks, all are better than
in a non-semantic, inline image.
In terms of how you display an image on the page the rule is simple: If
the is content (as in the speaker photograph in the above example), it
should be in the markup; otherwise, it should not.
I realize the importance of clean, well-written code and content,
but the Internet is also a visual medium.
Ahh, but it is not a visual medium. It is an electronic medium, of which,
some clients such as Web browsers like Firefox and Internet Explorer can
display visual presentation. Not all clients can do so (screen readers for
example) and users can force those that can, to not. Paper is a visual
medium. You can control all of it down to the glossy UV coating, font
size, image placement, and texture. You cannot control my browser:
CSS off, images, off, font size increased:
http://961media.com/__temp/webnetdesignstudios-1.png
Images off, font size increased:
http://961media.com/__temp/webnetdesignstudios-2.png
I don't agree that every horizontal navbar should be in a list
especially since display:inline isn't supported in IE5, but that's a
personal preference.
There is really no such thing as personal preference when you are dealing
with a standard of any kind. There is the standard and then there is all
the other stuff; follow it or don't. There is allot of gray in the
standard of course, but a list is a list and how IE 5 deals with your
preferred CSS is not a deciding factor.
All of this aside, IE 5 handles horizontal navs derived from lists just
fine:
http://web-graphics.com/mtarchive/inline-mini-tabs.html
Most of the advice you will receive here is very sound and if you want to
learn more about standards design, you'd be wise to heed it. It is
difficult at times, but it's worth it. The first step, though, is
unlearning everything you though was acceptable.
--
Best regards,
M. Wilson
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
Re: [WSG] Homepage Review: webnetdesignstudios.com
On Mon, 2005-10-03 at 12:00 +1000, [EMAIL PROTECTED] wrote:
Since the testimonial is basically a quote, why not use the q element?
Then use the presidents name within the cite element. This way it is
semantic, and you still get to style the presidents name any way that you
feel fit!
Cheers
Nathan
The example everyone is getting excited about isn't actually the right
site... the first email Mario sent had an incorrect URL.
The amended version (see subject: [WSG] HomePage Review: Corrected
URL) lists
http://www.webnetdesignstudios.com/index1.htm as the correct address.
A quick recap of (this aspect of) the thread follows.
This page displays the testimonial in the form:
pimg src=Images/Icons/comment.gif width=16 height=16
alt=Client Testimonial /strongJoe Coyle,/strong President/p
With the testimonial itself in the proceeding paragraph.
I suggested that use of strong was inappropriate, as you don't really
emphasis the name, it's purely for the visual differentiation of the
name and title (so I understand it, anyway).
p class=testimonialnamespanJoe Coyle,/span President/p and add
the rule
.testimonialname span {font-weight:bold}
Would be, in my thinking, a more semantic alternative (that is, a
semantically neutral alternative with no presentational markup).
Argument about overkill and pedanticism followed. ;-)
Josh Street
base10solutions
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
Re: [WSG] Homepage Review: webnetdesignstudios.com
On Mon, 03 Oct 2005 12:23:50 +1000, Joshua Street wrote:
p class=testimonialnamespanJoe Coyle,/span President/p and add
the rule
.testimonialname span {font-weight:bold}
I would give strong consideration to:
p class=testimonialnameciteJoe Coyle,/cite President/p
.testimonialname cite {font-weight:bold}
and think about working a q element into the actual quote-paragraph.
Lea
--
Lea de Groot
Elysian Systems - http://elysiansystems.com/
Brisbane, Australia
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
Re: [WSG] Homepage Review: webnetdesignstudios.com
Isn't b still valid? If you want to have a weightless way of bolding the text, but don't want to mess with a span, use b . On 10/2/05,
Lea de Groot [EMAIL PROTECTED] wrote:
On Mon, 03 Oct 2005 12:23:50 +1000, Joshua Street wrote: p class=testimonialnamespanJoe Coyle,/span President/p and add the rule .testimonialname span {font-weight:bold}
I would give strong consideration to:p class=testimonialnameciteJoe Coyle,/cite President/p .testimonialname cite {font-weight:bold}and think about working a q element into the actual quote-paragraph.
Lea--Lea de GrootElysian Systems - http://elysiansystems.com/Brisbane, Australia**The discussion list for
http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help
**-- - C Montoyardpdesign.com ...
liquid.rdpdesign.com ... montoya.rdpdesign.com
Use of cite WAS: Re: [WSG] Homepage Review: webnetdesignstudios.com
On Mon, 2005-10-03 at 12:39 +1000, Lea de Groot wrote:
I would give strong consideration to:
p class=testimonialnameciteJoe Coyle,/cite President/p
.testimonialname cite {font-weight:bold}
and think about working a q element into the actual quote-paragraph.
This immediately seems to make sense, but I'm left wondering one thing.
With forms, we are encouraged to make use of the for attribute on label
elements, in order to make the relationship between elements clear. Can
a similar practise apply to cite and q? With blockquote elements we have
the cite attribute, but that is different again and can only be used for
href data.
So... is there any way to define this relationship? Or is it just
order-of-content and hoping it makes sense? What if you were to put the
cite after the quote for whatever reason (style guide convention, etc)?
Kind Regards,
Joshua Street
base10solutions
Website:
http://www.base10solutions.com.au/
Phone: (02) 9898-0060 Fax: (02)
8572-6021
Mobile: 0425 808 469
Multimedia Development Agency
E-mails and any attachments sent from base10solutions are to be regarded
as confidential. Please do not distribute or publish any of the contents
of this e-mail without the sender’s consent. If you have received this
e-mail in error, please notify the sender by replying to the e-mail, and
then delete the message without making copies or using it in any way.
Although base10solutions takes precautions to ensure that e-mail sent
from our accounts are free of viruses, we encourage recipients to
undertake their own virus scan on each e-mail before opening, as
base10solutions accepts no responsibility for loss or damage caused by
the contents of this e-mail.
**
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list getting help
**
Re: [WSG] Homepage Review: webnetdesignstudios.com
On Sun, 2005-10-02 at 22:58 -0400, Christian Montoya wrote: Isn't b still valid? If you want to have a weightless way of bolding the text, but don't want to mess with a span, use b . Yes. It's in the presentation module for XHTML 1.1 ( http://www.w3.org/TR/xhtml-modularization/abstract_modules.html#s_presentationmodule ). -- - C Montoya rdpdesign.com ... liquid.rdpdesign.com ... montoya.rdpdesign.com ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Homepage Review: webnetdesignstudios.com
On Sun, 2 Oct 2005 22:58:19 -0400, Christian Montoya wrote: Isn't b still valid? If you want to have a weightless way of bolding the text, but don't want to mess with a span, use b . Yes, its 'valid', for low values of valid, but wrapping a cite element around the name screams 'this is who said it'; a b element tells you nothing. I just wish there were a way to link a cite and a q, the way we link labels and inputs. warmly, Lea -- Lea de Groot Elysian Systems - http://elysiansystems.com/ Brisbane, Australia ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Homepage Review: webnetdesignstudios.com
Paul Bennett wrote: dl id=testimonial dtJoe Coyle, President, www.coylemedical.com/dt ddMr. Cisneros and his team have an extraordinary talent for customer communication, market vision, and web pageb design./dd dl There seems to be a tendency lately to use definition lists for way more than I think they're supposed to be used for. I've found a couple of descriptions of what a definition list is supposed to be: http://www.w3.org/TR/REC-html40/struct/lists.html#h-10.3 Definition lists vary only slightly from other types of lists in that list items consist of two parts: a term and a description. The term is given by the DT element and is restricted to inline content. The description is given with a DD element that contains block-level content. and http://www.w3.org/TR/html4/struct/lists.html Definition lists, created using the DL element, generally consist of a series of term/definition pairs (although definition lists may have other applications). Thus, when advertising a product, one might use a definition list: I think the some of the confusion stems from the naming and the description of the list type and the list items. In the first example the spec states: list items consist of two parts: a term and a description In the second: (list items) generally consist of a series of term/definition pairs The second description continues with: although definition lists may have other applications What are these other applications? The spec doesn't specifically state, but it does offer the following as an examples: Another application of DL, for example, is for marking up dialogues, with each DT naming a speaker, and each DD containing his or her words. and when advertising a product, one might use a definition list That is a vague and somewhat conflicting guide. The list type is dubbed definition, but at almost every turn, the specification leans more toward the idea of description. Defining a term and describing a term are completely separate concepts at the core, but the lines do blur a bit. If definition lists would have been called description lists, having the exact same specifications, we wouldn't be having this debate and the world would be a happy place. In the above example, is this (semantically) equivalent to saying that the definition of 'Joe Coyle, President, www' In the example I gave, I was following the speaker-dialog path--describing what the speaker said. The content is obviously more accurately described as a quote than a dialog, but that can easily be worked into the dd to add even more semantic meaning. The bottom line is that we have to work with what we have been given, which is not allot, so do the best you can. -- Best regards, M. Wilson ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: Use of cite WAS: Re: [WSG] Homepage Review: webnetdesignstudios.com
On 10/3/05, Joshua Street [EMAIL PROTECTED] wrote: So... is there any way to define this relationship? Or is it just order-of-content and hoping it makes sense? What if you were to put the cite after the quote for whatever reason (style guide convention, etc)? Sorry Josh, there's no attribute for either element to represent such a relationship. The q element can contain the cite attribute though, if the original source has a URI. Reference Cite: http://www.w3.org/TR/html401/struct/text.html#edef-CITE Q: http://www.w3.org/TR/html401/struct/text.html#edef-Q cheers, Andrew. --- http://leftjustified.net/
Re: [WSG] Homepage Review: webnetdesignstudios.com
A few suggestions, in order of markup. 1) The JS menus are okay, if everything listed in them is accessible some other way. 2) Your non-JavaScript link list (topnavbar) should be a list. And the bullet images would be better as background images or list-style-image's. 3) Instead of having an image for your header, consider having a H1 that says WebNet Design Studios: A Progressive Web Design and Development Group and use an image-replacement technique. As the page title, this should carry greater semantic weight than it does at present, which is why I'd lean towards a H1 rather than a semantically neutral div with an img inside. 4) If you change that to be a H1, then (this one is open to conjecture) I think all the other H1s on your page should become H2, etc. 5) Currently, your H1s have images inside them. Setting padding-left and a background-image would be a better alternative here. Use id or class to differentiate the images between headers, if this is what you need (at the minute, it looks like that's what your design aims for). 6) You have a table that's semantically inappropriate under the Consumer Shop heading (summary=Consumer Shop id=table) -- these links should, again, be an unordered list. To make them use the space more effectively, you can float them to make their appearance emulate a table. With fluid layouts, this has the added benefit of making columns appear to appear and disappear as the layout scales -- though this isn't a concern here. You can also set a background image for list items instead of including the img tag at the start of each. 7) Finally, your footer should also be a list. I would use an image replacement technique here again, possibly putting your copyright statement in a separate list to enable correct positioning (if you need to... it's possible not to, but might be easier that way). AND -- this one is important -- text resizing (up) breaks immediately because you've set the heights of #integration, #consumer, #special, #starter, #site and #quote in pixels. Unsetting all of these doesn't particularly break anything, though when resizing the length of the columns relative to one another does fluctuate somewhat (I'm only testing in Firefox, here). You can fix this by putting your #clear div INSIDE the #wrapper div, so that #wrapper extends as far as it has to, continuing the white background all the way down (I think... I've never been completely on top of that whole clearing thing, so I'm not 100% sure that'll work... the theory runs something like that, though. Play around.) HTH, Josh Kind Regards, Joshua Street base10solutions Website: http://www.base10solutions.com.au/ Phone: (02) 9898-0060 Fax: (02) 8572-6021 Mobile: 0425 808 469 Multimedia Development Agency E-mails and any attachments sent from base10solutions are to be regarded as confidential. Please do not distribute or publish any of the contents of this e-mail without the sender’s consent. If you have received this e-mail in error, please notify the sender by replying to the e-mail, and then delete the message without making copies or using it in any way. Although base10solutions takes precautions to ensure that e-mail sent from our accounts are free of viruses, we encourage recipients to undertake their own virus scan on each e-mail before opening, as base10solutions accepts no responsibility for loss or damage caused by the contents of this e-mail. ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
Re: [WSG] Homepage Review: webnetdesignstudios.com
Josh, My sincere apologies!! I failed to provide the URL to the development environment for the redesign: http://www.webnetdesignstudios.com/index1.htm This is my current site, and one of the reasons I've decided to implement a re-design. Sorry for the miscommunication. Kind regards, Mario A few suggestions, in order of markup. 1) The JS menus are okay, if everything listed in them is accessible some other way. 2) Your non-JavaScript link list (topnavbar) should be a list. And the bullet images would be better as background images or list-style-image's. 3) Instead of having an image for your header, consider having a H1 that says WebNet Design Studios: A Progressive Web Design and Development Group and use an image-replacement technique. As the page title, this should carry greater semantic weight than it does at present, which is why I'd lean towards a H1 rather than a semantically neutral div with an img inside. 4) If you change that to be a H1, then (this one is open to conjecture) I think all the other H1s on your page should become H2, etc. 5) Currently, your H1s have images inside them. Setting padding-left and a background-image would be a better alternative here. Use id or class to differentiate the images between headers, if this is what you need (at the minute, it looks like that's what your design aims for). 6) You have a table that's semantically inappropriate under the Consumer Shop heading (summary=Consumer Shop id=table) -- these links should, again, be an unordered list. To make them use the space more effectively, you can float them to make their appearance emulate a table. With fluid layouts, this has the added benefit of making columns appear to appear and disappear as the layout scales -- though this isn't a concern here. You can also set a background image for list items instead of including the img tag at the start of each. 7) Finally, your footer should also be a list. I would use an image replacement technique here again, possibly putting your copyright statement in a separate list to enable correct positioning (if you need to... it's possible not to, but might be easier that way). AND -- this one is important -- text resizing (up) breaks immediately because you've set the heights of #integration, #consumer, #special, #starter, #site and #quote in pixels. Unsetting all of these doesn't particularly break anything, though when resizing the length of the columns relative to one another does fluctuate somewhat (I'm only testing in Firefox, here). You can fix this by putting your #clear div INSIDE the #wrapper div, so that #wrapper extends as far as it has to, continuing the white background all the way down (I think... I've never been completely on top of that whole clearing thing, so I'm not 100% sure that'll work... the theory runs something like that, though. Play around.) HTH, Josh Kind Regards, Joshua Street base10solutions Website: http://www.base10solutions.com.au/ Phone: (02) 9898-0060 Fax: (02) 8572-6021 Mobile: 0425 808 469 Multimedia Development Agency E-mails and any attachments sent from base10solutions are to be regarded as confidential. Please do not distribute or publish any of the contents of this e-mail without the senderâ#8364;#8482;s consent. If you have received this e-mail in error, please notify the sender by replying to the e-mail, and then delete the message without making copies or using it in any way. Although base10solutions takes precautions to ensure that e-mail sent from our accounts are free of viruses, we encourage recipients to undertake their own virus scan on each e-mail before opening, as base10solutions accepts no responsibility for loss or damage caused by the contents of this e-mail. ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help ** ** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list getting help **
