Sometime around 21/7/08 (at 06:31 -0400) Roger Burton said:
I am right in thinking that when I bring in, say, a JPG and add a
border and a drop shadow I need to turn it into a PNG / millions of
colours to enable to transpareny of the shadow
In short: yes.
To elaborate, it doesn’t matter what kind of image format you
import, Freeway will produce a web-ready graphic as part of the
output process. It will generate a fresh JPEG or GIF (or PNG if you
specify that output format) from the image data that’s in your
graphic box on the page.
So - important point here - it is best NOT to use JPEGs as your
original image data if you can help it. You DON’T need to produce
web-optimised JPEG graphics first, and the output from Freeway will
be recompressed from scratch - compounding any loss already present
from the pre-Freeway compression process.
Now, back to your query: Freeway lets you arrange your images as
flat, unlayered items (table-based layout) or as layered DIVs
(CSS-based layout).
Table-based graphics can merge with each other when overlapped, and
even generate their own background colour from the page background.
This makes things such as translucent shadows work very well on
non-white page backgrounds.
CSS-based graphics are far more independent; they aren’t in flat,
unlayered contact with anything else, so they don’t try to merge
their pixels with other items - or generate new background content
from what’s underneath. This means soft shadows are NOT generated
with the right pixel colour flooded in to fake the transparency
effect.
The way to get a visual translucency effect working with CSS/layered
graphics is either:
-
Group them with something that provides the right underlying
visual content, or
-
set the items in question to be generated as PNG graphics at
millions of colours.
Option (1) produces a merged graphic that fakes the transparency
effect, but still places the final output graphic within the
CSS-positioned DIV. As long as the final item always sits over the
right background colour or image, the effect remains convincing.
Option (2) generates an image that really does include true 8-bit
transparency, so it will show soft, variable-opacity shadows that
work whatever content lies beneath. However, the file size of this
kind of graphic is larger than a standard JPEG. It also requires a
kind of hack to make Internet Explorer 6 or 7 to show the
transparency properly, but that’s automatically done for you if you
use this option and don’t specifically disable it.
k
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
