EN
Sökande...

Teckensnitt på webbplatsen

Inställningarna för webbplatsens textstil i Pixpa låter dig kontrollera typografin på hela din webbplats. Från rubriker och titlar till brödtext och beskrivningar kan du anpassa teckensnitt, storlekar och avstånd för att matcha ditt varumärkes visuella identitet.

Pixpa stöder fler än 300 teckensnitt från Google Fonts-arkivet, tillsammans med ett urval av OFL-licensierade teckensnitt som du kan använda fritt. Genom att justera dina textstilar kan du säkerställa konsekvens och förbättra läsbarheten på alla sidor på din webbplats.

I den här artikeln:

  1. Aktuell teckensnittsuppsättning
  2. Teckensnittsförinställningar
  3. Avancerad redigering
  4. Återställ anpassade inställningar
  5. Alternativa typsnitt från Google

Du kan hantera teckensnitten för din webbplats från Design (1) avsnitt.

När du är inne i designsektionen klickar du på Teckensnitt (2) flik.

Aktuell teckensnittsuppsättning

  • Den valda Förinställd teckensnitt (1) kommer att visas här.
  • Du kan anpassa Rubrik (2) och Punkt (3) teckensnitt för den valda förinställningen.

Obs: När du gör anpassade justeringar av färgpalettalternativen eller avancerad redigering kommer du att se en 'Ändrad' (4) -knapp.

  • Övre text (5) representerar teckensnittet Rubrik.
  • Nedre text (6) representerar teckensnittet Paragraph.

Anmärkningar:

  • Om du ändrar rubrikens teckensnitt kommer det också att påverka webbplatsens titel och menyalternativ.
  • Om du ändrar stycketeckensnittet kommer det också att påverka knappar, gallerier (bildrubrik) och sidfotstext.

Teckensnittsförinställningar

Teckensnittsförinställningar är fördefinierade kombinationer av teckensnitt, teckenstorlekar, bokstavsavstånd och andra typografiska inställningar som kan tillämpas på texten på den övergripande webbplatsen.

  • Du kan enkelt ändra teckensnittet globalt genom att välja någon av de Förinställningar för teckensnitt (1).
  • Filtrera (2) listan genom att välja Alla, Serif, Sans Serif eller Blandade förinställningar. När du väl har valt ett filter kommer du bara att se relaterade förinställningar.
  • Att välja a Förinställd teckensnitt (3), du behöver bara klicka på den och Publicera (4) ändringarna.

  • Bläddra till botten av teckensnittslistan för att komma åt och välja bland de tillgängliga OFL-teckensnitt.

Avancerad redigering

Härifrån kan du åsidosätta de förinställda inställningarna och hantera teckensnitten för alla delar av din webbplats manuellt.

Du kommer att se följande alternativ här:

Sidans Titel

Det är titeln på din webbplats som fungerar som en logotyptext om den primära logotypen inte är tillgänglig.

Från här. kan du:

  1. Teckensnitt – Välj typsnitt för din webbplatstitel.
  2. Vikt - Välj teckensnittsvikt för din webbplatstitel.
  3. Storlek – Desktop – Ange textstorleken för din webbplatstitel på skrivbordet.
  4. Storlek – Mobil – Ange textstorleken för din webbplatstitel på mobilen.
  5. Teckenavstånd - Ställ in utrymmet mellan bokstäverna i webbplatsens titel.

Rubrikmeny

Det är en samling sidor, länkar, mappar, gallerier etc. som gör det möjligt för användare att flytta mellan olika delar av en webbplats.

Från här., kan du anpassa:

    1. Teckensnitt – Ange typsnittet för menylänkarna.
    2. Vikt - Välj teckensnittsvikt för menylänkarna.
    3. Storlek - Ange textstorleken för menylänkarna.
    4. Teckenavstånd - Ställ in mellanrummet mellan bokstäverna i menylänkarna.

    1. Teckensnitt – Ange typsnittet för länkarna i rullgardinsmenyn.
    2. Vikt - Välj teckensnittsvikt för rullgardinsmenylänkar.
    3. Storlek - Ange textstorleken för rullgardinsmenylänkar.
    4. Teckenavstånd - Ställ in utrymmet mellan bokstäverna i rullgardinsmenyn.

Rubriker

Rubriktaggar är avgörande eftersom de hjälper till att strukturera innehållet, förbättrar SEO, förbättrar tillgänglighet och läsbarhet. Det finns fyra typer av rubriktaggar som Pixpa tillhandahåller. De är rubrik (H1), rubrik (H2), rubrik (H3) och rubrik (H4).

Från här. kan du:

  1. Teckensnitt – Ange teckensnittsstil för rubriken (H1).
  2. Vikt - Välj teckensnittsvikt för rubriken (H1).
  3. Storlek – Desktop – Ange teckenstorleken för rubriken (H1) för skrivbordet.
  4. Storlek – Mobil – Ange teckenstorleken för rubriken (H1) för mobil.
  5. Radavstånd - Ange radhöjden för teckensnittet för rubrik (H1) (anges i termer av em).
  6. Teckenavstånd - Ange utrymmet mellan bokstäverna i rubrikens (H1) text (anges i termer av em).

Obs: I likhet med Rubrik (H1) kan du anpassa inställningarna för H2, H3 och H4 teckensnitt.

Textutfyllnad (rubriker)

  • Rubriker – Ange utfyllnad för rubrikerna på din webbplats.

punkterna

