๐Ÿ‘‰ Menyambungkan WordPress Anda - Cara Simpan Imej Dioptimumkan untuk Web

Panduan Ultimate kepada Strategi Blogging Tamu yang Efektif pada tahun 2018

Adakah anda menyimpan imej yang salah? Kebanyakan pemula tidak tahu cara menyimpan imej dengan betul yang boleh memberi impak besar pada kelajuan laman web. Dalam artikel ini, kami akan menunjukkan kepada anda bagaimana untuk menyimpan imej yang dioptimumkan dengan betul untuk web.

Setiap pakar blog akan memberitahu anda bahawa imej membantu meningkatkan penglibatan. Walau bagaimanapun, apa yang mereka tidak memberitahu anda ialah tidak mengoptimumkan imej untuk web boleh melambatkan laman web anda. Menurut Strangeloop, kelewatan satu saat boleh menyebabkan anda 7% daripada jualan, 11% kurang jumlah paparan, dan 16% penurunan kepuasan pelanggan.

Tutorial Video

Langgan WPBeginner

Sekiranya anda tidak menyukai video atau memerlukan lebih banyak arahan, teruskan membaca.

Bagaimana untuk Simpan Imej dengan Betul?

Apabila menyimpan imej, anda perlu mempertimbangkan dua perkara: format fail imej, dan mampatan. Dengan memilih gabungan yang betul, anda boleh mengurangkan saiz imej anda dengan 5x.

Bagi kebanyakan kita, hanya dua format imej yang penting ialah JPEG dan PNG. Untuk memastikan perkara mudah, gunakan JPEG untuk foto atau imej dengan warna yang banyak, dan gunakan PNG untuk imej yang lebih mudah atau apabila anda memerlukan imej yang telus.

Bagi mereka yang tidak mengetahui perbezaannya, format imej PNG tidak dikompresi yang bermaksud ia adalah imej yang berkualiti tinggi. Kelemahannya adalah bahawa saiz fail adalah lebih besar. Di sisi lain, JPEG adalah format fail dimampatkan yang sedikit mengurangkan kualiti imej untuk memberikan saiz fail yang lebih kecil.

Mengenai WPBeginner, majoriti imej kami adalah JPEG.

Perkara seterusnya adalah mampatan yang bermaksud menggunakan alat untuk menyimpan imej yang dioptimumkan untuk web. Pemampatan boleh membuat perbezaan besar.

Lihat jadual di bawah yang menyoroti beberapa kombinasi yang boleh kami gunakan untuk menyimpan imej Strangeloop yang digunakan dalam artikel ini.

Format ImejSaiz gambar
Photoshop Dioptimumkan JPEG Tinggi33 KB
TinyPNG Dioptimumkan57 KB
JPEG Mini dioptimumkan70 KB
Photoshop Optimized JPEG Max93 KB
Max JPEG Tidak Dioptimumkan119 KB
Photoshop Dioptimumkan PNG135 KB
PNG yang tidak dioptimumkan145 KB

Alat Pemampatan Imej untuk Blogger

Sekarang bahawa anda telah melihat perbezaan setiap jenis pemampatan yang dibuat, di bawah adalah bagaimana anda boleh menyimpan imej yang dioptimumkan dengan betul untuk web dan mempercepatkan laman web anda.

Adobe Photoshop

Adobe Photoshop adalah perisian premium yang dilengkapi dengan ciri untuk menyimpan imej yang dioptimumkan untuk web. Cukup buka imej anda dan klik pada butang Fail> Simpan untuk Web & Peranti.

Ini akan membuka skrin imbasan. Di sebelah kanan, anda boleh menetapkan format imej yang berlainan. Untuk format JPEG, anda akan melihat pilihan kualiti yang berbeza. Apabila anda memilih pilihan anda, ia juga akan menunjukkan saiz fail di bahagian bawah kanan.

Nota: Kami faham bahawa Photoshop agak mahal. GIMP adalah alternatif percuma yang boleh digunakan oleh pengguna. Produk Adobe yang lain seperti Fireworks boleh melakukan pekerjaan itu.

TinyPNG

TinyPNG adalah aplikasi web percuma yang menggunakan teknik pemampatan lossy pintar untuk mengurangkan saiz fail PNG anda. Apa yang anda perlu lakukan ialah pergi ke laman web mereka, dan memuat naik imej anda. Mereka akan memampatkan imej, dan memberi anda pautan muat turun.

Bagi pemaju, mereka juga mempunyai API untuk menukar imej secara automatik.

JPEG Mini

JPEGmini menggunakan teknologi kompresi yang dapat mengurangkan saiz imej tanpa menjejaskan kualiti persepsi mereka. Anda boleh menggunakan versi web mereka secara percuma, atau membeli program untuk komputer anda. Mereka juga mempunyai API berbayar untuk mengautomasikan proses untuk pelayan anda.

ImageOptim

ImageOptim adalah utiliti Mac yang membolehkan anda untuk memampatkan imej tanpa kehilangan apa-apa kualiti dengan mencari parameter mampatan terbaik dan menghapus profil warna yang tidak perlu.

Alternatif Windows untuk ini ialah Trimage.

Seperti yang anda dapat lihat bahawa terdapat beberapa alat yang boleh anda gunakan untuk mengoptimumkan imej untuk web. Apabila menggunakan pemampatan Photoshop, kami melihat keputusan terbaik dalam saiz namun kualiti telah terjejas. TinyPNG adalah pemenang yang jelas untuk menyimpan sebarang jenis PNG di web.

Sesetengah menyarankan bahawa anda boleh menggunakan gabungan TinyPNG atau JPEG Mini dan Imej Optim untuk hasil yang lebih baik. Walau bagaimanapun, menjalankan dua alat yang berasingan untuk memuat naik imej dapat meningkatkan beban kerja anda sedikit.

Pemikiran Akhir mengenai Pengoptimuman Imej

Sekiranya anda tidak menyimpan imej yang dioptimumkan untuk web, mula mula melakukannya sekarang. Ia boleh membuat perbezaan besar pada kelajuan laman web anda, dan pengguna anda akan berterima kasih atasnya. Pasti kualiti imej mungkin berkurang sedikit, tetapi kebanyakan pengguna tidak akan menyedarinya.

Jika anda mencari imej yang berkualiti, lihat panduan kami tentang cara mencari imej percuma royalti untuk catatan blog anda.

Akhir sekali, tetapi tidak semestinya, menggunakan CDN untuk memberikan imej untuk laman WordPress anda dengan ketara dapat mempercepatkan laman web anda. Semak infographic ini untuk melihat apa yang CDN, dan gunakan panduan kami tentang bagaimana untuk menyediakan CDN untuk laman web anda. Kami menggunakan MaxCDN untuk laman web kami.

Kami harap anda dapati artikel ini berguna.

Adakah anda mempunyai kawan blogger yang menyimpan gambar yang salah? Kongsi artikel ini dengan mereka, supaya mereka dapat mempercepatkan laman web mereka. Mereka akan terima kasih.

Sekiranya anda mempunyai sebarang pertanyaan, sila tinggalkan komen di bawah. Juga jangan lupa mengikuti kami di Twitter dan Google+

Tonton video itu: Cara Bermain Clash Royale – Tips, Trik, dan Strategi Untuk Menang

Like this post? Please share to your friends:
Tinggalkan Balasan

;-) :| :x :twisted: :smile: :shock: :sad: :roll: :razz: :oops: :o :mrgreen: :lol: :idea: :grin: :evil: :cry: :cool: :arrow: :???: :?: :!: