Ein Sprite (engl. unter anderem für ein Geistwesen, Kobold) ist eine Grafikdatei, die viele Symbole bzw. Icons enthält. Diese Grafikdatei fasst also mehrere Grafiken zusammen und spart damit Ladezeit, da die Grafiken nicht einzeln geladen werden müssen; die HTTP-Requests werden dadurch ebenfalls reduziert. Die einzelnen Elemente (Icons, Buttons oder Hintergrundbilder) werden mit der CSS-Eigenschaft background-image und background-position ein- beziehungsweise ausgeblendet.
Der Name "Sprite" rührt daher, dass ein Sprite sich auf dem Bildschirm bewegt, aber im Grafikspeicher nicht zu finden ist, also scheinbar „umherspukt“.
Sprites lassen sich mit einer PNG- oder SVG-Datei realisieren. SVG hat den Vorteil, dass es sich hierbei um Vektorgrafiken handelt, die sich skalieren lassen und sich somit an unterschiedliche Bildschirmgrößen anpassen. ...weiterlesen "SVG-Sprites"