Adakah anda tidak menyukai imej?

Ia boleh mengubah sekeping teks menjadi pengalaman yang menarik semasa anda membaca. Imej meningkatkan siaran blog, menjadikannya lebih boleh dikongsi dan tetapkan nada serta jenama keseluruhan tapak anda.

Dan anda tahu apa? Kami dilatih untuk bertindak balas terhadap imej. Itulah sebabnya memasukkan imejan ke dalam kandungan anda ialah alat yang berkuasa untuk digunakan semasa memasarkan blog anda.

Tetapi, jika anda tidak berhati-hati, imej boleh menyumbang lebih separuh (atau lebih) daripada jumlah saiz halaman web anda. Hanya beberapa tahun yang lalu, saiz purata halaman web ialah 600–700K. Kini, purata ialah 2MB dan ia meningkat setiap tahun.

Itu sangat besar!

Sebab utama perkara ini berlaku adalah kerana berbilang imej digunakan dengan lebih kerap di halaman web dan imej ini tidak bersaiz dan dioptimumkan dengan betul. Ini bermakna ia tidak disimpan atau disusun dalam cara yang mesra web dan sebaliknya, mengembang halaman anda.

Sebahagian besar daripada kita, bagaimanapun, meninggalkan mengoptimumkan imej sebagai perkara yang difikirkan kemudian dan lebih suka melakukan perkara yang menyeronokkan seperti membuat catatan epik atau menjalin rangkaian dengan blogger lain dalam niche anda.

Tetapi, jika halaman bloat bermakna kelajuan pemuatan halaman anda terjejas. Anda mungkin tidak fikir ini adalah masalah besar jika anda menggunakan sambungan berkelajuan tinggi, tetapi ramai pelawat anda tidak. Selain itu, Google tidak menyukai halaman memuatkan perlahan dan ia boleh menjejaskan SEO anda secara negatif.

Mengapa anda perlu mengoptimumkan imej

Anda bekerja keras dimencipta kandungan cemerlang dan anda menghabiskan berjam-jam mempromosikan blog anda dan menjalin rangkaian dengan blogger lain, jadi perkara terakhir yang anda mahukan ialah pelawat berpotensi meninggalkan tapak web anda sebelum ia dimuatkan!

Kajian menunjukkan bahawa sehingga 40% daripada pelawat mengklik butang kembali jika tapak mengambil masa lebih lama daripada tiga saat untuk dimuatkan.

Saya tahu, tiga saat sebenarnya tidak begitu lama, tetapi apabila anda menggunakan sambungan mudah alih dan anda sedang menunggu tapak untuk dimuatkan, satu saat boleh kelihatan seperti selama-lamanya.

Dan memandangkan ramai pelawat anda mungkin menggunakan sambungan mudah alih yang lebih perlahan, ia menjadi jelas – anda perlu mengurangkan saiz halaman anda. Dan kami sudah tahu apakah pesalah terbesar bagi saiz halaman yang mengembang – ia adalah imej anda.

Imej yang tidak perlu besar juga mengambil ruang pada akaun pengehosan anda. Walaupun sesetengah daripada anda mungkin mempunyai pengehosan dengan ruang storan "tanpa had", banyak penyedia pengehosan premium mengehadkan anda kepada sekitar 10GB storan pada pelan peringkat rendah. Ini boleh diisi dengan cepat, terutamanya jika anda mengehos berbilang tapak dengan imej yang berat pada akaun yang sama.

Jadi, bagaimana anda boleh mengetahui sama ada imej anda memperlahankan tapak anda? Uji kelajuan tapak anda dengan Google PageSpeed ​​Insights.

Jika Google melaporkan imej yang tidak dioptimumkan sebagai masalah, inilah perkara yang anda perlu tahu untuk membetulkannya.

Asas pengoptimuman imej

Apabila datang untuk mengoptimumkan imej pada blog anda, terdapat beberapa perkara berbeza yang anda perlu lakukansedar tentang: jenis fail, saiz dan dimensi imej, cara anda menyampaikan imej anda dan pemampatan imej.

