Tag-Archiv für » Design «

Flash: Font einbetten – Problem und Lösung

Dienstag, 15. April 2008 | Autor: Francis

Bei einem aktuellen Flash-Projekt trat unerwartet ein Typo-Probleme auf, dass sicherlich für einige Leser nicht neu ist. Mein Freelance Flashdesigner Anjin Anhut hat das Problem sauber in den Griff bekommen. Mit der Lösung möchte ich natürlich nicht zurückhalten:

Das Problem ist das Flash bei dynamischen Texten standardmässig auf die Fontbibliothek des jeweiligen Users zurückgreift. Somit bekommen Besucher der Seite nur dann die richtige Schrift angezeigt, wenn sie den Font selbst auf dem Rechner installiert und aktiviert haben. Dass der Designer den Font wenn er ihn einbaut selbstverständlich auch in seiner Bibliothek hat, sorgt dafür, dass der Designer den Fehler selbst nicht wahrnimmt.

Die standardmässig eingestellte Schrift von z.B. Firefox für Fonts die er nicht kennt ist die Times (-> preferences).Lösung:
Um zu sehen, wo der Fehler auftritt muss man in seinem Fontexplorer/ Manager den entsprechenden Font deaktivieren bevor man die Swf im Browser testet. Hat man die entsprechenden Zeichen noch nicht eingebettet, zeigen sie sich in wundervoller Times-Pracht. Also: Font wieder aktivieren, Browser refreshen und schon passt es wieder, nochmals deaktivieren, refreshen und wieder Times.

Einbetten Thumbnail in Im Eigenschaftsfenster für Texte steht einem in Flash die Option “Einbetten” zu Verfügung, damit legt man ganz simpel fest welche Zeichen des verwendeten Fonts in die Swf Zeicheneinbetten Thumbnail in eingebettet und somit für alle sichtbar gemacht werden sollen. Ohne das geht es nicht.

Bei Flashanwendung die dynamische Textinhalte (Punktestand, Newsticker, Scoreboards, Grusskarten, Formulare) verwenden, lohnt es sich die Swfs mal mit deaktivierten Fonts zu testen um zu sehen, wie das ganze für User aussieht die die Fonts nicht installiert haben.

Thema: Tipps & Tricks, Tutorials |  | 2 Kommentare

Da kommen sie, die neuen Features im Web

Dienstag, 18. März 2008 | Autor: Arne

Heute veröffentlichte Apple seinen Webbrowser Safari in Version 3.1 für Mac OS X sowie Microsoft Windows.

Safari 3.1 ist der erste Browser der sowohl Video- und Audio-Tags in HTML 5 als auch CSS Animationen unterstützt. Die Unterstützung von CSS Web Fonts eröffnet Webdesignern neue typografische Möglichkeiten bei der Gestaltung von Websites

, so Apple in der Pressemeldung.

Da kann man hoffen, dass die anderen Hersteller von Webbrowsern nachziehen und sich dabei auch alle beteiligten an die festgelegten Standards halten.

Detail-Informationen zum Update gibt es hier.

Thema: Allgemein |  | Dein Kommentar

YouTube API Update

Montag, 17. März 2008 | Autor: Francis

Vor einigen Tagen veröffentlichte YouTube eine neue API Version mit deren Hilfe sich nun nicht nur Videos von externen Webseiten hochladen lassen, sondern auch das Design (bis auf das Logo) und die Funktionalität können nun komplett anpasst werden. Good News für Flasher:  Durch die neuen Flash-Apis lässt sich der Player nun auch in Flash-Applikationen einbinden.

Thema: Allgemein |  | Dein Kommentar

CSS: Vor eine Überschrift eine Grafik positionieren

Donnerstag, 13. März 2008 | Autor: Francis

Um vor eine h1 Überschrift eine Grafik zu positionieren ist folgendes CSS erforderlich:

<br />
 h1 {</p>

<p>padding-left: 20px;</p>

<p>background: url(pic.gif) no-repeat left center;<br />
 }<br />

Das Padding und der Pfad zur Grafik sind natürlich individuell zu setzten. Die letzten beiden background Angaben (left und center) geben die Position der Grafik an, in diesem Fall links neben dem Element und vertikal zentriert. Die Position der Grafik kann selbstverständlich auch über Maßeinheiten wie Pixel oder Prozent gesteuert werden. Bei Pixelangaben wird die Grafik relativ zur linken oberen Ecke des Elements positioniert. Bei Prozentangaben wird ein Punkt innerhalb der Grafik, ausgehend von der linken oberen Ecke der Grafik, definiert. Wenn Sie z.B. eine horizontale und vertikale Position von 5 % angeben, wird ein Punkt innerhalb der Grafik, 5% von der linken oberen Ecke entfernt, an einer Stelle die innerhalb des Elements 5 % von der oberen linken Ecke des Elternelements entfernt liegt, positioniert. Zu guter Letzt muss für die vertikale Zentrierung ein Wert von 50% angeben werden.

<br />
 h1 {</p>

<p>padding-left: 20px;</p>

<p>background: url(pic.gif) no-repeat 0 50%;<br />
 }<br />

Thema: Tutorials, Webwork |  | Dein Kommentar

Die wichtigsten Abkürzungen

Mittwoch, 5. März 2008 | Autor: Francis

Ob Webdesigner, Entwickler, SEO, Printler oder Normalsterblicher, jeder braucht Sie hin und wieder, die Abkürzungen. Hier die wichtigsten:

Abb. -> Abbildung

Anm. -> Anmerkung

Bd., Bde. -> Band, Bände

Nr. -> Nummer

S. -> Seite

vgl. -> vergleiche

usw. -> und so weiter

a. a. O. -> am angegebenen Ort

a. D. -> außer Dienst
vollständigen Artikel lesen…

Thema: Tipps & Tricks |  | Dein Kommentar

CSS: Design zentrieren

Freitag, 22. Februar 2008 | Autor: Francis

Eine mir oft gestellte Frage: “Wie zentriere ich mein Design im Browser?”

Als Basis dient uns ein einfaches einspaltiges Layout. Der zu zentrierende div-Bereicht heißt: “center”.

Der div-Bereich erhält in diesem Beispiel eine feste Breite und die horizontalen Ränder werden auf “auto” gesetzt:

#center { width: 720px; margin: 0 auto;}

Im Quirks-Modus erkennen der IE 5.x und 6 allerdings keine automatischen Ränder. Durch einen kleinen Hack wird die Fehlinterpretation der Eigenschaft “text-align: center” des IE zur Zentrierung genutzt.

vollständigen Artikel lesen…

Thema: Tutorials, Webwork |  | 2 Kommentare

Seiten: Zurück 1 2 3 4 Weiter