Zum Inhalt springen

Bildoptimierung für WordPress auf dem Mac

Optimieren Sie WordPress-Bilder auf dem Mac vor dem Upload: Passen Sie die Größe an die Theme-Bedürfnisse an, wählen Sie JPEG, PNG oder WebP, erhalten Sie die responsive Auslieferung und prüfen Sie die Live-Seite.

Der WordPress-Medien-Upload-Akzeptor nimmt Ihr 6 MB großes PNG-Hero-Bild an, aber die Startseite wirkt dennoch langsam, weil das Theme die volle Datei in src ausgibt und nicht eine skalierte Variante. Die Bildoptimierung für WordPress beginnt vor dem Upload: Passen Sie die Pixelbreite an den Inhaltsbereich Ihres Themes an, wählen Sie JPEG oder WebP und komprimieren Sie lokal, damit die Bibliothek schlanke Quelldateien speichert.

WordPress-Upload-Limits in der Praxis

Hosting-Konfigurationen legen upload_max_filesize und post_max_size fest. Ein einzelnes 10 MB großes Foto wird möglicherweise akzeptiert, während ein Stapel aus zwölf Dateien stillschweigend fehlschlägt oder eine Zeitüberschreitung meldet.

Limit-TypWas Sie spüren
PHP-Upload-CapEinzelne Datei wird über der Schwelle abgelehnt
Gesamt-POST-GrößeMulti-File-Upload schlägt mitten im Stapel fehl
Arbeitsspeicher beim SkalierenFehler bei der serverseitigen Thumbnail-Generierung
CDN-QuotaLangsames Admin-Interface, kein harres Limit

Passen Sie die Quelldateien auf Ihrem Mac an, bevor Sie sie in die Medienbibliothek importieren. Kleinere Dateien laden schneller hoch und reduzieren die Arbeit zur Thumbnail-Generierung auf dem Server. Siehe Bilder auf dem Mac komprimieren für allgemeine Regeln zur Skalierung und Formatwahl.

Empfohlene Formate und Größen

WordPress unterstützt in modernen Installationen JPEG, PNG, GIF und WebP. Themes und Plugins variieren darin, wie sie srcset und moderne Formate ausgeben.

AssetEmpfohlene Vorgehensweise
Hero-Bild (Beitragsbild)JPEG oder WebP bei 2x der Theme-Inhaltsbreite
Inline-Blogfoto1200 bis 1600 px breites JPEG
Logo mit TransparenzPNG nach oxipng oder SVG, wenn das Theme es erlaubt
Galerie-StapelKonsistente Maximalbreite für die gesamte Gruppe

Lesen Sie Verlustbehaftete vs. verlustfreie Komprimierung , bevor Sie jedes Foto als verlustfreies PNG speichern. Fotos gehören nach der Skalierung in das verlustbehaftete JPEG oder WebP.

Wenn Ihr Theme WebP-Unterstützung dokumentiert, konvertieren Sie Hero-Bilder lokal. PNG zu WebP auf dem Mac behandelt den Export aus Design-PNG-Quellen.

Bilder vor dem Upload vorbereiten

Ein wiederholbarer Mac-Workflow:

  1. Notieren Sie die Theme-content_width oder messen Sie die Live-Spalte im Browser-DevTools.
  2. Exportieren Sie aus dem Design in dieser Breite mal zwei für Retina, nicht in der 3x-Arbeitsbrett-Größe.
  3. Skalieren Sie in der Vorschau, falls Exporte überschüssig sind (Werkzeuge → Größe anpassen…).
  4. Exportieren Sie JPEG mit der Qualität 82 bis 85 oder WebP über cwebp.
  5. Laden Sie die optimierte Datei hoch, nicht den 4000 px Master.

Entfernen Sie GPS-EXIF-Daten von Event-Fotos, wenn der Standort nicht veröffentlicht werden soll. Die Metadaten-Entfernung ist getrennt von der Byte-Größe, aber relevant für die Privatsphäre auf öffentlichen Blogs.

Vermeiden Sie das Hochladen von Kamera-HEIC, wenn Autoren auf Windows das Asset nicht wiederverwenden können. Konvertieren Sie zuerst auf Ihrem Mac zu JPEG.

Beitragsbilder und Inhaltsbreite