Mari kita lihat dengan lebih dekat setiap kawasan ini.

Jenis fail

Imej di web biasanya disimpan dalam format fail PNG atau JPEG – atau GIF untuk animasi. Siapa yang tidak suka GIF animasi kelakar yang terapung di web!

Kini secara teknikalnya okay jika anda menyimpan imej anda dalam kedua-dua format – penyemak imbas pelawat anda tidak akan menghadapi masalah memaparkan halaman web anda – tetapi untuk kualiti dan pengoptimuman yang terbaik, patuhi peraturan berikut:

• JPEG – gunakan untuk gambar dan reka bentuk tempat orang, tempat atau benda ditampilkan
• PNG – terbaik untuk grafik , logo, reka bentuk berat teks, tangkapan skrin dan apabila anda memerlukan imej dengan latar belakang lutsinar
• GIF – jika anda memerlukan animasi, sebaliknya gunakan PNG

Jadi, mengapa terdapat format yang berbeza ?

Nah, PNG secara tradisinya digunakan untuk menyimpan logo dan grafik kerana ia mengekalkan kualiti imej asal – tiada siapa yang mahukan teks kabur dan bentuk piksel. Tetapi, jika anda cuba menyimpan foto sebagai PNG, ia akan kelihatan hebat, tetapi saiz fail yang terhasil akan menjadi, kurang hebat.

JPEG secara tradisinya digunakan untuk menyimpan foto. Sesetengah data imej dibuang untuk mencipta saiz fail yang lebih kecil secara drastik, tetapi memandangkan foto mengandungi pelbagai jenis warna dan variasi semula jadi, kehilangan kualiti adalahbiasanya tidak dapat dilihat oleh mata manusia.

Kami akan membincangkan lebih terperinci tentang pemampatan kemudian, tetapi buat masa ini jika anda hanya mengingati dua perkara, ingat: JPEG untuk foto dan PNG untuk teks/grafik.

Dimensi imej

Pernahkah anda memuatkan halaman web dan perasan bahawa gambar kecil (mungkin gambar kepala, contohnya) memerlukan f-o-r-e-v-e-r untuk dimuat turun? Seperti, sangat perlahan anda boleh melihat setiap baris masuk? Anda fikir sendiri, bagaimanakah imej sekecil itu boleh mengambil masa yang lama untuk dimuat turun?

Dan apabila ia berlaku kepada imej pengepala yang besar, ia lebih teruk lagi kerana ia boleh menghentikan pemuatan keseluruhan halaman.

Sebab perkara ini berlaku adalah kerana penulis blog tidak mengubah saiz dan mengoptimumkan imej mereka dengan betul, dan dalam kes contoh tangkapan kepala kami, mungkin telah memuat naik JPEG resolusi penuh terus daripada kamera DSLRnya.

Dan itu adalah fail yang besar!

Anda lihat, penyemak imbas web akan (biasanya) menskalakan imej daripada dimensi asalnya supaya ia sesuai dengan tempatnya pada halaman web. Apa yang kelihatan seperti imej kecil pada skrin sebenarnya boleh menjadi foto 10 megapiksel yang besar, dikecilkan dalam masa nyata oleh penyemak imbas.

Kini sesetengah platform penerbitan web secara automatik akan mencipta berbilang variasi imej peleraian penuh anda dalam berbeza saiz, tetapi jika tidak, anda harus mengubah saiz imej anda terlebih dahulu dalam editor imej seperti Photoshop, Lightroom, Pixlr – atau MS Paint. Ia boleh bermakna perbezaanantara fail 50K dan 5MB satu.

WordPress, sebagai contoh, akan secara automatik mencipta tiga (atau lebih, bergantung pada tema anda) salinan imej anda yang dimuat naik – semuanya dengan dimensi berbeza – yang boleh anda gunakan dalam catatan blog, dan bukannya sentiasa menggunakan imej bersaiz penuh.

Jika anda mempunyai tabiat memuat naik imej foto stok yang besar, dan ingin menjimatkan ruang dalam akaun pengehosan anda, pemalam WordPress Imsanity menyokong anda.

