I started the html course. It shows how to add an image. I’m also doing it also along side a book that mentions adding captions to images using and . The thing is, the image is maybe half an inch to the right side of everything else. I haven’t learned any css yet but I am just curious why add a new features (html5) and have it look like crap by default by being not aligned?
Also not a fan of strong and em. Just get rid of b, i, strong, and em all together because from what I’ve been seeing, all people are doing is replacing b wth strong to say it’s html5.
<img src="images/quokka.png" alt="A quokka" title="Similar in size to a cat." width="620" height="349"/>
<p>A quokka <abbr title="also known as">aka</abbr> the worlds happiest animal is making a come back.</p>
<img src="images/quokka.png" alt="A quokka" title="Similar in size to a cat." width="620" height="349" />
A quokka <abbr title="also known as">aka</abbr> the worlds happiest animal is making a come back.</p>
By default the figure element has a margin of 1em on the left and right and 40px on the top and bottom. This is why it is not aligning with the rest of your content. Why it is these values by default I do not know.
Solid Statement: Section roots break out sections of a document into their own separate outlines. They are ‘root’ objects that have no ancestors. According to the W3C, the only HTML5 elements that are section roots are body, blockquote, fieldset, figure, and td. These elements can have their own outlines, but the sections and headings inside these elements do not contribute to the outlines of their ancestors.
Here is the W3C recommended default style sheet for HTML 4 (does not include figure), if we look at another sectioning root element, namely the <blockquote>, we can see it has (more or less) the same styles as the <figure> element.
There you have it, it basically has the same style as a blockquote, presumably because it belongs to this group of section root elements, and the blockquote element is the one it has the most in common with.
The <strong> and <em> elements carry semantic meaning, <b> and <i> do not. They are in fact not interchangeable (should not be used as such).
The <strong> and <em> elements are not HTML 5 elements, although the meaning of <strong> was redefined
However, assuming that one day the defaults will change if they haven’t already, and there will be advanced users who already change the defaults, the tags have value to screen readers. How else can emphasis on text be universally coded? Wrapping text in a span and applying style that way so that it is bold or italic takes more characters, you have to define the style yourself, AND there will be no global naming consistency. It’s far easier to just use the existing tags for the purpose they’re intended. i and b for purely visual decoration and em and strong for emphasis.