Beitragsbilder werden oft breiter als Inline-Figuren angezeigt, liegen aber immer noch unter der vollen Kamerauflösung.

WordPress generiert seit Version 4.4 responsive srcset und sizes-Markups. Die Dokumentation zu responsiven Bildern erklärt, wie Zwischengrößen dem Browser ermöglichen, einen geeigneten Kandidaten auszuwählen. Bestätigen Sie, dass das Theme dieses Markup für Beitragsbilder, Karten und benutzerdefinierte Blöcke nutzt, anstatt anzunehmen, dass jedes Bild der Medienbibliothek responsiv ausgeliefert wird.

Theme-LayoutExport-Hinweis
800 px Inhalts-Spalte1600 px Beitragsbild-Breite
Full-Width-Block-Theme1920 bis 2400 px Max, sofern das Design mehr verlangt
Karten-GridKarten-CSS-Breite mal zwei

Generieren Sie Thumbnails erst neu, nachdem Sie die Quelldatei in der Bibliothek ersetzt haben. WordPress behält ältere Größen, bis Plugins sie neu aufbauen. Laden Sie zuerst die korrekte Größe hoch, um oversized -scaled-Zwischendateien zu vermeiden.

Kombinieren Sie dies mit Bilder für das Web auf dem Mac optimieren , wenn dieselben Assets auch eine statische Landingpage außerhalb von WordPress speisen.

Stapelverarbeitung für die Medienbibliothek

Blog-Migrationen und Foto-Essays bedeuten Dutzende von Dateien in einer Sitzung.

mkdir wp-upload
for f in *.jpg; do sips -Z 1920 -s formatOptions 85 "$f" --out "wp-upload/$f"; done

Organisieren Sie originals/ und wp-upload/ separat. Löschen Sie Masters erst, wenn der Beitrag live ist und überprüft wurde.

Online-WordPress-Bildoptimierer senden Dateien an Dritte. Für Entwürfe, embargoerte Screenshots und Kundenarbeiten im Gange, komprimieren Sie lokal. Siehe Sind Online-Dateikomprimierer sicher , was Upload eigentlich bedeutet.

Dokumentieren Sie die Maximalbreite in Ihrer redaktionellen Checkliste, damit Mitwirkende aufhören, Handyfotos in voller Auflösung hochzuladen.

Fügen Sie Alt-Text nach dem Upload hinzu, nicht vor der Komprimierung. Alt-Text beeinflusst die Byte-Größe nicht, aber die Kombination optimierter Dateien mit beschreibendem Alt-Text hält Barrierefreiheits-Prüfungen von Dateigrößen-Prüfungen getrennt.

Wenn ein Plugin WebP auf dem Server generiert, reduziert die lokale WebP-Vorbereitung dennoch die Upload-Zeit und die Admin-seitige Verarbeitungslast bei Massenimporten.

GetCompress nutzen

GetCompress verwaltet gemischte Bildordner auf Ihrem Mac ohne Upload. Nützlich, wenn Redakteure einen Monat an Beiträgen offline vorbereiten.

  • Legen Sie einen Ordner mit Figuren ab und legen Sie Maximalbreite sowie JPEG- oder WebP-Ausgabe für den WordPress-Import fest.
  • Speichern Sie Voreinstellungen (z. B. “WP featured 1920 JPEG q85”), die an Ihre Theme-Maße angepasst sind.
  • Vorschau textlastiger Screenshots vor der Stapelausgabe.
  • Stapelverarbeitung der Bildoptimierung für WordPress auf dem Mac, wenn Foto-Essays mehr als zehn Dateien pro Artikel überschreiten.
  • Konvertieren Sie HEIC-iPhone-Fotos in JPEG in einem Durchgang, bevor Autoren den Admin-Upload-Akzeptor öffnen.

GetCompress ersetzt nicht WordPress-Plugins, die das Frontend-Markup umschreiben. Es bereitet Quellen vor, sodass Plugins und CDNs später weniger optimieren müssen. Die Ordnerüberwachung kann ein to-upload/-Verzeichnis beobachten und neue Exporte komprimieren, wenn das Design wöchentlich Blog-Assets übergibt.

Überprüfen Sie ein Beitragsbild auf dem Mobilgerät nach dem Upload stichprobenartig. Passen Sie die Breite an, bevor Sie die Plugin-Lazy-Load-Einstellungen optimieren.