Ia mengubah saiz dan menggantikan imej asal kepada sesuatu yang lebih mudah diurus, jadi walaupun anda memasukkan imej bersaiz penuh ke dalam siaran anda, ia tidak akan menjadi teruk.

Setelah diaktifkan, Imsanity juga boleh mencari imej sedia ada anda dan mengubah saiz dengan sewajarnya.

Menyajikan imej anda

Cara anda menyampaikan imej anda kepada pelawat anda bukan semata-mata tentang mengoptimumkannya semata-mata , tetapi ia boleh memberi kesan dramatik pada masa pemuatan halaman anda.

Kebanyakan blogger menyiarkan imej mereka terus dari akaun pengehosan mereka dan itu biasanya baik, tetapi jika anda benar-benar ingin memerah setiap bit prestasi daripada tapak anda, kemudian mengehos imej anda pada Rangkaian Penghantaran Kandungan (CDN) boleh membuat perubahan besar.

CDN terdiri daripada pelayan web yang diletakkan secara strategik yang terletak di pusat data di seluruh dunia. Pelayan ini mengehoskan salinan pendua imej anda dan apabila pelayar pelawat meminta imej daripada tapak web anda, CDN secara automatik mengarahkan pelayar kepelayan yang paling dekat dengan mereka dari segi geografi.

Ini bermakna pelawat dari Eropah, sebagai contoh, akan menerima imej yang disampaikan daripada pelayan Eropah tempatan, dan bukannya satu dari Amerika atau tempat lain. Memandangkan masa tindak balas dan kependaman rangkaian dikurangkan, imej dimuat turun dengan lebih pantas, mengurangkan masa memuatkan halaman.

Wizard Blogging menggunakan Sucuri (ia termasuk Firewall untuk keselamatan serta CDN), tetapi terdapat pembekal kualiti lain seperti Cloudfront Amazon atau KeyCDN. Malah CloudFlare yang popular, yang bukan sahaja CDN, menawarkan CDN secara percuma dan mudah disediakan dalam kebanyakan pakej pengehosan dikongsi.

Mampatan imej

Apabila ia datang untuk mengoptimumkan anda imej, tiada apa yang mengurangkan saiz fail anda lebih daripada pemampatan imej lossy lanjutan.

Kebanyakan alat penyuntingan imej seperti Visme atau Photoshop akan menyimpan fail menggunakan pemampatan JPEG lossy kerana ia mempunyai pengurangan saiz fail yang terbaik. Jadi, sementara kualiti imej berkurangan sedikit, menggunakan pemampatan imej yang hilang mengurangkan imej yang besar kepada saiz mesra web.

Saya pasti ramai yang menggunakan Photoshop mungkin melihat ciri Simpan untuk Web nya sebagai segala-galanya dan akhir-semua pengoptimuman imej. Malah alat pengeditan imej dalam talian seperti PicMonkey atau Visme mengoptimumkan imej anda juga.

Tetapi tahukah anda terdapat alat yang boleh mengambil imej "dioptimumkan" anda daripada Photoshop atau alat pengeditan lain, mengeras dan memampatkannya sebanyak 40% lagi (atau lebih),dan masih adakah ia kelihatan hampir sama dengan mata manusia?

Berikut ialah beberapa alatan percuma dan berbayar untuk membantu anda mengubah imej anda kepada status mesra web.

Alat desktop

ImageAlpha / ImageOptim

Untuk pengguna Mac, ImageOptim ialah alat desktop percuma yang saya gunakan setiap hari untuk mengoptimumkan imej PNG – kebanyakannya tangkapan skrin – sebelum saya memuat naiknya. Alat ini mudah digunakan, anda hanya seret dan lepaskan fail anda, tetapi anda perlu melakukan satu imej pada satu masa.

Petua Pro : Bagi mereka yang mahir teknologi terdapat ImageOptim– CLI, di mana anda boleh mengoptimumkan keseluruhan folder imej sekali gus.

