Tiny jpg & tiny png

Would you like to optimize your pngs and jpgs without quality loss?

All I can do is recommend you to use tiny jpg or tiny png.

Go to tinyjpg.com or tinypng.com and judge for yourselves!

Möchtest du deine pngs oder jpgs in der Grösse reduzieren ohne Qualitätsverlust?

Da kann ich dir nur empfehlen tiny jpg oder tiny png zu versuchen.

Klick einfach auf den Link zu tinyjpg.com oder tinypng.com und versuch es selber!

Aber wie funktioniert das ganze?

Wenn man ein 24-Bit PNG (Portable Network Graphics) laden möchte, werden ähnliche Farben kombiniert. Diese Technik nennt sich ““quantization” in Englisch. Nicht nur dass man damit ohne Probleme auf 8-Bit reduzieren kann und unnötige Metadaten eliminiert, die Qualität sieht genau gleich gut aus und lässt sich auf Webseiten schneller laden.

Bei jpgs (Joint Photographic Experts) funktioniert es folgendermassen: wenn man ein JPEG laden möchte, wird das Bild analysiert. Strukturen, Muster und Farben werden automatisch identifiziert. Der Encoder komprimiert das JPEG basierend auf diesen Informationen. Zusätzlich werden auch unnötige Metadaten eliminiert.

Viel Spass mit ausprobieren!

Best regards, Miriam

Illustration by Miriam Selmi Reed for syrup clothing optimized with tinypng.com
Advertisement

Photoshop resolution / Auflösung

Tutorial in English and German / Anleitung in Deutsch und Englisch

Deutsche Version siehe unten!
divider

English version:

TIP OF THE WEEK: How to reduce or enlarge a Photoshop file

Below I show the steps of my job; to prepare my illustration at a 300 dpi resolution, 7 inches wide for Adobe InDesign. Go to MENU > IMAGE > IMAGE SIZE:

reduceImage

In my example I use 7 inches Width, because I will place this image in my InDesign document with this size. In your case, you simply use your desired Width (or Height) and place it into your InDesign document at a 100%. With this method you will retain the 300 dpi resolution for the professional printing press.

divider

Deutsche Version:

TIPP DER WOCHE: Wie man ein Bild in Photoshop vergrössert oder verkleinert.

Unten zeige ich die Arbeitsschritte; wie ich meine Illustration auf 300 dpi ändere und als 15 cm breites Bild für Adobe InDesign vorbereite. Gehen Sie zu MENÜ > BILD > BILDGRÖSSE:

reduceImageD

In meinem Beispiel benutze ich 15 cm Breite, weil ich dieses Bild mit diesen Massen in meinem InDesign Dokument benötige. Benutzen Sie in Ihrem Fall Ihre gewünschten Masse und platzieren Sie es zu 100% Grösse in Ihr InDesign Dokument. Mit dieser Methode werden Sie die 300 dpi für die professionelle Offset-Druckmaschine beibehalten.

Formats and extensions / Formate und Endungen

Info in English and German – Info in Deutsch und Englisch

This is quick guide of file extensions for beginners / Eine Liste der Dateiendungen und ihre Bedeutungen für Anfänger:

.psd = Photoshop (working file with all layers, path and masks / Arbeitsdatei mit allen Ebenen, Pfade und Masken)

.tif = Tagged Image File Format (Often, printers will prefer TIFF files for digital photos / Meistens werden Druckereien TIFF Dateien für digitale Fotos bevorzugen)

.eps = Encapsulated PostScript (Considered the best choice of graphics format for high resolution printing of vector illustrations / Generell eine gute Wahl für Hochresolution-Vektor-Illustrationen im Druck)

.pdf = Portable Document Format (PDF is a file format created by Adobe Systems, Inc. PDF is highly portable across computer platforms and perfect to send to printers. / PDF ist ein Format von Adobe Systems, Inc. PDF ist Plattformübergreifend und ideal um druckfertige Dateien professionell drucken zu lassen)

.svg = Scalable Vector Graphics (SVG files are smaller and easier to compress than other formats. SVG images are zoomable and scalable. Like other graphics, SVG works as a static or animated image. / SVG Dateien sind kleiner und einfacher zu komprimieren als andere Formate. SVG Grafiken sind skalierbar und können sogar animiert werden)

.jpg = Joint Photographic Experts Group, also known as JPEG files (common file format for digital photos used for websites / Wird meistens für digitale Fotos für Webseiten benutzt)

.gif = Graphics Interchange Format (GIF images are ideal for transparency and animation for websites. GIF files are ideal for simple shapes since they are reduced to 256 unique colors. / GIF Bilder sind ideal für Transparenzen und Animationen für Webseiten und sind ideal für Grafiken mit nicht mehr als 256 Farben)

.png = Portable Network Graphic (The PNG format was developed as a replacement for the GIF Format. PNG files offer transparency as well as animation. / Das PNG ersetzt heute vielfach das GIF Format. PNG sind gut für transparente Bilder und Animationen)