Slicen

Zerteilung von Bildern im Webdesign

Slicen oder Slicing (vom englischen slice für „Scheibe“ und to slice in der Bedeutung von „in Scheiben schneiden“, „aufteilen“) ist ein Verfahren im Screen- und vor allem im Webdesign. Dabei wird ein Bild in mehrere kleinere zerteilt. Diese Teilbilder werden dann im Markup lückenlos nebeneinander gesetzt, sodass die fertige Konstruktion wieder aussieht wie das ganze Bild. Die Webseite zeigt also nicht eine große Grafik, sondern mehrere kleinere Teilgrafiken, die zusammen wie eine größere Grafik aussehen.

Ein Hauptgrund für das Zerteilen großer Bilder in Segmente war, dass dadurch einzelne Webseiten schneller in den Browser geladen wurden.

Hintergrund

Bearbeiten

Die Technik des Slicens von Grafiken kam vermutlich Mitte der 90er-Jahre erstmals zum Einsatz, als das Layout der Webseiten hauptsächlich mit HTML-Tabellen erstellt wurde. In der Anfangszeit mussten die Bilddateien mit dem Maskierungs- oder mit dem Freistell-Werkzeug der EBV-Software zerteilt werden; erst ab 1998 beinhalteten Bildbearbeitungsprogramme wie ImageReady oder Fireworks eigens entwickelte Slicing-Werkzeuge, die die Aufteilung der Bilder sowie die Portierung in HTML-Code übernahm.

Zum Slicen benötigt man ein Bildbearbeitungsprogramm wie Fireworks, Corel Photo-Paint, Photoshop oder GIMP.

Anwendung

Bearbeiten

Der Grafikdesigner erstellt das Aussehen der Website mit einem Bildbearbeitungsprogramm. Da alle grafischen Bereiche flexibel genug sein müssen, später in einzelne Layout-Fragmente der Webseite integriert zu werden, müssen sie auf die Größe des HTML-Elements zurechtgeschnitten werden. Ein Button, den der Designer als Teil des Layouts kreierte, muss nun mit der Slicing-Methode zurechtgeschnitten werden, damit der Webdesigner diese Grafik später als Hintergrund für die Schaltfläche angeben kann.