Wie kann ich meine Grafiken für meine Website optimieren?

Haben Sie eine klare Vorstellung von der Zielsetzung dieser Bilder?

Das tun Sie wahrscheinlich, aber Sie treffen keine guten Entscheidungen.

1) Verwenden Sie SVG. Diese sind skalierbar, zoombar. Sie behalten das ursprüngliche Detail bei, wenn Sie sie zoomen.

2) Exportieren Sie die Originale mit höherer Auflösung. Wenn Sie möchten, dass sie irgendwie in Ihre Webseite passen, verwenden Sie diese als Miniaturansicht und auf einen Klick zeigen Sie die hochauflösenden Bilder. Das kann jede Lightbox-Galerie.

3) Wenn Sie sie drucken möchten, fügen Sie eine PDF-Datei mit hoher Auflösung oder im Vektorformat bei.

4) Wenn dies das Einzige ist, was Sie haben, verwenden Sie png 24 und wenden Sie etwas Schärfen an. Sie können versuchen, den Kontrast etwas zu erhöhen, indem Sie mit den Ebenen spielen, hauptsächlich auf der dunklen Seite.

5) Wenn dies alles ist, was Sie haben, aber Sie noch hochauflösende Dateien benötigen ... Erstellen Sie die Diagramme erneut.

Es ist wichtig, sich über etwas im Klaren zu sein. Wenn Ihr Kunde ein gewisses Maß an Qualität benötigt, muss er die Ressourcen bereitstellen, um dies zu erreichen. Entweder stellt er die Quelldateien zur Verfügung oder er zahlt Ihnen mehr, um dieses zusätzliche Grafikmaterial zu erstellen.

Lassen Sie mich gemäß Ihrem Kommentar einige Optionen hinzufügen.

6) Ich bin mit dem Visio-Programm nicht vertraut, aber es besteht die Möglichkeit, einige Exporteinstellungen zu haben, also versuchen Sie, sie zu ändern, um eine bessere Auflösung zu erhalten.

7) Wenn solche Einstellungen nicht vorhanden sind, können Sie eine Bildschirmaufnahme machen. Verwenden Sie einen hochauflösenden Monitor. Am Ende sind die Bilder auf dem Bildschirm zu sehen, damit Sie die gleiche Auflösung haben, die Sie zum Anzeigen benötigen.

8) Eine andere Möglichkeit ist, sie in eine Datei zu drucken. Versuchen Sie, einen virtuellen Drucker wie Pdf Creator www.pdfforge.org zu verwenden . Seien Sie vorsichtig bei der Installation, da es sich um eine kostenlose Software handelt, die manchmal versucht, einige Browserleisten oder andere Arten von Werbesoftware zu installieren.

Sie können die Druckausgabe wählen und die Auflösung konfigurieren. Wenn Sie eine Bitmap-Datei wie PNG wählen, wird ein Bild ohne Alias ​​erzeugt. Exportieren Sie einfach in der doppelten Größe, die Sie benötigen, und skalieren Sie in Photowhatever bei halber Auflösung mit einer Interpolationsmethode wie bikubisch neu.

Das größte Problem, das Sie haben, ist Ihr Text, der gealiased und viel zu klein ist, um korrekt wiedergegeben zu werden. Wenn es sich um einen Live-Text in Photoshop handelt, deaktivieren Sie das Text-Aliasing für bestimmte Textebenen, erhöhen Sie die Schriftgröße und exportieren Sie dann erneut.

Wenn es um Photoshop geht, das von Visio abgeflacht ist, erhöhen Sie die Schriftgröße in Visio. Die Diagrammskalierung kann angepasst werden, um eine größere Schriftgröße aufzunehmen.

Empfehlungen für Optimierungen:

1.- Bild PNG im SVG-Format

2 .- html :<img src='image.svg'>

2.- CSS (Verhältnis beibehalten):img {max-width: 100%;max-height: 100%;}

3.- Verwenden Sie Meta-Tags für Mobilgeräte: <meta content='width=device-width, initial-scale=1' name='viewport'/>in HTML-Head-Tags, um Bildverzerrungen zu vermeiden