Pengoptimuman gambar WordPress: memampatkan saiz, menambahkan tag alt (meningkatkan kelajuan dan SEO)

Gambar merupakan “elemen penting” dalam laman web, namun jika tidak dikelola dengan baik, ia boleh menjadi “beban” yang memperlahankan kelajuan laman web dan juga mengurangkan peluang untuk meningkatkan SEO. Inti pengoptimuman gambar ialah “mengurangkan saiz tanpa menjejaskan kesan visual” dan “membolehkan enjin carian memahami kandungan gambar”, manakalaMengekompresi saiz和Tambahkan tag alt.Ini adalah dua kaedah yang paling asas dan berkesan.

I. Mengapa perlu mengoptimalkan gambar?

Hanya apabila anda memahami kepentingan pengoptimuman, anda akan menganggap langkah ini lebih serius:

• Meningkatkan kelajuan memuat.Gambar yang tidak dioptimalkan akan membuat masa memuat halaman menjadi lebih lama, dan pengunjung mungkin meninggalkan halaman sebelum ia dimuat sepenuhnya (kajian menunjukkan bahawa jika halaman memuat lebih dari 3 saat, 53% pengunjung akan berhenti menunggu).
• Menghemat ruang pelayan.Gambar yang dimampatkan mempunyai saiz yang lebih kecil, yang dapat mengurangkan penggunaan storan pelayan dan penggunaan data (terutama penting untuk pelayan yang mengenakan bayaran berdasarkan penggunaan data).
• Membantu kedudukan SEO.Enjin carian (seperti Baidu, Google) tidak dapat “memahami” gambar secara langsung, tetapi hanya dapat memahami kandungan melalui maklumat teks (seperti tag alt). Mengoptimumkan gambar dapat membantu gambar tersebut mendapat lebih banyak paparan dalam hasil carian.
• Selaras dengan peranti mudah alih.Pengguna telefon mempunyai data terhad, dan gambar-gambar kecil dapat mengurangkan penggunaan data dan meningkatkan pengalaman penggunaan peranti mudah alih.

II. Mengepreskan gambar: Mengurangkan saiz tanpa menjejaskan kualiti imej.

Prinsip mengompres gambar ialah dengan membuang maklumat piksel yang berlebihan dalam gambar (seperti perbezaan warna yang sukar untuk dilihat oleh mata manusia), sekaligus mengurangkan saiz fail sambil mengekalkan kualiti visual. Bagi pemula, disarankan untuk menggunakanPlugin menggepakkan secara automatik.Tanpa perlu pengendalian manual.

Kaedah 1: Menggunakan plugin untuk mengompres secara automatik (disyorkan untuk pemula)

Plugin yang disyorkan: Smush atau ShortPixel (versi percuma sudah cukup)

以 \nSmush Sebagai contoh, langkah-langkahnya adalah seperti berikut:

1. Memasangkan plugin: Latar belakang [Plugin] → [Pasang Plugin] → Cari “Smush” → Klik [Pasang] → [Aktifkan].
2. Tetapan asas:
   • Selepas aktivasi, masuk ke halaman tetapan-tetapan plugin, dan tandai “Mampatkan secara automatik gambar yang baru diunggah” (gambar yang baru diunggah akan dimampatkan secara automatik, tanpa perlu tindakan manual).
   • Klik “Pampasan Pukal”, pilih “Pampasan Semua Gambar” (untuk memampas semua gambar lama yang telah dimuat naik ke pustaka media).
3. Menunggu penyusunan selesai: Plugin akan memaparkan kemajuan penyusunan dan ruang yang dijimatkan (seperti “50 gambar telah disusun, menjimatkan 20MB ruang”).

Kelebihan: Pemprosesan sepenuhnya automatik, menyokong pemampatan berjumlah besar, versi percuma dapat memenuhi keperluan laman web kecil dan sederhana (versi percuma Smush membenarkan gambar tunggal sehingga 5MB, manakala versi percuma ShortPixel membolehkan pemampatan 100 gambar setiap bulan).

Kaedah 2: Mampatkan secara manual sebelum memuat naik (sesuai untuk mencapai pengoptimuman maksimum)

Jika gambar tersebut sangat besar (seperti foto asli yang diambil oleh kamera, yang biasanya berukuran lebih dari 10MB), adalah dinasihatkan untuk mengompresnya secara manual di komputer terlebih dahulu, sebelum memuat naiknya ke laman web:

