Moderne Webanwendungen erfordern moderne Browser – Google stellt IE6 Unterstützung ein

Ende Januar kündigt Rajen Sheth, Google Apps Senior Product Manager in einem Beitrag im »Official Google Enterprise Blog« die Einstellung der Unterstützung für den IE6 – vorerst bei einigen Google Anwendungen – zum 1. März 2010 an.

2010 is going to be a great year for Google Apps and we want to ensure that everyone can make the most of what we are developing. Please take the time to switch your organization to the most up-to-date browsers available.

Empfohlen werden stattdessen der Internet Explorer 7.0+, Firefox 3.0+, Chrome 4.0+ und Safari 3.0+ Hoffentlich ist das für die IT-Verantwortlichen ein Signal, auch in größeren Firmen eine firmenweite Installation des IE8 durchzuführen. Es wäre sicherlich im Sinne aller Anwender – und Webentwickler.

Websites in verschiedenen IE-Versionen überprüfen

Mit dem »Microsoft Expression Web SuperPreview für Windows Internet Explorer« soll man die so genannte »cross-browser compatibility« – also die Darstellung einer Site in verschiedenen Browsern (oder verschiedenen Versionen eines Browsers) – testen können. Microsoft stellt für den Internet Explorer ein solches Tool kostenlos zum Download bereit. Erfordert aber das .NET Framework (Version 3.5).

Die Installation ist etwas langsam und das Tool an sich auch. Größere Sites kann es nicht korrekt darstellen. Faiz: Nicht wirklich hilfreich.

Microsoft-Expression-Web-SuperPreview-EINSTIEG-450.png

Microsoft-Expression-Web-SuperPreview-DVGW-450.png

Einführung in HTML 5 (Video)

Im Google Code Blog wurde ein Video (unten eingebettet oder auf Youtube) veröffentlicht, das in einer knappen dreiviertel Stunde auf HTML5 eingeht und beschreibt, was dabei an großen Neuerungen und Änderungen zu erwarten ist. Das sind unter anderem die Themen

  • Web vector graphics with the Canvas tag and Scalable Vector Graphics (SVG)
  • The Geolocation API
  • HTML 5 Video
  • The HTML 5 Database and Application Cache
  • Web workers

Google Page Speed

Google Page Speed, eine Erweiterung für Firefox und Firebug, soll Webseiten schneller machen und ist als als Open Source verfügbar.

Google veröffentlicht mit Page Speed eine Firefox-Erweiterung, die Web-Designern und -Entwicklern helfen soll, die Ladezeiten ihrer Seiten zu verringern. Dabei geht Page Speed allerdings einen Schritt weiter als andere, ähnliche Firefox-Erweiterungen.
Bislang kam Page Speed nur bei Google intern zum Einsatz. Die Firefox-Erweiterung bettet sich in Firebug ein und schlägt beim Laden von Webseiten Maßnahmen zu deren Optimierung vor. Dabei optimiert Page Speed beispielsweise automatisch die verwendeten Bilder und stellt eine komprimierte Version zur Verfügung, die direkt in der Webseite verwendet werden kann.

(Via Golem.de)

Mozilla Jetpack: Firefox Extensions with Added Thrust

Mozilla Jetpack: Firefox Extensions with Added Thrust: „Jetpack is a new experimental project from Mozilla that could revolutionize how Firefox browser extensions are built and deployed.

[…]

Jetpack’s primary aim is to make extension development and delivery even easier:

  • HTML, CSS and JavaScript will be the only tools required. If you can code for the web, you can create a Jetpack widget.
  • Extensions will be streamed and accessed from a URL.
  • You can develop code directly in the browser using Bespin.
  • Installation and debugging is handled without restarting and uses common tools such as Firebug.
  • A lightweight and versioned API is provided.
  • An extendable set of toolkits and API libraries such as jQuery, Google Maps, Twitter and Delicious will be available.
  • An about:jetpack page shows installed extensions, source code, memory use and other useful tools.

