Welcome to the MacNN Forums.

Developer · Oct 29, 2003, 03:32 PM

Drop shadows!

You will need Safari 1.1 to read the article.

http://www.mediaworkers.de/text-align/index.html

mitchell_pgh · Oct 29, 2003, 04:19 PM

interesting, but ugly...

dillerX · Oct 29, 2003, 04:25 PM

Philz bless CSS.

dr. zoidberg · Oct 29, 2003, 04:25 PM

heh, that's pretty wicked stuff!

cool.

Mithras · Oct 29, 2003, 04:42 PM

Size of the example HTML + the example CSS = 1969 bytes.

Size of the image to produce the same effect = 16,428 bytes.

Savings: 88%

That's why HTML+CSS is so cool... it's simplicity and bandwidth compression, rolled into one...

Developer · Oct 29, 2003, 05:37 PM

Originally posted by mitchell_pgh:
interesting, but ugly...

Drop shadows on text can look good. And they are a common reason to embed text as image. That is not necessary any more.

Obvious advantages are that text stays resizable, can be copied, can be spoken etc.

Mithras · 06:45 PM

this example is pretty cool

Compare to the version without CSS2 shadow support

redJag · Oct 29, 2003, 06:27 PM

I can see how that feature is kick ass, but the first example given is very difficult to read. They used it in inappropriate ways. The second one with the quote is not bad. It just looks bad on small text, though.

redJag · Oct 29, 2003, 06:32 PM

edit: sorry, it said it timed out after 60 seconds so I re-submitted, but apparently it actually went through before.

RooneyX · Oct 29, 2003, 06:34 PM

This is splendid. Every Mac using web designer should use this stuff. Then those Windows geezers will be tempted to use Safari. Which means they'll have to switch to a better, easier and more secure platform.

Misanthrope · Oct 29, 2003, 06:46 PM

Originally posted by RooneyX:
This is splendid. Every Mac using web designer should use this stuff. Then those Windows geezers will be tempted to use Safari. Which means they'll have to switch to a better, easier and more secure platform.

Just for a web browser? I think you're being a little over-optimistic...

Big Mac · Oct 29, 2003, 07:21 PM

Yeah, I have to agree with the previous poster, no Windows user will ever be tempted enough by Safari to switch. One must always remember that Windows users put up with the abomination known as Win 3.1 for many, many years, and they thought it was good!

RooneyX · Oct 29, 2003, 07:25 PM

Originally posted by Misanthrope:
Just for a web browser? I think you're being a little over-optimistic...

Anything, man, anything will do. The heathens...

Socially Awkward Solo · Oct 29, 2003, 09:52 PM

Yarg, looks terribly, wish I could turn this off.

gorickey · Oct 29, 2003, 09:58 PM

Where's v1.1 for Jag?

CheesePuff · Oct 29, 2003, 10:06 PM

Originally posted by gorickey:
Where's v1.1 for Jag?

in Pan.

gorickey · Oct 29, 2003, 10:09 PM

Originally posted by CheesePuff:
in Pan.

Better not be...

MindFad · Oct 29, 2003, 10:39 PM

Originally posted by Socially Awkward Solo:
Yarg, looks terribly, wish I could turn this off.

Tell us about it.

Anyway, I think it looks cool. Adds some nice possibilities, and to be able to cut back on graphics for particular types of text will be awesome. Simple drop shadow text as graphics may be a thing of the past.

wataru · Oct 29, 2003, 10:51 PM

No way, man, blinking text is where it's at.

ZackS · Oct 30, 2003, 12:08 AM

Ow, my freakin' eyes!

IT BURNS US!!

nobitacu · Oct 30, 2003, 12:19 AM

Very nice looking text.

Ming

madmacgames · Oct 30, 2003, 12:32 AM

Originally posted by gorickey:
Where's v1.1 for Jag?

As a webdesigner, I certainly hope Apple releases V1.1 for Jaguar.

