Webdesign

HTML und CSS

Tutorials

w3schools

YAML: Framework

• Homepage
  • Deutsche Doku
  • Yaml Builder

Zen Wireframe Typo3 Template

• Tutorial

Schriften mittels CSS laden

CSS3 ermöglicht per @font-face eigene Schriftarten einzubetten. Alle modernen Browser unterstützen diese Funktion, auch wenn nicht alle die gleichen Dateiformate unterstützen.
Liegt die referenzierte Schriftart allerdings nicht auf der gleichen Domain stößt man jedoch plötzlich auf das Problem, dass der Code im Firefox nicht mehr funktioniert, in anderen Browsern jedoch schon. Hierbei handelt es sich um eine Sicherheitsfunktion von Firefox, der die Schriften nur lädt, wenn der Webserver ihm dies erlaubt. Hier findet sich die entsprechende Doku von Mozilla. Die Konfiguration kann man in einer .htaccess ablegen, oder direkt in der Apache2 Konfiguration eintragen:

• Für alle den Zugriff auf die Schriftarten erlauben

<FilesMatch "\.(ttf|otf|svg|eot|woff|woff2)$">
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
</IfModule>
</FilesMatch>

• Eingeschränkter Zugriff auf die Schriftarten erlauben

<FilesMatch "\.(ttf|otf|svg|eot|woff|woff2)$">
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "http://sub1.example.com,http://sub2.example.com"
</IfModule>
</FilesMatch>

Gemäß Mozilla ist die Komma getrennte Angabe mehrerer Domains zulässig. Dies scheint aber nicht immer zu gehen, deshalb hier ein Beispiel mit Regex.

<FilesMatch "\.(ttf|otf|svg|eot|woff|woff2)$">
 SetEnvIf Origin »
   "^http(s)?://(.+\.)?(domain1\.org|domain\.com)$" origin_is=$0
 Header always set Access-Control-Allow-Origin %{origin_is}e env=origin_is
</FilesMatch> 
Original Doku: http://www.lowest-common-denominator.com/2010/01/http_access_control_to_multipl.php

Bild-Agenturen

T-Online PolyLooks

• Photocase
• PolyLooks
• Fotolia
• iStockphoto

Blind-Text

Blindtext-Generator

• blindtextgenerator.de

Blind Image Generator

• dummy-image-generator.com