Top Site Template Rejection Aspects [Authors, read!]

Hey guys, while reviewing there are certain trends that reviewers begin seeing. It depends on each individual category but I wanted to take a few minutes to point out some of the trends I see the most in the Site Templates category.

These are a few of the reasons templates are most frequently rejected.

1. Poor Typography

   (see: http://blog.themeforest.net/resources/10-typography-tips-for-web-designers/ )
• Paragraph line-height (leading). Typical paragraph text is 12px. A line-height of 2em (24px) is generally much too large and is harder to read. Generally, a line-height of 1.3-1.6em (depending on font size and usage) is most appropriate. The line-height of your typography will affect your template’s aesthetics and I will reject your template if your typographic styles need improvements. A great resource on this: http://webtypography.net/Rhythm_and_Proportion/Vertical_Motion/2.2.2/
  
• Visual Hierarchy. This seems to be a topic many designers know very little of, yet it is one of the most important aspects of a design. See point #4 in the link above (typography tips). I recommend designers research this topic and spend time refining your skills in this area. It will dramatically help your template aesthetics.
  
• Text Alignment. Though I don’t generally reject templates specifically for text alignment, if it seriously contributes to poor aesthetics, I will. Justified alignment on the web should be used appropriately, though I often see it misused.
  

2. Validation

   There is absolutely no reason your template should have unnecessary validation errors. HTML5 and CSS3 “errors” will not count against your template. If there is a specific, justifiable reason for an error, that is fine. Otherwise, CHECK FOR ERRORS BEFORE SUBMITTING !!! <- Yes, I’m yelling this because I reject for errors all the time.
   

3. Poor Code

   • Poor list code. I don’t know why but many authors do not put footer navigations in a list; this is wrong. Have a series of links that are related? Put them in a list. Have a series of images that are related (slideshow, advertisements, social media icons)? Put them in a list. Series of related elements should be placed in a list to be more semantic.
     
   • List separators. Do not separate list items (like text links) with individual list items containing only the ”|” character. Individual list items should not be used for purely styling purposes. I don’t even think using ”|” characters for link separations should be accepted, but that would be a little overly strict. If you can style it with CSS , you should not use HTML to accomplish it.
     

These are some of the simplest aspects of a template, but a few of the most common problems I see. Hopefully by pointing these out it will help some of our new authors.

Nice job Jarel… should be sticky-ed under Item Discussion after it’s run it’s course under the main forum…

Q: The validation exceptions you mentioned, would one be for embedded video from sites like Youtube and such? I find it’s often impossible to Validate with a Youtube video embeded… are there any other common problem Validations that you guys let slide?

Thanks for the info, Jarel.

Q: The validation exceptions you mentioned, would one be for embedded video from sites like Youtube and such? I find it’s often impossible to Validate with a Youtube video embeded… are there any other common problem Validations that you guys let slide?

A: Yes, YouTube embeds are an exception. Other exceptions would be Google Maps embed code, etc. If there’s a good reason as to why something doesn’t validate, it’ll usually be fine. Another thing I would let through is the appropriate use of noscript in the head section of a template.

Thanks for such a great post Jarel.

@Luckikind I know that you mentioned Youtube just to say an example, but I think you can make the Youtube code valid with:

<object type="application/x-shockwave-flash" height="350" data="http://www.youtube.com/v/mwc0wQt-L1Q" width="425">
<param name="movie" value="http://www.youtube.com/v/mwc0wQt-L1Q" />
<param name="wmode" value="transparent" />
</object>

Just for quick clarification, although you can make YouTube code validate (as Ivor showed), I don’t require it. The code provided by YouTube is fine for an author’s purpose.

Thanks for the extra info Ivor!

@Jarel – Thx.. good to know to try on those things, but not to beat ones head in over them

@Ivor – I think you’re right… All the extra vars are what what usually kills validation… so thx

thanks jr for this post.

And never forget to keep your template at its best C.R.A.P.

thanks jarel for that post and this thread.

and could you explain the difference between these two quotations: