Photoshop-Tutorial: Optimieren Sie Bilder für die Webnutzung

Web-Image-Optimierung

Abhängig vom Zweck von Unsere Fotos erfordern die eine oder andere Behandlung. Es ist nicht dasselbe, ein Foto zu konfigurieren, das gedruckt, auf einem digitalen Projektor angezeigt oder auf einer Webseite angezeigt wird. Jedes Medium hat unterschiedliche Mängel, Eigenschaften oder Bedürfnisse. Aus diesem Grund ist es notwendig, dass wir diesen Aspekten besondere Aufmerksamkeit schenken, da wir sonst die Qualität unserer Kompositionen indirekt und ohne es zu wissen verringern könnten.

In diesem Fall sehen wir im folgenden Tutorial die Einstellungen, die Adobe Photoshop bietet, um unsere Bilder so zu speichern, dass sie optimal auf Webseiten und im Internet reproduziert werden können. Auf diese Weise Wir werden versuchen, die billigste Option zu finden Unter Berücksichtigung von Aspekten wie Qualität (Schneiden und Pixelierung) und andererseits der Größe der Datei wissen Sie bereits, dass beim Hochladen von Fotos oder Dateien auf unsere Website diese so wenig wie möglich wiegen sollten, damit der Vorgang ausgeführt wird unserer Website ist viel agiler. Es ist interessant, dass Sie diese grundlegenden Optionen berücksichtigen. Sie wissen bereits, dass wir versuchen müssen, uns um alle Details zu kümmern, die uns zur Verfügung stehen.

JPEG-Bildoptimierung

Zunächst starten wir unsere Anwendung und importieren das Foto, mit dem wir arbeiten werden, in diesem Fall ein mittleres Bild und im JPEG-Format.

Optimierung-1

Um dieses Foto mit geeigneten Eigenschaften für die Arbeit im Web zu speichern, müssen wir zum Menü Datei> Für Web speichern… gehen (wir können diese Option auch über Alt + Umschalt + Strg + S aufrufen).

Optimierung-2

Wir werden auf die Registerkarte "Vier Kopien" oben im Dialogfeld "Für Web speichern" klicken. Wenn wir uns die vier verschiedenen Einstellungen in der Datei ansehen, können wir eine gute Vorstellung davon bekommen, welche Einstellung für unsere Zwecke am besten geeignet ist. Mit den 4 Kopien können mehrere Versionen eines Bildes im selben Bildfenster angezeigt werden. Wir werden das tun, wir werden verschiedene Formate anwenden und wir werden sehen, welches von ihnen am besten zu unseren Ansprüchen passt. Anschließend können Sie die Optimierungszuordnungen für jede Version des Bildes anpassen, um die beste Kombination von Zuordnungen auszuwählen.

Optimierung-3

Über das Dropdown-Menü Zoomstufe unten links im Dialogfeld ändern wir die Vergrößerung auf 200% oder mehr, damit wir unser Foto gut analysieren und die Details des Bildes erkennen können.

Optimierung-4

Wir platzieren den Mauszeiger über der oberen rechten Version des Bildes (dies ist die aktive Version, wie der dunkelste Rand anzeigt). Der Cursor hat die Form einer Hand, was darauf hinweist, dass wir ihn ziehen können, um das Bild zu verschieben. Wir ziehen, um die Position des Bildes so zu ändern, dass wir den am besten geeigneten Bereich des Bildes finden, in dem wir die meisten Nuancen und Kontraste finden.

Optimierung-5

Im Dropdown-Menü "Voreinstellung" im Bereich "Optimiert" wählen Sie "GIF 128 mit Dither". Beachten Sie, dass sofort in der von uns ausgewählten Version des Bildes (in diesem Fall oben rechts) Änderungen vorgenommen wurden, die die dunkleren Bereiche besser sichtbar machen. Als nächstes sehen wir weiterhin die JPEG- und PNG-Einstellungen in den folgenden Bereichen.

Optimierung-6

Wir werden auf die untere linke Version des Bildes klicken, um es auszuwählen. Wir werden die Low JPEG-Version im Preset-Menü auswählen. Das Bild erscheint ziemlich pixelig und seine Qualität ist nicht akzeptabel, insbesondere im Textbereich ist es sehr auffällig. Wir werden versuchen, die Bildqualität zu verbessern, ohne eine inakzeptable Dateigröße zu erhalten.

Optimierung-7

Wir werden wieder JPEG High aus dem Dropdown-Menü Einstellungen auswählen. Dies verbessert die Bildqualität erheblich, führt aber auch zu einer signifikanten Erhöhung der Dateigröße.

Optimierung-8

Schließlich wird die erfolgreichste Option der Mittelweg sein. Wir werden wieder JPEG-Medien aus dem Dropdown-Menü Voreinstellung auswählen. Die Bildqualität ist jetzt akzeptabel, während die Dateigröße erheblich kleiner ist als die JPEG High-Version oder die GIF-Version.

Optimierung-9

Schließlich werden wir das untere rechte Feld auswählen. Wir werden PNG-8 128 mit Dithering noch einmal aus dem Dropdown-Menü wählen. Obwohl diese Option eine kleinere Dateigröße als das Originalbild bietet, ist die Bildqualität nicht so gut wie bei der JPEG Medium-Version, die auch eine kleinere Dateigröße aufweist.

Optimierung-10

Zum Schluss klicken wir auf die JPEG-Version, also die unten links. Stellen Sie im optimierten Bereich (rechts neben dem Dialogfeld) sicher, dass Progressiv aktiviert ist (dies führt dazu, dass das Bild in mehreren Durchgängen heruntergeladen wird, von denen jeder die Bildqualität erhöht), und klicken Sie auf OK.

Optimierung-11

Schließlich verwenden wir im Dialogfeld Optimiert speichern unter den ursprünglichen Namen und klicken auf Speichern. Auf diese Weise speichern wir eine JPEG-Version der Originaldatei im gewünschten Ordner. Schließlich werden wir dieses Projekt schließen, ohne Änderungen zu speichern.


Hinterlasse einen Kommentar

Ihre E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert mit *

*

*

  1. Verantwortlich für die Daten: Miguel Ángel Gatón
  2. Zweck der Daten: Kontrolle von SPAM, Kommentarverwaltung.
  3. Legitimation: Ihre Zustimmung
  4. Übermittlung der Daten: Die Daten werden nur durch gesetzliche Verpflichtung an Dritte weitergegeben.
  5. Datenspeicherung: Von Occentus Networks (EU) gehostete Datenbank
  6. Rechte: Sie können Ihre Informationen jederzeit einschränken, wiederherstellen und löschen.