Jetpack is available as a standard Firefox add-on which can be installed from the project page.

(Via SitePoint Blogs.)

Coding-Werkzeuge: Die 10 nützlichsten Browser-Erweiterungen für Web-Entwickler

Aus einem Artikel aus dem T3N Weblog über »Coding-Werkzeuge: Die 10 nützlichsten Browser-Erweiterungen für Web-Entwickler« möchte ich unsere Favoriten zitieren und Webkit ergänzen:

Aardvark

Das Addon Aardvark für Firefox bietet Werkzeuge zur Seitenanalyse via Kontextmenü. Einzelne Seitenelemente lassen sich beispielsweise isolieren oder entfernen. Das ist auch für den „Normalnutzer‘ interessant: Auf diese Weise kann man zum Beispiel ungewünschte Seitenelemente wie Banner oder andere Bildelemente weglassen, um eine Seite für den Ausdruck zu optimieren.

ColorZilla

Mit ColorZilla lassen sich über ein Fadenkreuz Farbwerte auf Webseiten auslesen. Auch Abstandmessungen zwischen zwei Pixeln, Seitenzoom und verschiedenen Farbpaletten gehören zum Leistungsumfang der Erweiterung für Firefox und SeaMonkey.

CSS Validator

Die Firefox-Extension CSS Validator überprüft Webseiten auf Konformität mit dem W3C CSS Standard.

CSSViewer

Mit dem CSSViewer lassen sich die CSS-Attribute zu Elemeten einer HTML-Seite anzeigen.

Dafizilla ViewSourceWith

Die Erweiterung Dafizilla ViewSourceWith läuft mit den meisten Mozilla-basierten Anwendungen wie Firefox, Thunderbird, SeaMonkey, Songbird oder Flock. Sie ermöglicht die Anzeige von Quelltexten, Grafiken und externen CSS-/JavaScript-Dateien mit der bevorzugten Anwendung.

Firebug

Firebug gehört sicherlich zu den bekannteren Erweiterungen für den Firefox. Sie hilft Web-Entwicklern beim Debuggen ihrer Websites und Web-Applikationen. Mit Firebug Lite stehen wichtige Features auch für den Internet Explorer, Opera und Safari zur Verfügung

LinkChecker

Alle Links auf einer Website werden mit der Firefox-Erweiterung LinkChecker auf ihre Gültigkeit überprüft und entsprechend farblich gekennzeichnet.

Web Developer

Die Web Developer Erweiterung gibt es für Firefox, Flock und SeaMonkey. Sie fügt dem Browser ein Menü und eine Toolbar mit verschiedenen Tools für Webentwickler hinzu.

Webkit

Mit dem Safari zu Grunde liegenden Webkit lässt sich auch einiges machen. Ein guter Artikel darüber steht auch hier im Webkit-Blog.

(Via t3n.yeebase.com – Open Source, Web & TYPO3.)

Styling Scrollbars

Styling Scrollbars: „WebKit now supports styling of the scrollbars in overflow sections, listboxes, dropdown menus and textareas. For those who want to skip the article and just go right to the source, here is an example:

Scrollbar Example

Here is a screenshot for those not running a recent enough WebKit:

The scrollbar pseudo-element indicates that an object should use a custom scrollbar. When this pseudo element is present, WebKit will turn off its built-in scrollbar rendering and just use the information provided in CSS.

::-webkit-scrollbar {
    width: 13px;
    height: 13px;
}

The width and height properties on the scrollbar element indicate the width of the vertical scrollbar and the height of the horizontal scrollbar. Percentages can be specified for these values as well, in which case the scrollbar will consume that percentage of the viewport area.

A scrollbar consists of scrollbar buttons and a track. The track itself is further subdivided into track pieces and a thumb. The track pieces represent the areas above and below the thumb.

In addition the scrollbar corner can now be styled, as well as the resizer used by resizable textareas.

Here is a complete list of all the new pseudo-elements. All of these pseudo-elements must be prefixed with -webkit-.“

(Via Surfin‘ Safari.)