DVD Plaza · Oct 30, 2003, 12:53 AM

I swear I used to do shadows using Internet Explorer 5 for Windows...

Correction, I KNOW I did - here's the code:

filter:shadow(color=#808080,strength=5)

Gee4orce · Oct 30, 2003, 02:56 AM

Originally posted by Socially Awkward Solo:
Yarg, looks terribly, wish I could turn this off.

But that's the cool thing - because it's a stylesheet you could override it with your own personal stylesheet, and change the effects to your heart's content.

CSS is fantastic. It's the future of the web.

dillerX · Oct 30, 2003, 05:36 AM

Originally posted by Gee4orce:
But that's the cool thing - because it's a stylesheet you could override it with your own personal stylesheet, and change the effects to your heart's content.

CSS is fantastic. It's the future of the web.

Speak the word brotha!

Mithras · Oct 30, 2003, 09:28 AM

Originally posted by DVD Plaza:
I swear I used to do shadows using Internet Explorer 5 for Windows...

Correction, I KNOW I did - here's the code:

filter:shadow(color=#808080,strength=5)

Right, but that's explicitly an IE/Windows exclusive. Whereas CSS shadows are a standard that all browsers aim to support.* So that's what's cool about this, rather than just the effect.

* or should

KidRed · Oct 30, 2003, 10:21 AM

Originally posted by Mithras:
this example is pretty cool

Compare to the version without CSS2 shadow support

That is very cool for html.

Oneota · Oct 30, 2003, 11:33 AM

It ain't just Safari, though - I'm using the latest Camino build and I'm seeing the shadows 'n everything, too.

Developer · Oct 30, 2003, 11:47 AM

Originally posted by Oneota:
It ain't just Safari, though - I'm using the latest Camino build and I'm seeing the shadows 'n everything, too.

That's impossible. Safari is the only browser to support this.

Nyuni · Oct 30, 2003, 01:30 PM

[EDIT: Apparently I'm seeing things.. I thought it was working okay in Camino 0.7, but on a second and third try I don't get the shadows any longer.. strange. So it doesn't seem like Camino supports it.. at least not fully or in a consistent manner.]

stew · Oct 30, 2003, 01:42 PM

That would actually a reason for me to not use Safari 1.1 - this sounds like something I don't even want to have in my web browser. If I wrote a browser, it would also ignore the blink tag and it wouldn't play animated gifs. The web would be a lot less annoying that way.

Love Calm Quiet · Oct 30, 2003, 02:14 PM

You mean you wouldn't miss the flashing ads at MacNN?

Developer · Oct 30, 2003, 02:44 PM

Originally posted by stew:
That would actually a reason for me to not use Safari 1.1 - this sounds like something I don't even want to have in my web browser

So you prefer it when web authors create drop shadows by embedding text as images? How is that better?

Mike S. · Oct 30, 2003, 10:04 PM

Originally posted by Mithras:
Right, but that's explicitly an IE/Windows exclusive. Whereas CSS shadows are a standard that all browsers aim to support.* So that's what's cool about this, rather than just the effect.

* or should

If this only works in Safari then it sounds to me like a proprietary CSS extension done by Apple.

Why doesn't the latest Mozilla handle this stuff? Are you saying Apple is ahead of the game in supporting the CSS spec? (at least this particular part)

For the record, Firebird 0.7.1 does not display the shadows, just white and black text on a dark background.

Mithras · Oct 30, 2003, 10:35 PM

Originally posted by Mike S.:

Why doesn't the latest Mozilla handle this stuff? Are you saying Apple is ahead of the game in supporting the CSS spec? (at least this particular part)

Yes.
Considering that Dave Hyatt used to work on Mozilla's Gecko engine (example), and now is the main architect of Safari, it's not too surprising that Safari should be a leader in standards-compliance.

Read Hyatt's Safari blog sometime -- the guy is obsessed with eeking out the correct behavior from HTML+CSS.

eevyl · Oct 31, 2003, 03:43 AM

Originally posted by Mike S.:
If this only works in Safari then it sounds to me like a proprietary CSS extension done by Apple.

Why doesn't the latest Mozilla handle this stuff? Are you saying Apple is ahead of the game in supporting the CSS spec? (at least this particular part)

Yes, Apple is ahead of the game in this. I suspect it is directly related to the new shadows you can use in any font under Panther. The Font team for Panther implemented the shadow thingie, and Hyatt maybe saw that work and said 'Hey with this it is easy to implement that tricky text shadow CSS property', and he did.

I do not know if such a technology exists in Windows XP or Linux (text shadows rendered by the OS), so maybe it is not as easy to implement in cross-platform browsers like Mozilla or Opera.

Millennium · Oct 31, 2003, 08:10 AM

Originally posted by Mike S.:
If this only works in Safari then it sounds to me like a proprietary CSS extension done by Apple.

It's been in the standards since the beginning of CSS 2.0. However, no one had implemented it yet.

Why doesn't the latest Mozilla handle this stuff? Are you saying Apple is ahead of the game in supporting the CSS spec? (at least this particular part)

For this particular part of the standard, yes; Apple is ahead.

In other parts of the standard, Apple is still behind. For example, they don't support the :active pseudo-element (styling something when the mouse is down).

For the record, Firebird 0.7.1 does not display the shadows, just white and black text on a dark background.

That is correct.

Millennium · Oct 31, 2003, 08:20 AM

Originally posted by Mike S.:
If this only works in Safari then it sounds to me like a proprietary CSS extension done by Apple.

An example of a proprietary extension done by Apple would be the -khtml-opacity property. Mozilla also has an extension exactly like this, though they call it -moz-opacity.

Both of these are based off of a proposed property for CSS3, which is simply called "opacity". As of the current CSS3 drafts, all three work the same way. The reason that Mozilla and Safari have the -moz and -khtml things is just in case the standard changes. If it does, they can implement the standard the correct way, while keeping their current methods as well, so that old pages using them will not break.

This is the spirit of standards. Extend them if you wish, but support the standards as a baseline, and make sure that your extensions don't break anything currently out there.

Moose · Oct 31, 2003, 08:27 AM

Originally posted by Big Mac:
One must always remember that Windows users put up with the abomination known as Win 3.1 for many, many years, and they thought it was good!

One must always remember that Mac users put up with the abomination known as Classic Mac OS for even more years, and they, too, thought it was good!

Some of them still consider it superior to Mac OS X.

mitchell_pgh · Oct 31, 2003, 10:10 AM

I have yet to see a good example of why I should care about this. I'm not trying to be a jerk, but everything looks like something out of a "HTML for Pros" book published in 1990.

SomeToast · Nov 3, 2003, 11:59 AM

Originally posted by eevyl:
I suspect it is directly related to the new shadows you can use in any font under Panther. The Font team for Panther implemented the shadow thingie, and Hyatt maybe saw that work and said 'Hey with this it is easy to implement that tricky text shadow CSS property', and he did.

That could explain why it doesn't support the spec fully -- only displaying the first shadow defined in a list. Maybe that's all the Panther shadow could do.

Fotek2001 · Nov 3, 2003, 06:21 PM

This article on Dave Hyatt's page explains it all.

http://weblogs.mozillazine.org/hyatt...07.html#003675

And for the record, I think this kind of feature can only help Safari. CSS is an amazing technology from the point of view of code aesthetics and accessibility. Plus, anything that saves us having to download massive images can only be a good thing if it's used with care!

Fotek2001 · Nov 3, 2003, 06:28 PM

On the other hand this is bad... Clicking on this link will open hundreds of Terminal windows from Safari by forcing the browser to load a telnet:// protocol page in a Javascript generated iframe - not good...

DO NOT CLICK ON THIS LINK UNLESS YOU KNOW HOW TO FORCE QUIT AN APPLICATION!

http://www.xvsxp.com/applications/in...me-script.html