Einführung HTML RGB-Farbmodell
Dezimal 255
=
Hexadezimal FF
FFFF00
Einführung HTML Farbwerte im body-Tag
<body bgcolor=„green“> ……….</body>
<body bgcolor=„#008000“> ……….</body>
Zeichen für Zahlzeichen
R G B
Grün Rot
Jede Ziffer hat den Wert 0, 1, 2, ……… 9, A, B, C, D, E, F d.h. 16 Werte mit A=10, B=11, C=12, D=13, E=14, F=15
Blau
Für 1 Farbwert von 16 Mio werden also 3 bytes
Plattenplatz benötigt
Kommt man mit weniger Farben aus (Graustufen=256, Schwarz- Weiß=2) braucht man jeweils
nur 1 byte, bzw. 1 bit u. hat damit kleinere Dateien
Einführung HTML Grafikformate
für + -
JPG JPEG
Fotos,
Webgrafiken
gutes Verhältnis Dateigröße / Qualität
keine Transparenz; hohe Kompression = schlechte Qualität
PNG Fotos,
Webgrafiken
Transparenz; verlustfreie
Speicherung (PNG-24); kleine Dateigrößen
PNG-8: nur 256 Farben
GIF Webgrafiken kleine Dateigrößen; Transparenz;
Animationen möglich
nur 256 Farben
TIF hohe Qualität möglich kann nicht von Browsern
angezeigt werden
BMP große Dateien (meist
keine Kompression)
PSD nur für Photoshop
geeignet
Einführung HTML Bild-Informationen
Einführung HTML
20.01.2015 Sd 23
Bilder mit IrfanView bearbeiten (Menü Bild, Größe ändern)
Einführung HTML
Bilder mit IrfanView bearbeiten
(Ausschnitt mit Maus erstellen, dann Menü Bearbeiten/Freistellen)
Einführung HTML Auflösung / Drucker / Scanner
1. Druckauflösung
2. Pixelanzahl in Spalten und Zeilen 3. Gesamtanzahl der Pixel
dpi = dots per inch
1 inch = 1 Zoll = 2,54 cm
Beim Drucker ist mit Auflösung die Punktdichte gemeint, d.h. die Anzahl der Pixel pro inch (cm)
Üblich 200 – 300 dpi
Einführung HTML Was bedeutet 200 dpi für den Ausdruck?
dpi = dots per inch (Bildpunkte pro inch) 1 inch = 2,54 cm
200 dpi ausreichend für guten Din a 4-Druck 300 dpi Fotodruck
1 inch 2,54 cm 200 dpi 1 cm
78,7 dots
78,7*78,7=6194 dots / Pixel
Was bedeutet jetzt 200 dpi für den Bild- Druck?
Einführung HTML Auflösung / Bildschirm
1. Druckauflösung
2. Pixelanzahl in Spalten und Zeilen 3. Gesamtanzahl der Pixel
z.B. 1680 Pixel
z.B. 1050 Pixel
Beim Bildschirm ist mit Auflösung die Anzahl der Pixel für Breite und Höhe (in cm oder inch (=Zoll) gemeint
Ausreichend 80 ppi
Einführung HTML
Samsung Wave I
Motorola Moto G
apple iPhone4s
480 Pixel 43 mm 1,7‘‘
282ppi
800Pixel 72mm 2,83‘‘
282ppi
720Pixel 56 mm 2,2‘‘
327ppi
1280Pixel 43 mm 3,9‘‘
327ppi
640Pixel 50mm 1,97‘‘
324ppi
960Pixel 75mm 2,95‘‘
325ppi 4,5‘‘
3,3‘‘ 3,3‘‘
Einführung HTML
20.01.2015 Sd 29
Bildschirmauflösung eines PCs
(Windows 7)Auf dem Desktop rechte Maustaste drücken.
Damit ergibt sich diese Maske. Hier auf
Bildschirmauflösung drücken. Damit ergibt sich diese Maske mit der Auflösung dieses Bildschirms
Einführung HTML Auflösung / Kamera
1. Druckauflösung
2. Pixelanzahl in Spalten und Zeilen 3. Gesamtanzahl der Pixel
ppi = pixel per inch
Megapixel =
Wie viele Pixel/Zoll werden aufgenommen?
Bei der Kamera ist mit Auflösung ebenfalls die Punktdichte gemeint, d.h. die Anzahl
der Pixel pro inch (cm), d.h. ppi, aber auch die Bildgröße in MB (Megabytes)