Den används för att definiera och strukturera ett textblock som ett stycke. Detta används vanligtvis för beskrivningar, bildtitlar, bildtexter, sidfotstext, etc.

Från här. kan du:

  1. Teckensnitt – Välj typsnittsstil för all stycketext (normal, liten och stor).
  2. Vikt - Välj teckensnittsvikt för all stycketext.
  3. P (Normal) – Desktop – Välj normal teckenstorlek för all stycketext på skrivbordet.
  4. P (Normal) – Mobil – Välj normal teckenstorlek för all stycketext för mobil.
  5. P (liten) – Desktop – Välj den mindre teckenstorleken (mindre än P (Normal)) för all stycketext för skrivbordet.
  6. P (liten) – mobil – Välj den mindre teckenstorleken (mindre än P (Normal)) för all stycketext för mobil.
  7. P (stor) – Desktop – Välj den större teckenstorleken (större än P (Normal)) för all stycketext för skrivbordet.
  8. P (stor) – Mobil – Välj den större teckenstorleken (större än P (Normal)) för all stycketext för mobil.
  9. Radavstånd - Ange radhöjden för teckensnittet för stycketext (anges i termer av em).
  10. Teckenavstånd - Ange utrymmet mellan bokstäverna i stycketexten (anges i termer av em).

Textutfyllnad (stycken)

Paragraf - Ange utfyllnad för styckena på din webbplats.

Knappar

Knappar är element som du kan klicka eller trycka på för att utföra specifika åtgärder, som att skicka ett formulär eller navigera till en annan sida.

Från här. kan du:

  1. Teckensnitt – Du kan välja typsnitt för knapptexten härifrån.
  2. Vikt - Ställ in teckensnittsvikten för knapptexten härifrån. Du kan välja mellan normal, lätt och fet.
  3. Storlek (Large) – Ställ in den stora teckenstorleken för knapparna.
  4. Storlek (Medium) – Ställ in medelstor teckensnittsstorlek för knapparna.
  5. Storlek liten) - Ställ in den lilla teckenstorleken för knapparna.
  6. Teckenavstånd - Ställ in utrymmet mellan bokstäverna i knapptexten härifrån (anges i em).

Detta är texten som visas längst ner på webbplatsen, såsom information om upphovsrätt, ansvarsfriskrivningar etc. Inställningar för sidfotstext låter dig anpassa utseendet på texten i sidfoten på din webbplats.

  1. Teckensnitt – Ange teckensnittsstil för sidfotstexten.
  2. Vikt - Ställ in teckenstorleken för sidfotstexten härifrån. Du kan välja mellan normal, ljus och fet.
  3. Textstorlek – Definiera teckenstorleken för sidfotstexten.
  4. Menystorlek – Ange teckenstorleken för objekt i sidfotsmenyn.
  5. Storlek på webbplatstitel (skrivbord) – Justera storleken på sidfoten på webbplatsens titel när den visas på datorn.
  6. Storlek på webbplatstitel (mobil) – Justera storleken på sidfoten på webbplatsens titel när den visas på mobila enheter.
  7. Teckenavstånd - Ange avståndet mellan bokstäver för sidfotstext (mätt i em).

Diverse

Det här är några andra anpassningar under teckensnittsinställningarna. Från här. kan du:

Detta tillämpas när du väljer att visa bildtitlar vid hovring.

    1. Hover Font – Du kan välja typsnitt för bildtiteltexten när du håller muspekaren härifrån.
    2. Hovervikt – Ställ in teckensnittsvikten för bildrubriken härifrån. Du kan välja mellan normal, lätt och fet.
    3. Hover storlek – Ställ in storleken på bildtiteltexten när du håller muspekaren härifrån.
    4. Teckenavstånd - Ställ in utrymmet mellan bokstäverna i bildtiteltexten härifrån (anges i em).

Återställ anpassade inställningar

Du kan enkelt återställa teckensnittsinställningarna till standard om du har gjort ändringar i teckensnittsuppsättningen genom att redigera den eller om du har anpassat teckensnittsinställningarna från Advanced Edit.

Du kommer att se en modifierad knapp. Håll muspekaren över knappen, den ändras till Återställ. Du kan återställa ändringarna till original härifrån.

Alternativa typsnitt från Google

Här är några alternativa Google-teckensnitt för vissa populära typsnitt:

  • Brandon Grotesque – Josefin Sans
  • Sofia Pro – Poppins
  • Avenir – Lato or Prompt
  • Proxima Nova - montserrat or roboto
  • Proxima Soft – Nunito
  • DIN – Barlow
  • stadga – Källa Serif Pro
  • Helvetica Neue – roboto or Arbeta Sans
  • Whitney – Katamaran or Hind
  • Gotham – montserrat
  • Tisa Serif – PT Serif
  • Museo Slab - Zilla plattan or roboto Slab
  • Optima – Arsenal
  • Skolar – Källa Serif
  • Bokstavsgotik – Fira Mono
  • Segoe UI – Öppna sans
  • Futura – Muli
  • Gibson – Noto sans
  • Zona Pro – Poppins
  • Minion – Crimson Text
  • Mostra Nuova – Josefin Sans
  • Geogrotesk – Armata
  • Baskerville – Libre Baskerville
  • Sentinel – Domine
  • Neuzeit – Hind
  • Miller – Abril Fatface
Taggade:

Hittar du inte det du letar efter?

Ta kontakt med en Pixpa-expert.

Kontakta oss