Associating Text With Images Using CSS Absolute Positioning
Associating Text With Images
Using CSS Absolute Positioning — by Ian Cook
Retail product pages are faced with the challenge of displaying images that exhibit the product alongside relevant text that search engines can associate with the actual product image being described. One of the best ways to meet this challenge involves Absolute Positioning using Cascading Style Sheets (CSS).
|
Such a page layout technique allows us to position elements on a web page based on pixel coordinates instead of the linear order of a page's source code. And, in terms of optimizing pages for search engines, this can be an extremely powerful tool. That's because absolute positioning allows us to control precisely the linear order in which elements (body text, images, headline tags, etc.) are presented within our HTML code.
If this sounds confusing, just view the source code on this example to see how we have reversed the visual layout of the page relative to the page's source code.
As that example shows, the order of the page elements may render differently in a browser than the order in which they are defined within our source code. Generally speaking,...