Radzenie sobie z wolną stroną internetową jest niezwykle frustrujące. Po pomocy tysiącom czytelników WPBeginner w przyspieszeniu ich witryn, odkryliśmy, że jeden problem pojawia się częściej niż jakikolwiek inny: duże, niezoptymalizowane obrazy.
Wielu właścicieli stron internetowych obawia się, że zmniejszenie rozmiaru ich obrazów sprawi, że będą wyglądać na rozmazane i nieprofesjonalne. Rozumiemy to. Dobra wiadomość jest taka, że nie musisz wybierać między szybko ładującymi się stronami a pięknymi, wysokiej jakości zdjęciami.
Udoskonaliliśmy prosty proces optymalizacji obrazów, który wykorzystujemy na wszystkich naszych stronach internetowych. W tym przewodniku przeprowadzimy Cię przez te dokładne, przyjazne dla początkujących kroki, abyś mógł zmniejszyć rozmiar swoich obrazów bez utraty jakości.
W skrócie: Obrazy są częstą przyczyną wolnych stron internetowych, ale nie musisz rezygnować z jakości na rzecz szybkości. Ten przewodnik pokazuje naszą sprawdzoną metodę optymalizacji obrazów ręcznie przed przesłaniem za pomocą darmowych narzędzi lub automatycznie za pomocą najlepszych wtyczek WordPress. Pomożemy Ci uzyskać szybszy czas ładowania, lepsze SEO i bardziej zadowolonych odwiedzających.
- Co to jest optymalizacja obrazu?
- Jakie są korzyści z optymalizacji obrazów?
- Jak zapisywać i optymalizować obrazy dla wydajności sieci
- Najlepsze narzędzia i programy do optymalizacji obrazów
- Najlepsze wtyczki do optymalizacji obrazów dla WordPressa
- Końcowe przemyślenia i najlepsze praktyki dotyczące optymalizacji obrazu
- Samouczek wideo
- Często zadawane pytania dotyczące optymalizacji obrazów
- Dodatkowe zasoby dotyczące poprawy wydajności WordPressa
1. Czym jest optymalizacja obrazu?
Optymalizacja obrazu to proces zapisywania i dostarczania obrazów w najmniejszym możliwym rozmiarze pliku, bez zmniejszania ogólnej jakości obrazu.
Chociaż proces brzmi skomplikowanie, w dzisiejszych czasach jest całkiem łatwy. Możesz użyć jednego z wielu wtyczek i narzędzi do optymalizacji obrazów, aby automatycznie kompresować obrazy nawet o 80% bez widocznej utraty jakości obrazu.
Oto przykład zoptymalizowanego i niezoptymalizowanego obrazu:
Jak widać, przy odpowiedniej optymalizacji ten sam obraz może być nawet o 80% mniejszy od oryginału, bez utraty jakości. W tym przykładzie obraz jest o 52% mniejszy.
Jak działa optymalizacja obrazu?
Mówiąc prościej, optymalizacja obrazów działa poprzez wykorzystanie technologii kompresji.
Kompresja może być „stratna” lub „bezstratna”.
Kompresja bezstratna zmniejsza ogólny rozmiar pliku bez absolutnej utraty jakości obrazu. W przypadku kompresji stratnej może wystąpić niewielka utrata jakości, ale idealnie nie będzie ona zauważalna dla Twoich odwiedzających.
Co oznacza optymalizacja obrazów?
Mogłeś otrzymać rekomendację optymalizacji obrazów od wsparcia hostingowego WordPress lub narzędzia do testowania prędkości i zastanawiasz się, co musisz zrobić.
Będziesz musiał zmniejszyć rozmiar plików swoich obrazów, optymalizując je do użytku w sieci. Pokażemy Ci, jak to zrobić krok po kroku.
2. Jakie są korzyści z optymalizacji obrazów?
Chociaż optymalizacja obrazów ma wiele zalet, oto najważniejsze, o których powinieneś wiedzieć:
- Szybsza prędkość strony internetowej
- Poprawione rankingi SEO
- Wyższy ogólny wskaźnik konwersji sprzedaży i leadów
- Mniej miejsca na dysku i przepustowości (co może zmniejszyć koszty hostingu i CDN)
- Szybsze kopie zapasowe witryny (co może obniżyć koszty przechowywania kopii zapasowych)
Obrazy są drugim najcięższym elementem strony internetowej po filmach. Według HTTP archive, obrazy stanowią około 1054 KB (40%) wagi przeciętnej strony na komputerze stacjonarnym.
Ponieważ wiemy, że szybkie strony internetowe zajmują wyższe pozycje w wyszukiwarkach (SEO) i mają lepszą konwersję, optymalizacja obrazów jest czymś, co każda strona biznesowa musi zrobić, jeśli chce odnieść sukces online.
Możesz się zastanawiać, jak dużą różnicę może przynieść optymalizacja obrazów.
Podstawowe badanie przeprowadzone przez Strangeloop wykazało, że jednosekundowe opóźnienie w czasie ładowania może kosztować 7% sprzedaży, 11% mniej wyświetleń stron i 16% spadek satysfakcji klienta.
Dziś, gdy Google ściśle egzekwuje Core Web Vitals jako czynnik rankingowy, wpływ powolnych obrazów na SEO i przychody jest jeszcze większy.
Jeśli te powody nie wystarczą, aby przyspieszyć Twoją witrynę, powinieneś wiedzieć, że wyszukiwarki takie jak Google również preferują szybsze ładowanie stron w swoim rankingu SEO.
Oznacza to, że optymalizując obrazy dla sieci, możesz zarówno poprawić szybkość strony internetowej, jak i zwiększyć pozycjonowanie WordPress SEO.
3. Jak zapisywać i optymalizować obrazy pod kątem wydajności sieci
Kluczem do skutecznej optymalizacji obrazów pod kątem wydajności sieci jest znalezienie idealnej równowagi między najmniejszym rozmiarem pliku a akceptowalną jakością obrazu.
Trzy rzeczy, które odgrywają ogromną rolę w optymalizacji obrazu to:
- Format pliku obrazu (JPEG vs. PNG vs. GIF)
- Kompresja (wyższa kompresja = mniejszy rozmiar pliku)
- Wymiary obrazu (wysokość i szerokość)
Wybierając odpowiednią kombinację tych trzech, możesz zmniejszyć rozmiar obrazu nawet o 80%.
Przyjrzyjmy się każdemu z nich bardziej szczegółowo.
Format pliku obrazu
Dla większości właścicieli stron internetowych liczą się tylko trzy formaty plików graficznych: JPEG, PNG i GIF. Wybór odpowiedniego typu pliku odgrywa ważną rolę w optymalizacji obrazu.
Aby uprościć sprawę, używaj formatu JPEG do zdjęć lub obrazów z dużą liczbą kolorów, PNG do prostych lub przezroczystych obrazów, a GIF-y tylko do animowanych obrazów.
Jeśli przesyłasz proste logo lub ikony, możesz również rozważyć użycie SVG (grafiki wektorowej), ponieważ skalują się one doskonale bez utraty jakości.
Dla tych, którzy nie znają różnicy między poszczególnymi typami plików:
- Format obrazu PNG wykorzystuje bezstratną kompresję. Oznacza to, że zmniejsza rozmiar pliku bez utraty jakości, co czyni go doskonałym wyborem dla logo, grafik z dużą ilością tekstu i obrazów, gdzie potrzebujesz ostrych linii i przezroczystości.
- Z drugiej strony, JPEG to skompresowany format pliku, który nieznacznie zmniejsza jakość obrazu, aby zapewnić znacznie mniejszy rozmiar pliku.
- Podczas gdy GIF używa tylko 256 kolorów wraz z bezstratną kompresją, co czyni go najlepszym wyborem dla animowanych obrazów.
Na WPBeginner używamy kombinacji tych formatów.
Jednak wiele nowoczesnych stron internetowych przechodzi obecnie na formaty obrazów nowej generacji, takie jak format WebP i AVIF.
Zarówno WebP, jak i AVIF zapewniają jeszcze lepszą kompresję niż JPEG i PNG (co oznacza znacznie mniejsze pliki) przy doskonałej jakości. Wszystkie nowoczesne przeglądarki internetowe w pełni je obsługują, a wiele z najlepszych wtyczek optymalizacyjnych WordPress może automatycznie konwertować Twoje obrazy do tych formatów, zapewniając ogromny wzrost prędkości.
Więcej informacji na temat formatów obrazów znajdziesz w naszym przewodniku WebP vs. PNG vs. JPEG: jaki jest najlepszy format obrazu dla WordPressa.
Kompresja
Kolejną rzeczą jest kompresja obrazu, która odgrywa ogromną rolę w optymalizacji obrazu.
Dostępne są różne typy i poziomy kompresji obrazu. Ustawienia dla każdego z nich będą się różnić w zależności od używanego narzędzia do kompresji obrazu.
Większość narzędzi do edycji obrazów, takich jak Adobe Photoshop, ON1 Photo, GIMP, Affinity Photo (teraz darmowe jako Affinity Studio) i inne, posiada wbudowane funkcje kompresji obrazów.
- Adobe Photoshop
- ON1 Photo
- GIMP
- Affinity Photo
- i inne
Możesz również zapisywać obrazy normalnie, a następnie użyć narzędzia internetowego, takiego jak TinyPNG lub JPEGmini, dla łatwiejszej kompresji obrazów.
Chociaż wymagają pewnego nakładu pracy ręcznej, te dwie metody pozwalają na kompresję obrazów przed ich przesłaniem do WordPressa, i właśnie to robimy na WPBeginner.
Istnieje również kilka popularnych wtyczek WordPress, takich jak Optimole i EWWW Image Optimizer, które mogą automatycznie kompresować obrazy podczas ich przesyłania.
Jest to wygodne, a wielu początkujących, a nawet duże korporacje, wolą korzystać z tych wtyczek do optymalizacji obrazów.
Wskazówka eksperta: Wiele wtyczek do optymalizacji obrazów oferuje darmową wersję z ograniczeniami (np. rozmiar pliku lub liczba obrazów miesięcznie). W przypadku spójnej, automatycznej optymalizacji na ruchliwej stronie, prawdopodobnie będziesz potrzebować płatnego planu.
Więcej o korzystaniu z wtyczek WordPress będziemy pisać później w artykule.
Wymiary obrazu
Kiedy importujesz zdjęcie prosto z telefonu lub aparatu cyfrowego, często ma ono ogromne wymiary w pikselach (np. 4000 pikseli szerokości) i zorientowaną na druk 'rozdzielczość' 300 DPI.
Oto kluczowa wskazówka dotycząca obrazów internetowych: DPI (kropki na cal) jest przeznaczone wyłącznie do drukowania fizycznych zdjęć. Na stronie internetowej Twój ekran interesuje tylko rzeczywisty wymiar w pikselach (wysokość i szerokość), więc możesz bezpiecznie zignorować ustawienia DPI.
Zmniejszenie wymiarów obrazu do bardziej rozsądnych rozmiarów może znacznie zmniejszyć rozmiar pliku obrazu. Możesz po prostu zmienić rozmiar obrazów za pomocą oprogramowania do edycji obrazów na swoim komputerze.
Na przykład, zrobiliśmy zdjęcie o ogromnych oryginalnych wymiarach 4900 × 3200 pikseli. Oryginalny rozmiar pliku wynosił 1,8 MB.
Wybraliśmy format JPEG dla wyższej kompresji i zmieniliśmy wymiary na 1200×795 pikseli. Rozmiar pliku został zmniejszony do zaledwie 103 KB. To o 94% mniej niż oryginalny rozmiar pliku.
Teraz, gdy znasz trzy ważne czynniki optymalizacji obrazu, przyjrzyjmy się różnym narzędziom do optymalizacji obrazu dla właścicieli stron internetowych.
4. Najlepsze narzędzia i programy do optymalizacji obrazu
Jak wspomnieliśmy wcześniej, większość oprogramowania do edycji obrazów zawiera ustawienia optymalizacji i kompresji obrazów.
Poza oprogramowaniem do edycji obrazu, istnieje również kilka potężnych, darmowych narzędzi do optymalizacji obrazu, których możesz użyć do optymalizacji obrazów dla sieci (za pomocą zaledwie kilku kliknięć).
Zalecamy używanie tych narzędzi do optymalizacji obrazów przed przesłaniem ich do WordPressa, zwłaszcza jeśli jesteś perfekcjonistą.
Ta metoda pomaga zaoszczędzić miejsce na dysku na koncie hostingowym WordPress i gwarantuje najszybszy obraz z najlepszą jakością, ponieważ ręcznie przeglądasz każdy obraz.
Adobe Photoshop
Adobe Photoshop to płatna aplikacja do edycji obrazów, która pozwala eksportować obrazy o mniejszym rozmiarze pliku dla sieci.
Korzystając z okna dialogowego eksportu, możesz wybrać format pliku obrazu (JPG, PNG, GIF), który zapewni najmniejszy rozmiar pliku.
Możesz również zmniejszyć jakość obrazu, kolory i inne opcje, aby jeszcze bardziej zmniejszyć rozmiar pliku.
GIMP
GIMP to darmowa alternatywa dla Adobe Photoshop z otwartym kodem źródłowym. Może być używany do optymalizacji obrazów dla sieci. Wadą jest to, że nie jest tak łatwy w użyciu jak niektóre inne rozwiązania z tej listy.
Najpierw musisz otworzyć obraz w GIMP, a następnie wybrać opcję Plik » Eksportuj jako….
Spowoduje to wyświetlenie okna dialogowego Eksportuj obraz, w którym możesz nadać plikowi nową nazwę. Następnie musisz kliknąć przycisk „Eksportuj”.
Zobaczysz teraz opcje eksportu obrazu. W przypadku plików JPEG możesz użyć suwaka „Jakość”, aby wybrać poziom kompresji i zmniejszyć rozmiar pliku.
Na koniec powinieneś kliknąć przycisk „Eksportuj”, aby zapisać zoptymalizowany plik obrazu.
TinyPNG
TinyPNG to darmowa aplikacja internetowa, która wykorzystuje inteligentną technikę kompresji stratnej do drastycznego zmniejszenia rozmiaru plików PNG i JPEG.
Chociaż standardowe pliki PNG są zazwyczaj bezstratne, TinyPNG zmniejsza liczbę kolorów w obrazie, konwertując go do znacznie mniejszego, stratnego formatu PNG bez zauważalnej różnicy.
Wszystko, co musisz zrobić, to wejść na ich stronę internetową i przesłać swoje obrazy za pomocą prostego przeciągania i upuszczania.
Skompresują obraz i podadzą link do pobrania.
Chociaż wcześniej używaliśmy ich rozszerzenia Adobe Photoshop jako części naszego procesu edycji obrazów, jest ono teraz przestarzałe i nieobsługiwane dla Photoshopa CC 2024 i nowszych wersji. Użytkownicy powinni polegać na narzędziu internetowym lub innych wtyczkach do integracji w aplikacji.
Dla programistów dostępny jest interfejs API do automatycznej konwersji obrazów. Ponadto dla początkujących dostępna jest wtyczka WordPress, która zrobi to za Ciebie.
Porozmawiamy o tym więcej później.
JPEGmini
JPEGmini wykorzystuje potężną technologię kompresji stratnej, która znacząco zmniejsza rozmiar obrazów bez wpływu na ich postrzeganą jakość.
Możesz również porównać jakość oryginalnego obrazu i skompresowanego obrazu, aby zobaczyć samemu.
Możesz używać ich wersji internetowej za darmo lub kupić program na swój komputer. Mają również płatne API do automatyzacji procesu dla Twojego serwera.
ImageOptim
ImageOptim to narzędzie dla systemu Mac, które pozwala kompresować obrazy bez utraty jakości, znajdując najlepsze parametry kompresji i usuwając niepotrzebne profile kolorów.
Alternatywą dla systemu Windows jest Trimage.
5. Najlepsze wtyczki do optymalizacji obrazów dla WordPressa
Wierzymy, że najlepszym sposobem optymalizacji obrazów jest zrobienie tego przed przesłaniem ich do WordPressa.
Jednak jeśli prowadzisz witrynę z wieloma autorami lub potrzebujesz zautomatyzowanego rozwiązania, możesz wypróbować wtyczkę do kompresji obrazów WordPress.
Oto nasza lista najlepszych wtyczek do kompresji obrazów w WordPressie:
- Optimole, popularna wtyczka zespołu stojącego za ThemeIsle
- Optymalizator Obrazów EWWW
- Kompresja obrazów JPEG, PNG i WebP, wtyczka zespołu TinyPNG wspomnianego powyżej
- Imagify, wtyczka popularnego zespołu WP Rocket
- ShortPixel Image Optimizer
- Smush
- reSmush.it
- Envira Gallery to fantastyczna wtyczka galerii WordPress, która oferuje potężny dodatek Image Compression Addon (dostępny w płatnych planach), aby automatycznie optymalizować obrazy w galerii.
Te wtyczki do optymalizacji obrazów WordPress pomogą Ci przyspieszyć Twoją stronę internetową.
6. Końcowe przemyślenia i najlepsze praktyki dotyczące optymalizacji obrazów
Optymalizacja obrazów to jeden z najłatwiejszych i najbardziej wpływowych sposobów na przyspieszenie działania witryny. Zmniejszając rozmiary plików bez poświęcania jakości, zapewnisz lepsze wrażenia użytkownikom i zwiększysz swoje rankingi SEO.
Powinieneś również upewnić się, że Twój motyw obsługuje responsywne obrazy. Na szczęście WordPress automatycznie tworzy kilka rozmiarów każdego obrazu przesłanego do biblioteki mediów, aby zapewnić najlepsze dopasowanie do ekranów mobilnych i stacjonarnych.
Poza optymalizacją obrazów, dwie rzeczy, które znacząco pomogą Ci przyspieszyć działanie Twojej witryny, to użycie wtyczki do buforowania WordPress i użycie CDN WordPress.
W WPBeginner używamy WP Rocket, ponieważ łączy on w sobie zarówno potężne funkcje buforowania, jak i optymalizacji obrazów.
Obejmuje to lenistwo ładowania (co oznacza, że obrazy ładują się tylko wtedy, gdy odwiedzający przewija w dół do nich) i obsługę WebP, wszystko w jednym rozwiązaniu.
Wskazówka eksperta: Jeśli używasz kompleksowej wtyczki wydajności, takiej jak WP Rocket, która zawiera optymalizację obrazów (taką jak lenistwo ładowania i konwersja WebP), unikaj instalowania oddzielnej, dedykowanej wtyczki do optymalizacji obrazów. Uruchamianie dwóch wtyczek wykonujących tę samą funkcję może powodować konflikty lub spowalniać witrynę.
Jeśli używasz wtyczki Envira Gallery, polecamy również ich usługę Envira CDN.
Jest to CDN specyficzny dla obrazów, który sprawia, że galerie zdjęć ładują się niezwykle szybko bez złożoności tradycyjnej konfiguracji CDN.
Alternatywnie, możesz skorzystać z firmy hostingowej zarządzany hosting WordPress, ponieważ często oferują oni zarówno buforowanie, jak i CDN jako część platformy.
Samouczek wideo
Często zadawane pytania dotyczące optymalizacji obrazów
Przez lata pomagania użytkownikom w poprawie szybkości ich stron internetowych, odpowiedzieliśmy na wiele pytań dotyczących optymalizacji obrazów. Oto odpowiedzi na niektóre z najczęstszych z nich.
1. Jaki jest najlepszy format obrazu dla sieci?
Zależy to od typu obrazu. W przypadku fotografii z dużą ilością kolorów, JPEG jest zazwyczaj najlepszym wyborem. W przypadku prostych grafik, logo lub obrazów wymagających przezroczystego tła, idealny jest PNG. GIF-y powinny być używane tylko do animacji. Nowszy format WebP jest również doskonałą opcją, która zapewnia świetną jakość przy małych rozmiarach plików.
2. Czy optymalizacja obrazów zmniejsza ich jakość?
Nie zawsze. Kompresja „bezstratna” zmniejsza rozmiar plików bez utraty jakości. Nawet w przypadku kompresji „stratnej”, celem jest znalezienie równowagi, w której rozmiar pliku jest drastycznie zmniejszony, ale wszelkie zmiany jakości są praktycznie niewidoczne dla ludzkiego oka.
3. Jaki jest dobry rozmiar pliku dla obrazów internetowych?
Nie ma jednego idealnego rozmiaru, ale świetnym celem dla większości obrazów jest poniżej 150 KB. W przypadku dużych obrazów na całą szerokość, można zwiększyć do 500 KB. Głównym celem jest zawsze uzyskanie jak najmniejszego pliku przy jednoczesnym zachowaniu ostrości i przejrzystości obrazu na Twojej stronie.
4. Jak optymalizacja obrazów poprawia SEO?
Wyszukiwarki takie jak Google używają szybkości strony jako czynnika rankingowego. Ponieważ obrazy są często największymi plikami na stronie, ich optymalizacja sprawia, że Twoja witryna ładuje się szybciej. Ta poprawa szybkości może prowadzić do lepszych rankingów SEO i lepszego doświadczenia dla Twoich odwiedzających.
5. Czy mogę zoptymalizować obrazy już przesłane do WordPressa?
Tak. Większość wtyczek do optymalizacji obrazów dla WordPressa zawiera funkcję „optymalizacji masowej”. To narzędzie może przeskanować całą Twoją bibliotekę multimediów i skompresować wszystkie istniejące obrazy, co jest idealne do poprawy szybkości istniejącej witryny.
Uwaga: Zawsze wykonaj kompletną kopię zapasową WordPress przed uruchomieniem masowej optymalizacji. Niektóre wtyczki nadpisują oryginalne pliki, więc posiadanie kopii zapasowej zapewnia łatwe przywrócenie multimediów, jeśli nie będziesz zadowolony z jakości obrazu po kompresji.
6. Jaka jest różnica między DPI a pikselami w przypadku obrazów internetowych?
DPI (dots per inch) to termin drukarski i nie wpływa na wygląd obrazów w Internecie. W przypadku obrazów internetowych liczą się tylko wymiary w pikselach (wysokość i szerokość). Skup się na zmniejszeniu wymiarów w pikselach, aby uzyskać mniejsze rozmiary plików, a nie DPI.
7. Czy lepiej optymalizować obrazy ręcznie, czy używać wtyczki?
Ręczna optymalizacja obrazów przed przesłaniem daje największą kontrolę nad jakością i rozmiarem pliku. Jednak jeśli masz witrynę z wieloma autorami lub chcesz pełnej automatyzacji, wtyczka do optymalizacji obrazów WordPress jest wygodnym i skutecznym rozwiązaniem. Często używamy kombinacji obu metod na WPBeginner.
Dodatkowe zasoby dotyczące poprawy wydajności WordPressa
Mamy nadzieję, że ten artykuł pomógł Ci dowiedzieć się, jak optymalizować obrazy w WordPress. Możesz również zapoznać się z innymi artykułami dotyczącymi poprawy wydajności WordPress:
- Kompleksowy przewodnik po zwiększaniu szybkości i wydajności WordPress
- Jak przyspieszyć wydajność WooCommerce
- Jak odciążyć media WordPress, aby poprawić szybkość witryny
- Najlepsze wtyczki buforujące WordPress do przyspieszenia Twojej witryny
- Jak zoptymalizować Core Web Vitals dla WordPress (kompletny przewodnik)
- Jak zmniejszyć czas do pierwszego bajtu (TTFB) w WordPress – Porady ekspertów
- Jak używać wtyczki GTmetrix do poprawy wydajności witryny WordPress
- Najszybszy hosting WordPress (testy wydajności)
- Ważne metryki do zmierzenia na Twojej witrynie WordPress
- Jak prawidłowo przeprowadzić test prędkości strony internetowej
- Jak przeprowadzić test obciążeniowy strony WordPress
Jeśli podobał Ci się ten artykuł, zasubskrybuj nasz kanał YouTube po samouczki wideo WordPress. Możesz nas również znaleźć na Twitterze i Facebooku.
Dennis Muthomi
Cóż, ja ZAWSZE konwertuję wszystkie moje obrazy do formatu .webp przed przesłaniem ich na moją stronę WordPress.
Zdecydowałem się używać .webp zamiast JPEG i PNG, ponieważ zapewnia znacznie lepszą kompresję bezstratną, pozwalając na znaczące zmniejszenie rozmiaru pliku bez wpływu na jakość obrazu.
Jiří Vaněk
Kiedyś robiłem to samo. Najpierw konwertowałem wszystkie obrazy do formatu webp, a następnie przesyłałem je przez FTP. W ten sposób na stronie nie miałem żadnego innego formatu poza webp. Później jednak dowiedziałem się, że nie jest to dobra praktyka, ponieważ nadal istnieją starsze typy przeglądarek, których niektórzy użytkownicy mogą używać i które nie obsługują formatu webp. Jeśli taki użytkownik odwiedzi Twoją stronę, obrazy się nie wyświetlą. Od tego czasu używam wtyczki. Przesyłam obrazy w formacie png, a wtyczka konwertuje je do formatu webp. Zapewnia to obecność obu formatów na stronie, a dla starszych przeglądarek do wyświetlania zostanie użyty kompatybilny obraz png.
Samuel
Wow, dzięki za podzielenie się tym wglądem w Twoją metodę. To mogło zostać łatwo przeoczone i wezmę to pod uwagę podczas pracy z obrazami dla moich stron internetowych.
Jiří Vaněk
Dziękuję za tutorial. Osobiście konwertowałem obrazy do formatu .webp, a następnie przesyłałem je do sieci w tym formacie. Ten format wydaje mi się najmniejszy pod względem objętości danych, a jednocześnie nadal bardzo wysokiej jakości dla dobrego doświadczenia użytkownika. Nie używam do tego wtyczek, ale zazwyczaj konwertuję obrazy za pomocą konwerterów online lub oprogramowania komputerowego.
Komentarze WPBeginner
Format .webp może być również dobrym formatem obrazu do użycia ze względu na jego mały rozmiar pliku. Mamy przewodnik po tym, jak używać .webp tutaj, w tym kilka przydatnych wtyczek do konwersji obrazów do formatu .webp: https://014.leahstevensyj.workers.dev/wp-tutorials/how-to-use-webp-images-in-wordpress/
Konwersja za pomocą wtyczki może być przydatna, ponieważ może konwertować bezpośrednio na stronie internetowej i masowo.
Jiří Vaněk
Ale jeśli użyję wtyczki, czy nie zajmie ona zbyt dużo miejsca na moim FTP, ponieważ oryginalny plik też tam będzie? Ale na pewno chętnie zapoznam się z Twoimi instrukcjami. Dziękuję za link.
Komentarze WPBeginner
Zawsze możesz usunąć oryginalne pliki. Możesz użyć funkcji wyszukiwania na stronie administracyjnej Mediów, aby wyszukać typy plików, takie jak rozszerzenia .png lub .jpg/.jpeg.
Mrteesurez
To jest kompleksowy przewodnik.
Optymalizacja obrazów jest niezbędna, aby zapewnić szybkie ładowanie strony internetowej i dostarczanie treści.
Cytowałeś, że obrazy są drugim najcięższym elementem po wideo, a co z audio, czy audio jest lżejsze od obrazów i dlaczego?
Komentarze WPBeginner
Dźwięk zazwyczaj znajdowałby się między obrazami a wideo. Biorąc pod uwagę ilość dźwięku i typ pliku audio, nie jest to ścisła zasada i zależy od konkretnych plików.
Mrteesurez
Dziękuję za odpowiedź, chodzi o to, że kiedyś widziałem pliki audio większe pod względem rozmiaru niż obrazy, większość obrazów jest w kilobajtach, podczas gdy audio jest zazwyczaj więcej, myślę, że czas trwania odtwarzania dźwięku i dostarczenia znaczącego przekazu również przyczynia się do jego rozmiaru.
Michelle N
Chciałbym powiedzieć, że to było niezwykle pomocne, łatwe do przyswojenia i wdrożenia. Doceniam wszystkie dostarczone narzędzia. Dziękuję!
– od początkującego blogera
Wsparcie WPBeginner
Cieszymy się, że nasz przewodnik był pomocny
Administrator
mohadese esmaeeli
Przy okazji, mam jeszcze jedno pytanie: czy podczas korzystania z wtyczek do optymalizacji obrazów i optymalizacji wcześniej przesłanych obrazów, nowe obrazy zastępują stare? Czy oryginalne obrazy pozostają w bibliotece multimediów WordPress, a zoptymalizowane obrazy są obok nich?
Wsparcie WPBeginner
Zależałoby to od konkretnej wtyczki, której używasz, ponieważ niektóre zastąpią obraz, podczas gdy inne będą miały opcję zachowania oryginału.
Administrator
Jiří Vaněk
Wiele z nich daje ci wybór, czy chcesz zachować oryginalne obrazy, czy je usunąć. Z osobistego doświadczenia polecam zachowanie oryginalnych obrazów na stronie internetowej (przynajmniej jako kopii zapasowej).
mohadese esmaeeli
Witaj,
Pozdrowienia dla Ciebie. Ten artykuł wydaje się być dość wyczerpujący. Zapoznałem się z Twoją stroną kilka dni temu i zacząłem czytać artykuły. Zdecydowałem się wdrożyć ten sam proces na mojej stronie, czytając te artykuły.
Szybko dotarłem do punktu 2, skupiając się na szybkości strony. Szczerze mówiąc, pracuję nad moją stroną od zaledwie kilku dni i udało mi się osiągnąć tylko 10% wzrost szybkości strony.
Wsparcie WPBeginner
Postęp to wciąż postęp, cieszymy się, że nasz przewodnik jest pomocny
Administrator
mohadese esmaeeli
Tak, dokładnie tak. W tym ogromnym i konkurencyjnym świecie zwycięzcami będą ci, którzy stale ulepszają swoje strony internetowe i oferują coś więcej niż ich konkurenci. W przeciwnym razie będziemy przegranymi.
Moinuddin Waheed
Optymalizacja obrazów dla stron internetowych lub blogów jest bardzo ważna dla szybkości strony.
Duże rozmiary obrazów zajmują czas na ładowanie i powodują spowolnienie strony.
Używałem niektórych wtyczek do optymalizacji obrazów.
Ale myślę, że najlepszą opcją jest użycie wtyczek do buforowania i sieci CDN dla stron internetowych.
Pozwala to nie tylko na szybkie działanie strony, ale także pomaga w utrzymaniu odwiedzających.
Wsparcie WPBeginner
Sieci CDN są zazwyczaj dla szybkości, a nie retencji, ale szybko ładująca się strona pomaga zatrzymać odwiedzających i sprawia, że chcą oni wracać
Administrator
Lewis
Przede wszystkim ważne jest, aby zauważyć, że nie wszystkie typy plików graficznych są sobie równe. Na przykład pliki JPEG będą zazwyczaj znacznie mniejsze od plików PNG, dlatego ważne jest, aby wybrać odpowiedni typ pliku do danego zadania.
Dodatkowo, jeśli chodzi o zmianę rozmiaru obrazów, zawsze należy to robić przed przesłaniem ich do witryny. W ten sposób można uniknąć serwowania odwiedzającym zbyt dużych obrazów, co może spowolnić działanie witryny.
Na koniec chciałem zaznaczyć, że dostępnych jest wiele wtyczek, które mogą pomóc zautomatyzować proces optymalizacji obrazów. WP Smush to świetna opcja, która może pomóc zaoszczędzić czas i zapewnić, że Twoje obrazy są zawsze odpowiednio zoptymalizowane.
Wsparcie WPBeginner
Dziękujemy za podzielenie się swoim komentarzem
Administrator
Rebecca Gelsi
To jest genialne, dziękuję. Używam JPEGmini po przeczytaniu tego artykułu i jestem bardzo zadowolony, że ten aspekt naszej strony jest już uporządkowany.
Andy
Dziękuję za normalne i proste wyjaśnienie. Popełniłem kilka błędów z treścią zdjęć na mojej stronie, ale dzięki twoim wyjaśnieniom dowiedziałem się dokładnie, co muszę zrobić. Dziękuję!
Wsparcie WPBeginner
Cieszymy się, że nasz przewodnik był pomocny
Administrator
Tania
Bardzo pomocne!! Dziękuję za udostępnienie. Szybkie pytanie – jeśli skompresuję moje obrazy do optymalnego/akceptowalnego rozmiaru w KB bezpośrednio w Photoshopie, używając ustawienia „Zapisz dla sieci” wspomnianego powyżej, a następnie prześlę je do WordPressa… czy jest potrzeba, aby uruchomić również Shortpixel lub inną wtyczkę do kompresji obrazów? Czy to nie jest zbędne?
Próbuję zrozumieć, czy istnieją dodatkowe korzyści z używania wtyczki w porównaniu do Photoshopa. Chętnie poznam Twoje zdanie. Dziękuję!
Wsparcie WPBeginner
Wtyczki są alternatywą, jeśli zoptymalizujesz swoje obrazy przed ich przesłaniem, nie będziesz potrzebować wtyczki do optymalizacji obrazów
Administrator
Shiv Raj Bhatt
Świetny pomysł na optymalizację obrazów dla szybszego ładowania strony. Dzięki za informacje.
Wsparcie WPBeginner
Cieszymy się, że podoba Ci się nasza zawartość
Administrator
Lauren
Doskonale i wyczerpująco! Dziękuję!
Wsparcie WPBeginner
Cieszymy się, że nasz przewodnik był pomocny
Administrator
Eddier Naranjo
Wtyczki optymalizujące tworzą kopię „ciężkiego” obrazu i serwują zoptymalizowaną wersję. Ale to zwiększa przestrzeń dyskową na stronie.
Czy jest sposób, aby usunąć starą wersję i pozostawić tylko zoptymalizowany obraz?
Wsparcie WPBeginner
Zalecamy skontaktowanie się z pomocą techniczną używanej wtyczki, ponieważ zazwyczaj mają oni opcję usunięcia nieoptymalizowanej wersji.
Administrator