Web Browsers And Packages

Release: 2010-02-05
Jump to Web Standards Articles TOC

Apple WebKit Browsers including Apple Safari

Apple's WebKit version 530 is an open-source, Crystal Level web platform originally based on KHTML and KJS parts of the K Desktop Environment (KDE). WebCore layout engine provides the HTML, XML and CSS while the Nitro scripting virtual machine provides JavaScript support. The improved WebKit provides cutting-edge, web-standards support available for web browsers and web-enabled applications. WebKit 530 supports:

  • HTML 4.01 (HyperText Markup Language);
  • HTML 5 'Subset';
  • label attribute for option elements;
  • HTML 5's <meta charset="">;
  • HTML 5 Forms's <input type="range"> and <input type="search">;
  • &apos; named character reference;
  • contenteditable and spell checking support (but not spellcheck attribute);
  • canvas Element;
  • HTML 5's audio, video and source elements;
  • WAI-ARIA adds support for Accessible Rich Internet Applications;
  • Cascade StyleSheets (CSS) level 1, Visual & Interactive and partial Paged level 2.1 provides a realistic way of adding presentation and layout to your document structures;
  • Some main and experimental CSS level 3 features;
  • The ability to style and script with unknown markup;
  • For image support we have GIF89a, JPEG, PNG, Icons (.ico, .png, .jpg, .gif (and .icns in Mac OS X only)), BMP (Windows Bitmap), XBM (X Bitmap), XPM (X Pixmap) and SVG 1.1;
  • Document Object Model (DOM) level 1 (HTML, XML), 99% of level 2 (Core, HTML, XML, Views, Stylesheets, CSS, CSS2, Events, UIEvents, MutationEvents, MouseEvents, HTMLEvents, Traversal, Range), bits of Core DOM 3, XPath DOM 3 (as of WebKit 522), TextEvents DOM 3 (as of WebKit 523), Bits of DOM 5 HTML exposes documents to scripting interaction;
  • JavaScript 1.4, and as of WebKit 420, JavaScript 1.6 (without multiple catches);
  • Selectors API allows an easier way to access parts of the DOM using CSS-like selectors;
  • In WebKit 525, to compliment cookies, Web Database Storage allow local database performance and capacity with SQLite, and its support for SQL, to store information beyond the abilities of cookies;
  • In WebKit 530, Web Storage's sessionStorage and localStorage allow local database performance and capacity with SQLite for name/value pairs.

Canvas feature support includes:

  • Stroke and fill colours;
  • Rectangles;
  • Paths;
  • rgba/hsla colours;
  • Text;
  • Shadows (not on objects with gradients);
  • Linear and radial gradients;
  • Patterns;
  • Translations, rotation and scale;
  • Bring in pixel images;

CSS level 3 features supported includes:

  • hsl(), rgba(), hsla() functions;
  • Namespaces Module, most of Media Queries;
  • Multiple Background Images and the opacity property for full gradient transparency;
  • some -webkit- properties such as -webkit-border-radius, -webkit-box-sizing;
  • (WebKit 525:) CSS Gradients, Masks, Box Reflections, Animation, Transitions, 2D Transforms and some 3D Transforms support with -webkit- prefix;
  • text-shadow, -webkit-box-shadow;
  • ::selection pseudo-element selector, Structural pseudo-class selectors (like :nth-child, :not, :empty, :first-of-type, etc), :enabled, :disabled and :checked UI state pseudo-class selectors, :target selector;
  • @font-face At Rule with multiple src values, local() and format() functions (support for TrueType and OpenType fonts on the desktop, support for SVG Fonts on the iPhone and iPod Touch);

Native Media format support includes:

  • MPEG4 Video;
  • H.264 Video;
  • Quicktime Video
  • AAC / M4A Audio
  • MP3 Audio
  • Wave Audio
  • AIFF Audio
  • Apple Lossless Audio
  • Quicktime Audio;

SVG support includes:

  • Groups;
  • Stroke and fill colours;
  • Basic shapes (Rectangles, Rounded Corner Rectangles, Lines, Circles, Ellipses, Polylines and Polygons);
  • Paths;
  • Opacity;
  • Text;
  • Hyperlinkg;
  • Linear and radial gradients;
  • Translations, skews, rotation and scale;
  • Bring in pixel images;
  • SVG declarative animation;
  • SVG Fonts;
  • CSS support;
  • Scripting support;
  • Scripted animation;
  • SVG does not integrate with webpage (has white matte background);