1. Alat dalam talian(Tanpa perlu memasang perisian):
   • TinyPNG (\ntinypng.com(PNG dan JPG disokong, dengan kadar mampatan tinggi dan kehilangan kualiti gambar yang minimum. Anda boleh memuat naik sehingga 20 gambar dalam satu goresan.)
   • Alat untuk mengompres gambar, menyokong format WebP (saiz 30%-50% lebih kecil daripada JPG).
2. Langkah-langkah operasi：
   • Buka alat → Muat naik gambar → Tunggu pemampatan selesai → Muat turun gambar yang telah dipampatkan → Muat naik ke pustaka media WordPress.

\nSesuai untuk situasi iniUntuk gambar-gambar penting seperti spanduk halaman utama dan gambar utama halaman produk, mengompresnya secara manual membolehkan kawalan kualiti imej yang lebih tepat.

Catatan mengenai pemampatan:

• Gambar biasa (seperti gambar yang disertakan dalam artikel) hendaklah dimampatkan kepada Di bawah 200KB Itu sahaja, gambar utama halaman depan hendaklah berukuran tidak lebih dari Di bawah 1MB。
• Gunakan terlebih dahulu Format WebP.(WordPress 5.8+ menyokongnya secara asli), dan saiznya kira-kira 50% lebih kecil daripada JPG untuk kualiti gambar yang sama.
• Elakkan mengompres secara berlebihan: kadar mampatan yang melebihi 80% boleh menyebabkan gambar kabur, terutama gambar yang mengandungi banyak teks (seperti tangkapan skrin, infografik).

III. Tambahkan tag alt: Biarkan enjin carian “memahami” gambar-gambar itu.

“Tag alt” (“Atribut alt” secara penuh) merupakan “keterangan teks” untuk gambar. Apabila gambar tidak dapat dimuatkan kerana masalah internet, teks ini akan dipaparkan. Lebih penting lagi, enjin carian akan menggunakan teks ini untuk memahami kandungan gambar, yang akan mempengaruhi kedudukan gambar dalam hasil carian.

Mengapa kita mesti menambahkan tag alt?

• Contoh 1: Sebuah gambar “kasut sukan merah”, tanpa tag alt, enjin carian mungkin hanya tahu bahawa ia adalah sebuah gambar; setelah menambahkan tag alt “kasut sukan merah yang ringan dan bernapas”, enjin carian akan mengaitkannya dengan kata-kata carian yang berkaitan dengan “kasut sukan merah”.
• Contoh 2: Apabila gambar tidak dapat dimuat, pelawat akan melihat teks tag alt, yang menunjukkan gambar apa yang sepatutnya berada di sana (bukan ikon kosong atau “Gambar tidak dapat dipaparkan”).

Bagaimana untuk menambahkan tag alt?

Kaedah 1: Tambahkan secara terus semasa memuat naik gambar (disyorkan)

1. Muat naik gambar (sama ada melalui pustaka media atau editor), dan dalam tetingkap tetapan gambar yang muncul, cari kotak input “Teks alternatif” (iaitu tag alt).
2. Masukkan keterangan:
   • Pendek dan tepat (10 - 15 perkataan adalah sesuai), dan ia harus mengandungi kandungan utama gambar (seperti “Meja depan pejabat syarikat” atau “Rupa komputer riba 2023”).
   • Avoid penggunaan kata kunci yang berlebihan (seperti “WordPress, bina laman web, reka bentuk, syarikat” - ia merupakan penerangan yang tidak berkesan).
   • Jika gambar tersebut bersifat dekoratif (seperti garis pemisah, corak latar belakang), anda boleh membiarkannya kosong atau mengisinya dengan “Gambar dekoratif” (untuk mengelakkan mengelirukan enjin carian).
3. Klik “Sisipkan ke dalam artikel”, dan tag alt akan berfungsi secara automatik.

Kaedah 2: Menambah/mengubah suai tag alt untuk gambar yang telah dimuat naik.

1. Masuk ke [Media] → [Perpustakaan], cari gambar yang perlu diubah suai, dan klik gambar tersebut untuk memasuki halaman edit.
2. Masukkan atau ubah kandungan dalam kotak “Teks Alternatif” di sebelah kanan, dan kemudian klik [Kemaskini].

Tag alt lawan Tajuk lawan Keterangan: Jangan keliru!

Banyak pemula akan mengelirukan ketiga-ketiga konsep ini. Berikut adalah perbezaan ringkas:

• Tag alt (teks alternatif)Ini untuk enjin carian dan apabila loading gagal, Ia mempengaruhi SEO, dan wajib diisi.
• Tajuk (Title)TeKS yang dipaparkan apabila tetikus berada di atas gambar (pilihan, sesuai untuk menambahkan butiran, seperti “Klik untuk melihat gambar dalam resolusi tinggi”).
• Keterangan (Caption): Teks yang dipaparkan di bawah gambar (serupa dengan keterangan gambar, seperti “Gambar 1: Tempat Acara Tahunan Syarikat”; isikan mengikut keperluan).

4. Soalan-soalan biasa bagi pemula

1. Adakah semua gambar mesti ditandai dengan tag alt?Hampir semua. Kecuali gambar hiasan (seperti latar belakang berwarna, bingkai), semua gambar yang mengandungi kandungan sebenar (gambar produk, gambar orang, gambar adegan, dll.) perlu ditambahkan. Ini merupakan syarat asas SEO.
2. Apa yang perlu saya lakukan jika gambar menjadi kabur selepas ia dikompres?Kurangkan intensiti pemampatan (kadar pemampatan boleh diselaraskan dalam plugin), atau guna alat pemampatan manual (seperti TinyPNG) untuk memampatkan semula, sambil mengekalkan kualiti imej yang lebih tinggi.
3. Gambar dalam format WebP tidak dipaparkan pada pelayar lama?Semua pelayar moden (Chrome, Edge, Firefox, Safari 14+) menyokong WebP, dan pelayar lama (seperti IE) sudah jarang digunakan, jadi tidak perlu risau. Untuk keserasian, anda boleh memasangkan plugin “WebP Express”, yang akan secara automatik menyediakan versi gantian JPG untuk pelayar lama.
4. Selepas mengoptimumkan gambar, kelajuan laman web tidak berubah?Mungkin terdapat faktor-faktor lain yang berpengaruh (seperti kelajuan pelayan yang perlahan, terlalu banyak plugin), anda boleh menggunakan alat GTmetrix terlebih dahulu untuk menyiasat sama ada “saiz gambar” masih menjadi masalah utama.

Mengoptimumkan gambar adalah satu langkah yang “berharga rendah dan memberi pulangan tinggi”: Menghabiskan 10 minit untuk mengatur plugin dan menambahkan tag alt dapat meningkatkan kelajuan laman web dan prestasi SEO secara signifikan. Memupuk tabiat “memuat naik dan mengoptimumkan” akan membuat laman web anda lebih disukai oleh pelawat dan enjin carian.