[html5] Markup feedback: Articles on a "section front" page & a list of bloggers...

[Micky Hulse]

Hi Brian! Thank you so much for your reply, I really appreciate it. :)

Just to clarify, and sorry if I was not clear before, both of the
examples I posted are for "modules" that will appear in a much larger
page of various pieces of different types of content. :)

On Mon, Jun 11, 2012 at 10:17 AM, Brian Tremblay
<webmaster at tsmchughs.com> wrote:
> On 6/10/12 5:24 PM, Micky Hulse wrote:
>> "HTML5: Marking-up a list of bloggers."
>> <https://gist.github.com/2907817>
> First, your page header. You don't need <header> markup.
> The sub heading is redundant. All you need is "Bloggers at site.com", in
> which case you can use
> and lose the <group> markup. Or add a real sub heading
> <hgroup>
> <h1>Bloggers at site.com</h1>
> <h2>answering questions that weren't worth asking</h2> <!-- or some such
> thing -->
> </hgroup>

Thanks for tips!

Sorry about the redundant subheading. I should have made that more
clear... This is just a "pseudo" example, and I was trying to keep
things concise; I plan on including a more unique subheading for the
real thing; for this example I did not want to go into those types of
specifics. Sorry about the confusion. :(

> <a href="#" itemprop="url">
> What sort of url is that? If each blogger doesn't have her or his own page,
> how about a real fragment id?

Hehe, again, sorry for the confusion. I plan on linking to the actual
blogger's blog index pages for the real thing... I was just trying to
keep my example free of clutter.

> Third, your alt text is bogus. Alt text is a *replacement* for the image,
> not a description of it. Since the name appears in the page anyways, next to
> or below the image, the alt attribute should be empty: alt=""

Oh, good point! I was wondering about that. That must be a bad habit of mine. :(

I plan on having portrait/mugshots of each blogger for the images;
just out of curiosity, let's say the name was not next to the image...
What would you suggest the ALT text be?

> Finally, if this is an html5 example (is it?), why not use some of the new,
> semantic, markup instead of the generic <div>?
> FWIW, I think figure is more appropriate here.

Awesome, thanks for tips!

You're totally right, a <figure> appears to work way better! Check out
the latest version:

<https://gist.github.com/2907817>

... for those interested in comparing, the old version is here:

<https://gist.github.com/2907817/e212ef7c170fd304e51a72a3d5c910604d0d5140>

Thanks for kicking me in the right direction! :)

> What is the point of this example, anyways?

Besides wanting to hone my HTML5 skills? :D

I'm in the process of building an HTML5/CSS3/adaptive site for the
company that I work for (a newspaper) and, before I start building the
HTML for the templates, I wanted to run some of my ideas past the
HTML5 gurus (like you).

I hope this list is the right place for these types of questions? I'm
not new to HTML, but I am new to HTML5 (relatively speaking)... If
anyone can recommend a better list for me to ask markup questions,
then I'll gladly go there instead of bothering ya'll. :)

Thanks again for your pro help Brian, I really appreciate it.

Have a nice day.

Cheers,
Micky

P.S. to the group:

I am still interested in feedback on this one:

"HTML5: Marking-up a list of "today's" stories for a mock "section front" page."
<https://gist.github.com/2907776>

... that's just mock/pseudo code, so sorry in advance if my attempts
at keep the code lean causes any confusion. Please let me know if I
can clarify anything.