ImageAlpha ialah pemampat PNG lossy dan boleh melakukan keajaiban dalam mengecilkan fail PNG manakala ImageOptim melakukan pemampatan lossless lanjutan (dengan pilihan lossy) – dan ia menanggalkan metadata yang tidak diperlukan daripada fail PNG, JPEG dan GIF.

Untuk imej PNG saya, saya mula-mula menjalankannya melalui ImageAlpha:

Di sini, ia mengurangkan imej tangkapan skrin saya daripada 103K kepada 28K.

Saya kemudian menjalankannya melalui ImageOptim dan menyimpan 10% tambahan.

JPEGmini

Untuk fail JPEG saya, saya mengoptimumkannya dengan apl JPEGmini desktop, tersedia untuk kedua-dua Mac dan Windows.

Versi Lite membolehkan anda mengoptimumkan sehingga 20 imej sehari secara percuma dan kos $19.99 untuk mengalih keluar had.

Petua pro : Pengguna lanjutan yang ingin menyepadukan JPEGmini ke dalam Photoshop atau Lightroom melalui pemalam boleh membeli versi Pro untuk$99.99.

Alat Dalam Talian / Awan / SaaS

TinyPNG

Jika anda sedang mencari alat pemampatan imej dalam talian berkualiti tinggi, TinyPNG (ia mengoptimumkan JPEG fail juga walaupun namanya) ialah apl web yang membolehkan anda menyeret sehingga 20 5MB atau imej yang lebih kecil ke dalam penyemak imbas anda dan memastikannya dioptimumkan sekaligus.

Mereka juga mempunyai API pembangun dan membuat WordPress pemalam tersedia yang boleh mengoptimumkan imej anda secara automatik semasa dimuat naik.

TinyPNG memberi anda 500 pengoptimuman imej percuma setiap bulan, dan selepas itu dicaj daripada $0.002–0.009 setiap imej, bergantung pada volum.

Kini 500 imej setiap bulan mungkin terdengar seperti banyak, tetapi apabila anda menganggap fakta WordPress sering mencipta tiga hingga lima variasi setiap imej dalam saiz yang berbeza, 500 imej tidak kelihatan seperti banyak itu untuk blogger yang prolifik. Nasib baik, kos setiap imej adalah mesra bajet.

EWWW Image Optimizer

Jika anda tidak bersedia untuk membelanjakan wang dan anda tidak mahu diganggu dengan pengoptimuman imej anda secara manual, pemalam Pengoptimum Imej EWWW percuma untuk WordPress boleh mengoptimumkan imej anda yang dimuat naik secara automatik.

Anda boleh memilih langganan premium yang melakukan pemampatan lossy, tetapi versi percuma hanya melakukan pemampatan tanpa kehilangan supaya penjimatan' t hampir sama besar. Ia akan menjimatkan masa anda dan lebih baik daripada tiada.

Nota: Untuk mendapatkan senarai lengkap, lihatsiaran kami tentang alat pemampatan imej.

Menyimpulkannya

Dengan sesetengah orang meramalkan purata saiz halaman web akan menghampiri 3MB menjelang 2017, kini adalah masa untuk mula mengoptimumkan imej anda.

Ingat, bukan semua pelawat anda akan menggunakan sambungan berkelajuan tinggi dan halaman yang melimpah serta masa pemuatan halaman yang perlahan boleh menjejaskan kedudukan anda dengan Google. Untuk membantu anda meringankan beban, boleh dikatakan, biasakan mengoptimumkan imej anda hari ini.

Beri perhatian kepada dimensi imej anda dan ubah saiz mana-mana foto stok yang terlalu besar atau imej daripada kamera digital kepada yang sesuai saiz.

Seterusnya, manfaatkan pemampatan imej moden dengan apl desktop seperti JPEGmini atau alatan awan seperti TinyPNG atau Kraken – menyepadukannya ke dalam WordPress dengan pemalam jika boleh.

Akhir sekali, jika anda platform penerbitan secara automatik mencipta variasi saiz semula imej asal anda, pilih salah satu daripada ini untuk catatan blog anda, bukannya yang asal bersaiz penuh.

Bacaan Berkaitan: 7 Cara Untuk Mengurangkan Saiz Fail PDF.