praegnanz.de büro für intervernetzte medien

Gerrit, 19.06.2007

Black & White: Die neue apple.com

In dem ganzen Getöse um den Safari-Browser für Windows ging leider ein wenig unter, dass Apple die eigene Website grundlegend renoviert hat – was jedoch auch bitter nötig war, allein wegen der 2001esken »Aqua«-Topnavigation. (Auf der deutschen Seite noch zu bewundern) Die bangende Frage eines jeden Webstandards-liebenden HTML-Coders ist nun natürlich: Setzt Apple auf semantischen Quellcode mit modernem CSS und unaufdringlichem JavaScript? Oder geht es geradewegs zurück in die Tabellenhölle (wie bei einigen Beispielen in jüngster Zeit)?

Die Antwort lautet zum Glück: nein! Schön, dass es noch solche Anzeichen gibt, dass wir mit unseren idealistischen Webdesign-Ansätzen nicht komplett an der Realität vorbei schwimmen! Mit apple.com haben wir also nun wieder ein bekanntes und vor allem trafficstarkes Beispiel als Argumentationshilfe am Start, das auf moderne Techniken setzt und trotzdem keine Kompromisse in der Gestaltung macht.

Wir haben semantisch gegliederten Code, wo Überschriften korrekt hierarchisch gesetzt sind und Listen einsetzt, wo es sinnvoll ist. Bestes Beispiel: Der horizontale »Coverflow«-style Produktscrollbalken (oben). Hier ist natürlich jede Menge JavaScript am Werk. Aber selbstverständlich greift dieses von außen auf den DOM zu, und zwar mittels prototype und script.aculo.us – sehr hübsch! Es ist eine Menge an Bewegungs-Effekten am Start – das mag ein wenig auf die Performance bei schwachen Rechnern gehen. Aber schaltet man JavaScript aus, so sieht man, wie elegant das alles abgefedert wird – es gibt sinnvolle Fallbacks für alle gepimpten Elemente.

apple.com

Die Optik gefällt durch sehr individuelles Design des Inhalts. Wie Nicolas in seinem Blog schön beschreibt, ist der Template-Wahn (»Wir brauchen nur ein einziges Seitenlayout für alle Aufgabenstellungen!«) hier angenehm zurückgefahren worden. manche Seiten kommen mit schwarzem Background, andere in weiß, manche mit klassischem Info-Dreispalter, andere mit einem eher imageträchtigen, freien Layout. Je nach Sinnhaftigkeit – so soll’s sein! Das einzige durchgängige Element ist die Hauptnavigation, die in Leopard-kompatiblem Unified-Look daherkommt und mit einer sehr schicken Livesuche gesegnet wurde!

Fazit: Eine rundum gelungene Seite, die zwar grafisch und technisch eher aufwändig ist, aber dennoch sehr gut die Inhalte transportiert. Opulent statt minimal, aber dafür durchdacht und technisch komplett würdig für das Jahr 2007!

Disclaimer: Ich werde weder von Apple noch von »Triegarmi« für irgendetwas bezahlt. Es ist jedoch nicht auszuschließen, dass mein MacBook, auf dem ich diese Zeilen schreibe, von Apple mit bewusstseinserweiterten Substanzen versetzt wurde, um beim Autor ein angenehmes Gefühl von Erfülltheit und Gelassenheit zu erzeugen, welches sich auf die Kritikfähigkeit auswirkt.

