Mit einer sog. Data-URL kann man Grafiken in HTML oder CSS einbinden. Dazu muss aus der Bilddatei eine base64-kodierte Zeichenkette erzeugt werden, die dann im src-Attribut eines Bildes oder als background-image im CSS genutzt werden kann. Hierdurch kann man HTTP-Requests sparen und somit die Performance erhöhen.
<?php $file = 'image.gif'; $data = file_get_contents($file); $encoded = base64_encode($data); ?>
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <title>untitled</title> <style> h2 { background-image:url(data:image/png;base64,<?php echo $encoded; ?>); } </style> </head> <body> <p><img src="data:image/png;base64,<?php echo $encoded; ?>" alt="" /></p> <h2>This is a test</h2> </body> </html>
Weitere Informationen insbesondere zur Browser-Kompatibilität finden sich in der Wikipedia.