Skip to page content or skip to Accesskey List.
Search evolt.org
evolt.org login: or register

Work

Main Page Content

On Safari

Rated 3.63 (Ratings: 10) (Add your rating)

Log in to add a comment
(10 comments so far)

Want more?

 
Picture of aardvark

Adrian Roselli

Member info | Full bio

User since: December 13, 1998

Last login: January 21, 2009

Articles written: 48

So you've been wondering what all the hubbub is about this new browser that Apple has released, right? I bet you're thinking to yourself, "oh dear, even more browsers in which to test." Well, you're right, it is a new browser to test, but it's eerily familiar to many of us.

Apple announced Safari as its new web browser during its MacWorld bonanza, and posted a ~3MB beta download for Jaguar users (OSX v10.2, better for v10.2.3) on its site at http://apple.com/safari/. This page also contains all the latest marketing speak on the browser, something worth reading before downloading.

Safari is built on the KDE rendering engine, using KHTML and KJS libaries (opensource), all of which power the familiar *nix browser, Konqueror. For those who've never been able to test on Konqueror and have access to a Mac, now you can do some basic testing (it won't be an exact match, but it's a start). For those who don't have a Mac but do have access to Konqueror, the same logic applies, just reversed.

Below are some of the known features and bugs of the browser, and while not exhaustive by any means, is good way to get thinking about how it may render your sites.

  • Supposedly CSS1, CSS2, DOM0, DOM1 (reportedly "almost"), and DOM2 compliant.
  • In CSS testing, supports attribute selectors, :first-child pseudo-class, :hover on arbitrary elements (<tr> for sure, anyway), @media, and adjacent sibling selectors.
  • Aiming for compliance with ECMA-262 3rd Edition (JavaScript 1.5).
  • Can render Java applets.
  • Reportedly renders more quickly than Netscape, Internet Explorer, or Chimera.
  • Will try to download XHTML files with XML mimetype instead of just display them.
  • 72dpi (versus 96dpi) rendering of type.
  • Doesn't display link title attributes as tooltips.
  • Pop-up blocking appears to be built in.
  • Currently identifies self as ( Note the "like Gecko" comment.):
    Mozilla/5.0 (Macintosh; U; PPC Mac OS X; en-us) AppleWebKit/48 (like Gecko) Safari/48

evolt.org in Safari Screen capture showing how the evolt.org home page renders in Safari. As you can see, it looks pretty darn good, which is a testament to Safari's rendering engine, and the swanky, valid code under evolt.org's hood.


evolt.org in Safari Screen capture showing how a evolt.org article page renders in Safari. Much like the home page, it holds its own for interpreting the code on the page, handily accepting our compliant HTML and CSS and then rendering it into the work of art that you are reading now.

Further Reading

MacEdition Guide to CSS2 Support in Mac-only Browsers, and the first column is Safari. See the abridged version for comparisons with other browsers.

KDE-maintained compilation of CSS2.1 visual media support in KHTML/KDE3.1.

The developer list for the KHTML and KJS libraries that power Safari, which talks about bugs, fixes, and support.

A review at Dive Into Mark, including screen shots and the results on testing across the HTML and CSS specs, as well as a number of CSS techniques/hacks.

Review at Six Log, with reader comments.

Mac Net Journal has a review.

Insanely Great Mac reviews it, and has a bunch of user comments.

The Mac News has an overview.

Safari-specific AppleScripts.

Matt Haughey comments (of MetaFilter fame).

A founder of evolt.org, Adrian Roselli (aardvark) is the Senior Usability Engineer at Algonquin Studios, located in Buffalo, New York.

Adrian has years of experience in graphic design, web design and multimedia design, as well as extensive experience in internet commerce and interface design and usability. He has been developing for the World Wide Web since its inception, and working the design field since 1993. Adrian is a founding member, board member, and writer to evolt.org. In addition, Adrian sits on the Digital Media Advisory Committee for a local SUNY college and a local private college, as well as the board for a local charter school.

