Is it better to use a Graphic Item or an HTML Item background image for smaller, mini box images? What are the advantages/disadvantages to each method?
It depends on what you’re trying to accomplish. What are “mini box images”?
Todd
Is it better to use a Graphic Item or an HTML Item background image for smaller, mini box images? What are the advantages/disadvantages to each method?
If the images have value beyond pure decoration then perhaps use them as images . The benefit being the alt tag which is useful for screen readers, Google etc. It offers a bit more semantic meaning to the stew. That said, background images can benefit from an image replacement technique where you can still use text to describe the image, similar to an alt tag, but without the formal semantic structure and value of an alt tag. I suppose in the end makes more semantic sense but both options have their place.
The best way to gauge semantic value is in the absence of CSS styling. If
the loss of it doesn’t impact the overall message, then it is likely
decoration. If images are illustrative, then my opinion is they are part of
what I at least consider to be semantic content. Todd makes the appropriate
case for alt and title tags to reinforce this notion… I would go a little
further and include captioned images, and images which are clearly
editorial in content (though if they are, they should have captions).
That said, I don’t think those images are crucial elements of the story…
I’d classify them as decorative. That doesn’t mean that you must apply
them through CSS, just that I think you don’t face any penalty if you do.
–
Ernie Simpson
On Thu, May 2, 2013 at 9:09 PM, RavenManiac email@hidden wrote:
As long as you are talking about absolute positioned constructions (drop and drag) I tend to recommend “graphic items” cause you can easily overlay them by further stuff (fig-captions etc).
But if you talk about inline-constructions, a graphic-item is what I would call “the-last-in-the-line”. Not really correctly explained but a div is a block-level item, that allows you to insert further content while a graphic-item is a block-level item which doesn’t allow this naturally.
So transferred this into the “FWP BoxModel Version6”, the parent items “section”, “area” and “module” need further content, so those HTML-items require an image (decoration) of “background” while the “objects” (which could be an editorial, excerpt or even gallery …) in fact would be decorated or built by graphic-items.
Summary:
If you don’t plan to add a fig-caption to the box1 and box2 images, I tend to recommend using graphic-items. It would even allow you to add further functions (if necessary) such as lightbox, zoom or whatever. It even reduces the often discussed flood of divs (“Divitis” however I don’t care about this aspect)