In the realm of XML:

  • eXtensible Markup Language (XML) 1.0 and 1.1 with Namespaces & XML-Stylesheet Processing Instruction (PI);
  • eXtensible HyperText Markup Language (XHTML) 1.0, 1.1 (without Ruby Annotation) and Basic 1.0 (Earlier WebKit (419): did not support XHTML named entities beyond XML's built-in five.);
  • eXtensible Stylesheet Language Transformations (XSLT) 1 & eXtensible Path Language (XPath) 1 provides the ability to convert extensible document structures into other document structures;
  • Scalable Vector Graphics (SVG) 1.1 for ultimate 2-dimensional vector image display (WebKit 420+), now with advanced text (WebKit 525) and supports declarative and scripted animation (WebKit 530), does not support Filters;
  • RSS and Atom news feed support (WebKit 419+);

provides an excellent platform for experiencing the World Wide Web.

WebKit 530 passes the Acid 2 Test which tests Cascade Stylesheet (CSS) support. More about the Acid 2 Test from the Web Standards Project (WASP).

WebKit 530 also clocks 100 out of 100, passing all tests and one test took 65 attempts, from the Acid 3 Test which tests DOM, scripting, HTML, SVG and various other technologies for Web 2.0. More about the Acid 3 Test from the Web Standards Project (WASP).

In order to allow users to navigate and use interactive webpage features using the keyboard (part of making webpages accessible) Safari and possibly other WebKit based UserAgents provide the following: On MS Windows you can tab through form controls in general. In order to tab through links and form controls in general you tick the Tab to highlight all items on a web page checkbox in the Safari Advanced Preferences. On Apple Mac OS X you can tab through form text boxes and select popup lists only by default. In order to tab through links and form controls in general you need to either use option+tab or tick the Tab to highlight all items on a web page checkbox in the Safari Advanced Preferences.

WebKit Features

WebKit will process native XHTML with the 'text/xml', 'application/xml' and 'application/xhtml+xml' MIME Types. But browsers using WebKit 419 and under such as Safari 1 and 2 do not understand the XHTML named entities beyond the original five built-in XML entities &lt;, &quot;, &amp;, &apos; and &gt;. It will show errors for those other entities and then process the webpage as usual with those other particular characters missing. Web browsers based on Webkit 420 and higher such as OmniWeb 5.5, including WebKit 530 (Apple's Safari 4), do support the XHTML named entities.

Version 3 and higher of Safari for Mac and Windows provides the ability to resize various form controls. For Mac OS X.5 Leopard, iPhone and iPod Touch (January 2008 upgrade and version 2+) provides support for capturing a webpage or part of a webpage as a Widget using Webclips.

Safari 4 is one of the fastest web browsers for the Mac and Windows for Markup, CSS and JavaScript performance. Plus for Web Authors you can enable the 'Develop' Menu in the Advanced Preferences Tab to use the Web Inspector to view syntax coloured source code of webpages, stylesheets and scripts; view the webpage as a full Document Object Model and applied styles lists. Features an error console, a network timeline to see how long a webpage, image, stylesheet and script took to download; also a UserAgent string switcher and can pass the webpage to other installed web browsers. These are not add-ons but all built into Safari 4.

Safari 4 also has Anti-Phishing and Anti-Malware support.

Safari 4 has Cover Flow to Safari's Bookmarks and History so you can see previews of webpages you have previously visited. New CSS Effects add amongst others, support for reflections for images and other objects on the webpage.

WebKit Availibility

WebKit is used in Apple's flagship web browser, Safari. Other web browsers that use WebKit include Shiira, OmniWeb since version 4.5 (WebKit 85) for Mac OS X (Version 5.5, using WebKit 420, has problems loading XML Documents but is fine with XHTML). OmniWeb 5.6 uses WebKit 522 and has no problems. iCab 4.2 and OmniWeb 5.8 also uses Apple WebKit 525.

Apple Safari 1 (WebKit 85) is included with Mac OS X.3 Panther, Safari 2 (WebKit 419) is in OS X.4 Tiger and Safari 3 (WebKit 523) is in OS X.4.11 Tiger and OS X.5 Leopard.

Safari 4 (WebKit 530) is available for Mac OS X.4.11 Tiger, OS X.5.6 Leopard, MS Windows XP and Vista.

Apple WebKit has also been ported to mobile platforms such as from Nokia and has been ported to Nokia's QT 4.5 cross-platform programming platform providing Webkit (effectively most of 530) support for KDE 4 as QTWebKit. Also a GTK+ (based on WebKit 528) as WebKitGTK port that at least Epiphany can make use of and Midori uses WebKitGTK. Google's Chromium open-source progect use most of WebKit too. Apple's Webkit has become one of the most popular cross-platform web platforms.

Features that need to be added to WebKit

  • For CSS:
    • Support for Web Open Font Format (.woff);
  • From HTML 5:
    • Extend canvas shadow support to objects with gradient;
    • section, article, aside, nav, hgroup, header, footer, mark, time, progress, meter, figure, figcaption, details and summary elements;
    • Transparent background of SVG Documents brought in with object needs to allow HTML webpage background through instead of white matte;
    • Inline SVG in text/html documents;
  • From SVG:
    • Support for Filters;
  • Formats for HTML 5 Native Media:
    • OGG Video (Theora),
    • OGG Vorbis Audio;
Safari , Arora (QTWebKit), iCab , Shiira , OmniWeb , Epiphany (WebKit Edition).

Copyright ©2005-2010 Legend Scrolls and Peter Davison.
Icons from the Oxygen Icon Theme, LGPL, and PNG version of icons in the Oxygen Icon Theme from kde-look.org, GPL.
All rights reserved.