W3C home > Mailing lists > Public > www-style@w3.org > October 2011

RE: [css3-images] simplifying radial gradients

From: Brian Manthos <brianman@microsoft.com>
Date: Thu, 13 Oct 2011 17:25:04 +0000
To: Brad Kemper <brad.kemper@gmail.com>, Tab Atkins Jr. <jackalmage@gmail.com>
CC: "L. David Baron" <dbaron@dbaron.org>, Sylvain Galineau <sylvaing@microsoft.com>, Alan Gresley <alan@css-class.com>, "www-style@w3.org" <www-style@w3.org>
Message-ID: <9710FCC2E88860489239BE0308AC5D17F08416@TK5EX14MBXC266.redmond.corp.microsoft.com>
It's a new day, so I'll try again...

Use case:
1. Web author makes or inherits a webpage with a gradient in a PNG or BMP file.
2. Web author's site owner wants to improve performance / load on the server.
3. Web author tries to replace url(gradientrasterized.png) with radial-gradient(...).
RESULT: Works only if the radial gradient is centered.

That's a failure case.  IMO, it's completely irrelevant whether it's background-image, list-style-image, border-image, generated content, or fancy-CSS-feature-from-the-future.

As the WD stands, anything consuming radial gradients in url-based form today will have a drop in replacement for each occurrence of url(gradientrasterized.png) without any additional changes to their CSS or HTML.  In many cases, it will be the *same* radial-gradient(...) syntax across all those occurrences but that's a secondary priority.

To my knowledge, all proposals subsequent to the 2011/09/08 WD do not meet that criteria.

SVG via data URI (cumbersome) and inline SVG (HTML5 only?) are alternatives, but (as some have expressed) not as desirable for other reasons.

> -----Original Message-----
> From: Brad Kemper [mailto:brad.kemper@gmail.com]
> Sent: Thursday, October 13, 2011 9:54 AM
> To: Tab Atkins Jr.
> Cc: Brian Manthos; L. David Baron; Sylvain Galineau; Alan Gresley; www-
> style@w3.org
> Subject: Re: [css3-images] simplifying radial gradients
> I said 'linear' when I really meant 'radial' there. Maybe that's why I
> don't understand your answer.
> On Oct 12, 2011, at 2:27 PM, "Tab Atkins Jr." <jackalmage@gmail.com>
> wrote:
> > On Wed, Oct 12, 2011 at 1:43 PM, Brad Kemper <brad.kemper@gmail.com>
> wrote:
> >> I don't see how. I am giving 'linear-gradient()' equal standing to
> 'url()'. CSS does not include ways for BMP/JPG/PNG images to be
> cropped, moved, and sized within 'url()', So why does radial-gradient
> have to have ghat?
> >
> > Linear gradients have the advantage that, no matter what size and
> > position you choose for the gradient-line, you can construct a
> > gradient with identical appearance that has the gradient-line defined
> > as the draft does (centered in the box, with endpoints placed in a
> > particular way).  Radials don't have that.
> >
> > ~TJ
Received on Thursday, 13 October 2011 17:25:43 UTC

This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:05 UTC