lehrkraefte:blc:informatik:efi-2023:vectorimages [https://fginfo.ksbg.ch Fachgruppe Informatik der KSBG]

This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong.

====== Vektorgrafik ======
  * Übersicht: Siehe z.B. https://de.wikipedia.org/wiki/Vektorgrafik

===== SVG =====
Minimalbeispiel:

{{lehrkraefte:blc:informatik:efi-2023:hand.svg}}

<code xml>
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100mm" height="100mm" version="1.1" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
  <circle cx="50" cy="50" r="40" fill="#f00" fill-rule="evenodd" />
  <rect x="60" y="60" width="35" height="35" fill="#0f0" fill-rule="evenodd" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/>
  <text x="20" y="50" font-family="'Noto Sans'" font-size="30">
    <tspan x="20" y="50">SVG</tspan>
  </text>
</svg>
</code>

==== Inkscape ====
  * Installieren
  * obiges Beispiel öffnen
  * Als png exportieren, Auflösung 400x400 pixel.
  * png als jpg in Qualitätsstufen 90, 60 und 30 abspeichern. Dateigrössen und Qualität vergleichen.
  * Arbeiten mit Pfaden in Inkscape (meist kubische Bezier-Kurven)

=== Aufgaben ===
  * Kanti-Homepage (Desktop Version): Wappen Kanton St. Gallen. 
    * Vektoriell oder nicht? 
    * Extrahieren, in SVG-Datei speichern (korrekte Header hinzufügen).
    * Mit Inkscape betrachten.
  * Finden Sie online eine SVG-Datei mit dem Kantonswappen
  * Kanti-Homepage, Kanti-Logo unten:
    * Vektoriell oder nicht?
    * Vektorversion erstellen.

===== Vektorschriften =====
  * TTF (ist offenbar eine Programmiersprache!), siehe z.B. https://developer.apple.com/fonts/TrueType-Reference-Manual/
  * OTF, WOF

===== Andere Vektorformate =====
  * PDF (kann aber auch Rastergrafiken enthalten)
  * PostScript (ist auch eine spannende Programmiersprache).
  * Adobe ?Indesign? 


===== Interessante Links =====
  * https://andyfitzsimon.com/posts/small-svg/
  *