11 Kommentare

  1. Eric am 19. Juni 2007 #

    Das mit den vielseitigen Layouts hatte Apple ja schon vor dem Relaunch. Der selbst ist natürlich klarer und besser strukturiert geworden. Von den Änderungen unter der Haube ganz zu schweigen. Da können sich andere eine dicke Scheibe von abschneiden …

  2. Matt am 19. Juni 2007 #

    Gerade die Startseite und das ganze nicht extern eingebunde Javascript und CSS sind noch optimierungswürdig.

    „Besser als vorher” würde ich mal sagen, viel besser als viele andere wie Toom oder große deutsche Verlage. Auf jeden Fall ein Schritt in die richtige Richtung.

  3. Jürgen Siebert am 19. Juni 2007 #

    [... Ist die neue Apple-Website zeitgemäß? Gerrit meint ja  …]

  4. Stefan Nitzsche am 19. Juni 2007 #

    Sogar bei Klassen und IDs hat Apple auf generische Namen geachtet … kleinere Ausrutscher sind trotzdem passiert („pb-leftarrow“ bzw. „pb-rightarrow“).

    Als Doctype HTML 4.01 Transitional zu wählen, halte ich für antiquiert … hier hätte ich mir zumindest XHTML 1.0 Transitional gewünscht, wenn nicht sogar XHTML 1.0 Strict. Wahrscheinlich ist der Grund dafür, dass einige Teile der Webseite sanft migriert werden sollen. Zumal schon etliche Tags wie in XHTML üblich geschlossen werden (z.B. Startseite, Zeile 65).

    Dazu kommt, dass selbst die Startseite nicht gegen HTML 4.01 Transitional validiert.

    Fazit: Nicht schlecht, ein großer Schritt in die richtige Richtung, aber es besteht weiter Optimierungsbedarf.

  5. Ingo am 19. Juni 2007 #

    Ganz kurz: Die Consumer Produkte haben den weißen Hintergrund, Pro Produkte sind schwarz …

  6. Gerrit am 19. Juni 2007 #

    Naja, das iPhone ist auch schwarz, aber mit zwei Schattierungen!

  7. /T am 19. Juni 2007 #

    Inwiefern ist XHTML 1.0 Transitional denn besser als HTML 4.01 Transitional? (Achtung, Fangfrage)

  8. Paul am 19. Juni 2007 #

    Jetzt macht mal halblang. Kennt ihr das CMS dahinter? Stell mir das verdammt schwer vor, dass 100%ig an XHTMl anzupassen.
    Für einen Seitenumfang wie Apple ist das in meinen Augen 100% Perfektion, was sie da erreicht haben.

    Ich selber betreu eine Webseite mit über 250 Unterseiten und weiß wie utopisch es ist, jede Seite fehlerfrei einpflegen zu wollen. Ständig kommen neue Änderungen … Apple hat ein x-faches der Seitenzahl …

  9. Stefan Nitzsche am 19. Juni 2007 #

    @Tomas Caspers: Nichts. Transitional ist immer ein Kompromiss … und trotzdem in manchen Szenarien vorzuziehen. Tendenziell fühle ich mich wohler mit XHTML 1.0 Transitional, als mit HTML 4.01 Transitional … und am wohlsten mit einer Strict DTD – aber Apple ist ja nicht für mein Gefühlsleben verantwortlich …

    @Paul: Klar, da hast Du sicherlich Recht … allerdings 100 % Perfektion wäre halt 100 % Perfektion … einigen wir uns auf 99 % … was, und da bin ich bei Dir, bei so extrem viel Inhalt, eine reife Leistung ist.

  10. Rene Meissner am 20. Juni 2007 #

    Ich höre da bei einigen einen gediegenen Print-Hintergrund raus: Was hat denn die Anzahl der Seiten mit dem Erreichen einer maximalen Stringenz (in Bezug auf Standard der einzelnen Seite) zu tun? Dafür haben wir doch CMSe. Es passiert leider nur zu häufig, dass das verwendete CMS, den Redakteuren und Gestaltern durch irgendwelche Hintertüren die Einschleusung schlechten Codes ermöglicht. Es sollte immer so sein, dass das Ausgabeformat (DTD) auch für das CMS gilt und Schrott gar nicht erst generiert werden kann.

Kommentar schreiben

Nutzt Textile zum Strukturieren eures Textes.
SEO-Beiträge werden gelöscht, auch bei thematisch passendem Spam.