Wie kann die Schriftart ITC Avant Garde oder ein Ersatz für das Web unterstützt werden?

Ich codiere das Redesign (css+html) für eine Webapp in Indien , wo mein Künstler ein Mockup für mich zum Codieren entworfen hat. Ich frage mich nun, wie ich eine Schriftart "ITC Avant Garde" so anpassen kann, dass sie so nah wie möglich an der ursprünglichen Skizze aussieht. Ist ITC Avant Garde als Webfont verfügbar oder muss ich es mit etwas anderem annähern? Ist es sowohl mit Buch als auch mit Medium in Schriftstärke erhältlich? Mein CSS definiert es wie folgt. Sieht es in Ordnung aus?

body {
    background-color: rgb(255, 255, 235);
    font-family: Futura, Futura-Medium, "Futura Medium", "Century Gothic", CenturyGothic, "Apple Gothic", AppleGothic, "URW Gothic L", "Avant Garde", sans-serif;
    font-size: 14px;
    line-height: 20px;
    color: rgb(0, 0, 0);
    height: 100%;
    text-align: center;
    background-position: initial initial;
    background-repeat: initial initial;
}

Das ursprüngliche Mockup-Design ist dieses

Geben Sie hier die Bildbeschreibung ein

Mein Code zeigt es jetzt ähnlich an, aber es ist nicht perfekt.

Geben Sie hier die Bildbeschreibung ein

Antworten (1)

Heutzutage können Sie praktisch jede beliebige Schriftart als Webfont verwenden, indem Sie die Schriftart in Ihr CSS und Ihre Website einbetten.

Beliebte Websites wie Font Squirrel bieten Ihnen Webfont-Kits, die Sie sofort in Ihre Website implementieren können, während andere auf Online-Dienste wie Google Fonts oder Adobe Typekit zurückgreifen , mit denen Sie beliebte Schriftarten problemlos in Ihre Website einbetten können.

In jedem Fall ist ITC Avant Garde als Webfont über MyFonts erhältlich und es wäre für Sie sehr einfach, es in Ihr CSS zu implementieren.

Davon abgesehen sollten Sie sich meiner Meinung nach für Google Fonts entscheiden, die bereits verwendet werden und kostenlos sind. Sie sehen gut aus und sind schnell geladen. Auch in Bezug auf Ihr CSS font-familyscheint Ihre Regel viel zu lang zu sein und viele sehr spezifische Fälle in Betracht zu ziehen. Du solltest nach so etwas gehen:

font-family: 'Your Typeface Family', sans-serif;

Es gibt keine Notwendigkeit für so viele Fälle, die selten vorkommen werden.

Schließlich können Sie Ihre font-family, line-heightund font-size-Regeln mit der Schriftart-Kurzschrift komprimieren , die hier von Chris Coyier erklärt wird.