You can see his personal portfolio at http://roselli.org/.

Adrian authored the usability case study for evolt.org in Usability: The Site Speaks for Itself, published by glasshaus. He has written three chapters for the book Professional Web Graphics for Non Designers, also published by glasshaus. Adrian also managed to get a couple chapters written (and published) for The Web Professional's Handbook before glasshaus went under. They were really quite good. You should have bought more of the books.

While you're reading, a friend of mine has just launched her site, and you should take a look. Kristen Kos, a lovely and talented actress, now has her own site with her acting resume and some new head shots.

Add to your testing list

Submitted by MartinB on January 10, 2003 - 02:45.

Up until now, you'd have to be pretty dedicated to put Konqueror on your testing list. However, once this is out of beta (and more so, when it's likely the default browser on new Macs), it'll be essential to test on Safari.

login or register to post comments

Preaching to the choir...

Submitted by ChrisG on January 10, 2003 - 15:07.

... I _hope_ everyone that tries beta software will just dismiss this comment with a "ya, ya, I already do that", but don't forget: backup your critical files/machine before attempting to horse around with beta software!

login or register to post comments

Reported bugs

Submitted by MartinB on January 10, 2003 - 19:42.

Just to demonstrate the necessity, there have been a few fun and interesting bugs reported (and had doubt cast upon - YMMV).

login or register to post comments

Safari Enhancer

Submitted by bmann on January 10, 2003 - 22:31.

For those experimenting with Apple's new browser, here is an add-on that enables a debug menu. It allows one to see the DOM tree, Render tree, and View tree, change the UA string (which looks like it can change automatically??) and a few other bits and pieces.

http://gordon.sourcecod.com/sites/safari_enhancer.php

For the non-CLI averse, drop into the Terminal and run (while Safari is not running):

defaults write com.apple.Safari IncludeDebugMenu 1

login or register to post comments

dhtml support

Submitted by sci_Fi on January 11, 2003 - 10:28.

Does CSS support implies DHTML interfaces compliance, such as overflow scrolling for layers. By the way does DOM compliance include support for document.implementation.createDocument()...

This is for a site that uses DHTML (and client-side XML if it is supported, otherwise serverside), but only as an interface. I don't like browser sniffing and such, but in this case server-side client detect is only for DHTML presentation, not for denying contents. The contents would be the same for all browsers and platforms, only in DHTML for compliant browsers, otherwise HTML.

login or register to post comments

Konquror vs Safari

Submitted by kevin on January 11, 2003 - 15:55.

It looks as though they eventually will be the same rendering engine.

The KHTML crew are currently working to implement the Safari changes and in the future it is quite likely they will share the same codebase or be very close ala netscape & Mozilla.

login or register to post comments

Mac OS X Browser Comparison

Submitted by neuro on January 15, 2003 - 01:00.

Just FYI ...

http://www.hut.fi/u/hsivonen/os-x-browsers.html

login or register to post comments

Mac OS X info

Submitted by sci_Fi on January 15, 2003 - 14:57.

oh, thanks for that link. It has very useful and exhaustive information...

login or register to post comments

Safari and history.back and history.go

Submitted by jlasiter on January 29, 2003 - 15:37.

Safari does not seem to recoginze the javascript history.back or history.go functions. Any workarounds? Should I expect Apple will fix this?\ Thanks.

login or register to post comments

Problems with Safari

Submitted by pj75 on February 11, 2005 - 09:52.

Why does it seems as if Safari gives CSS and JS major problems? I am working a web-app that needs to be tested for users in Safari and my drop-down style menus show up in the upper left hand corner of the screen...although my menu bar is top right. I'm trying to find a fix for this but I haven't yet. Any suggestions?

login or register to post comments

The access keys for this page are: ALT (Control on a Mac) plus:

evolt.orgEvolt.org is an all-volunteer resource for web developers made up of a discussion list, a browser archive, and member-submitted articles. This article is the property of its author, please do not redistribute or use elsewhere without checking with the author.