Vanilla 1 is no longer supported or maintained. If you need a copy, you can get it here.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.
Vanilla's CSS/XHTML
Just jotting down some things I notice as I notice them with editing CSS..
<div class="CommentIcon" style="background-image:url('http://forums.hackwow.com/uploads/AccountPictures/4cd353e1b3bee4df59c3db62a3252b22.jpg');"> </div>
Why isn't this an <img /> tag? Is it to make sure the image size stays exact? If so why bother with the ?
<li><span>CommentAuthor</span><a href="http://forums.sourcepeek.com/account/1/">zeeg</a></li>
<li><span>CommentTime</span>Aug 5th 2006 <em>edited</em></li></ul>
Why is this a list? Why not a definition list if nothing else?
HideComment('/ajax/switch.php', '1', '53', '225', 'Are you sure you wish to undelete this comment?', 'Are you sure you wish to delete this comment?', 'HideComment225'); return false;"
This is repeated quite a bit, might be better to store the text inside the function, or in a variable.
<fieldset>
<legend>Add your comments</legend><form id="frmPostComment" method="post" action="http://forums.sourcepeek.com/post/"><input type="hidden" name="CommentID" value="0" />
Yell at me if I'm wrong, but I think <form> goes outside of <fieldset> :)
<input type="submit" name="btnSave" value="Add your comments" class="Button SubmitButton AddCommentsButton" onclick="Wait(this, 'Wait');" /> </div>
<a id="pgbottom" name="pgbottom"> </a>
What's with the 's there?
There are multiple (many) H1's on each page. In my humble opinion, and from my experiences, it is best to only use a single h1 describing exactly what that page is, then h2 for the major headers/keywords, h3 for bylines/subheadings, and that's usually as far as I go.
Yes I'm nitpicking, but they're just basic ideas as I love how well Vanilla has kept up w/ standards :)
Hope some of this helps!
0
This discussion has been closed.
Comments
2. There really isn't any perfect markup system for this sort of thing; you're going to be making compromises and stretching the meanings of semantic tags any way you slice it. There were a bunch of definition lists in the old theme, which on closer scrutiny turned out to have no semantic purpose at all, so they got cut.
3. I have no idea what you're asking. (EDIT: Oh, I get it) The non-breaking spaces are added to empty elements (I believe) so they show up in IE. I haven't really looked at the text formatter to see if it is escaping HTML character entities, but I suspect that it is not.
4. That is more of a guideline than anything. On a properly-structured page, the rank of a header is redundant (this is why h1-h6 are deprecated in XHTML 2.0) I do agree that it would be nice to have some more consistency there, but it's at best a minor issue.
In current html, you might write something like this:
<body> <h1>Page Title</h1> <p>content</p> <div> <h2>Post 1 Title</h2> <p>content</p> </div> <div> <h2>Post 2 Title</h2> <p>content</p> <div> <h3>Comment 1 Title</h3> <p>content</p> </div> </div> <div> <h2>Post 3 Title</h2> <p>content</p> </div> </body>But in XHTML 2.0, you can write this:
<body> <h>Page Title</h> <p>content</p> <section> <h>Post 1 Title</h> <p>content</p> </section> <section> <h>Post 2 Title</h> <p>content</p> <section> <h>Comment 1 Title</h> <p>content</p> </section> </section> <section> <h>Post 3 Title</h> <p>content</p> </section> </body>This has several benefits. First, it allows you to mark up document fragments properly, even if you don't know where in the document tree they are going to fit. Second, it supports more than six levels of nesting (this is admittedly pretty useless for most people, but nice to have when you need it). Finally, it provides a nice, single, semantic way to structure web pages, which will hopefully speed up the demise of RSS feeds.