Panduan Blogger optimumkan Imej untuk blog

Sekadar perkongsian untuk rakan blogger bagaimana optimumkan imej untuk blog supaya layout blog korang akan lebih ringan, kemas dan tersusun. Tidak rongak, tidak turun naik dan yang penting tidak melambatkan proses loading.  Jangan sesekali upload size yang besar.. huihh.. Memang banyak yang korang kena belajar.

Kesan meletakkan gambar yg bersaiz besar akan membuat korang menyewa space yang lebih besar di hosting provider. Lebih besar lebih banyak RM yang akan dikenakan kepada korang nanti.. Optimumkan imej ini bermaksudkan kecilkan saiz gambar gambar.

Sebaiknya, size setiap imej mestilah tidak lebih dari 100kb… kalau boleh dapat dalam 75kb tapi kalau nampak gambar pecah, boleh up mengikut kesesuian.

Untuk tambahan perkongsian berkenaan imej ini, komposisi  atau susunan yang tidak teratur juga mampu menggugat minat pembaca. Jadi ini  sangat penting untuk semua blogger faham kepentingan imej, tak kiralah atas platform apa yang korang pakai samada wordpress atau blogspot atau apa sahaja.

 

 

contoh featured images yang pelbagai size. Ihsan dr blogger ina dari http://nurimanqhaisara.com/

 

Kenapa penting untuk optimumkan imej untuk blog?

  1. SEO 2019 adalah berkaitan dengan speed loading setiap blog atau website, bukan sekadar content semata mata. Jadi faktor optimize atau optimumkan  imej ini memang satu faktor yang perlu  dititik beratkan setiap kali korang membuat entri blog.
  2. SEO pula akan berkembang kepada  SXO , Search Experience Optimization.  tambahan pula dizaman Mobile kesemua faktor page speed, mobil responsif, content, internal linking dan bounce rate sangat sangat mempengaruhi carian masuk ke dalm blog kita.
  3. Jadi marilah kita pastikan imej yang di upload ke blog kita membawa kebaikan kepada blog dan bukan memudaratkannya lagi.
  4. Pernah tak korang alami macam ni. Kadang kadang korang rasa seperti tidak kena dengan blog, tapi tidak tahu apa puncanya. Sebenarnya faktor imej yang tidak standard juga memberikan impak  ketidakseimbangan kepada layout keseluruhan  blog.

 

Dengan pengalaman bekerja team designer yang ramai maka secara tidak lansung aku paham apa yang diperlukan untuk gambar itu lebih menyerlah dalam sesuatu layout. Kemudian bila masuk dalam dunia blogging baru aku sedar ada pelbagai kategori blogger pula.

Sebelum aku meneruskan perkongsian bagaimana nak optimumkan imej aku nak bawak korang faham sepintas lalu apakah design principles atau prinsip design .Kalau korang faham ini insyallah akan mudah faham seterusnya

Design principles/ Prinsip Design

Bila membina blog bermakna korang juga sedang melakukan kerja kerja design, kerana terdapatnya elemen gambar dan layout yang  menjadi tunggak sesuatu design

  • balance – keseimbangan

  • proximity – jarak

  • alignment – jajaran

  • repetition – pengulangan

  • contrast – kontras

  • space – ruang

 

Jangan cramp design blog dengan imej penuh skrin. pastikan ada breathing space

 

Yang lebih penting kita kena pastikan blog kita akan nampak lebih kemas dan mudah dibaca. Jangan lupa kita adalah manusia, kita perlukan ruang untuk bernafas.

Itulah kepentingan white space.

Pemilihan paragraph align left adalah yang terbaik samada untuk sebarang kerja design untuk printing seperti brochure, leaflet, buku dan ia juga bagus untuk design  digital platform seperti blog. Dengan kata lain apa sahaja yang melibatkan text yang panjang!

Manakala Justify akan membuatkan layout a bit cramp dan penuh. Pemilihan align left ini juga mewujudkan breathing space.

 

Tips Panduan Blogger Untuk optimumkan Imej Blog

  1. Tengok template layout blog yang dipakai, refer sample sedia ada
    Sebarang template yang korang pakai sebenarnya selalunya memberikan sample atau contoh dari size gambar untuk blog tersebut.  Sila click images tersebut dalam media, pastinya korang boleh lihat size dimension yang dipakai.
  2. Image Landscape atau potrait. 
    Lihat cara template tersebut, kalau kebanyakkan landscape tetapkan final output yang akan dipakai adalah landscape. Normally sewaktu design dibuat designer atau developer merekabentuk dalam kesesuaian gambar untuk layout tersebut. Jadi jangan terlebih kreatif sehingga menggangu layout asal
  3. Sewaktu Shooting
    Sewaktu pergambaran produk, scenary atau apa sahaja. Pastikan korang ambil gambar dalam bentuk landscape dan portait. Ambil perbagai gambar yang agak loose dan close up. Pastikan ada head room untuk  sekiranya ada orang dalam gambar tersebut.
  4. Proses editing
    Gambar yang diambil mestilah melalui proses editing, jangan sesekali up gambar dari phone ke dalam platform blog. Sizenya nanti ya ampun! mengaumlaaa. Tambah sekarang banyak phone mampu menghasilkan resolution yang besar.  akan kongsikan proses untuk editing. Dengan kata lain korang perlu mengubah saiz imej anda terlebih dahulu dalam editor imej seperti Photoshop, Lightroom, Pixlr – atau juga MS Paint, ataupun online tools
  5. Setkan Size
    Sebaiknya setkan size untuk gambar yang akan dipakai. size yang dimasukkan disini adalah dimension width x height dalam pixel format. Standardize kan untuk kesemua gambar
  6. Setkan template – standardisekan size
    Cara paling senang dan cepat, sekirannya pengguna photoshop siapkan satu file untuk proses editing. Drag gambar tersebut dalam size yang ditentukan. Kesemua gambar akan lebih seragam
  7. Watermark
    Untuk mengelak gambar dicuri, pastikan korang letakkan watermark. Pengguna psd boleh setkan satu layer khas untuk watermark.

 

Perbezaan layout untuk gambar yang diambil secara potrait dan landscape

 

Imej di atas menunjukkan perbezaan gambar yang diletakkan dalam format potrait vs landscape dalam mobil atau handphone.  Imej yang diletakkan dalam bentuk potrait telah mengambil space yang banyak berbanding landscape.  Screen shot diatas diambil dari Iphone X yang mempunya keluasan skrin yang luas.

Jadi, cuba bayangkan bagaimanakah pula kalau skrin mobil HP yang lebih kecil.

Basic optimumkan imej

Kita mesti kenal dan tahu jenis jenis format image yang boleh diguna pakai mengikut keperluan

  • Jpg : gunakan untuk gambar dan reka bentuk di mana orang, tempat atau benda dipaparkan
  • PNG terbaik untuk grafik, logo, reka bentuk teks-berat, tangkapan skrin, dan apabila anda memerlukan imej dengan latar belakang telus
  • Gif : jika anda memerlukan animasi, jika tidak, gunakan PNG

Cara editing di Photoshop untuk optimumkan imej

Aku memang menggunakan psd atau photohoshop untuk optimumkan imej yang akan dimasukkan didalam blog nanti. Ini sebagai contoh. File yang aku gunakan untuk editing lebih cepat.

Setkan satu file yang complete dengan imej size yang sama. Contoh blog aku dimension adalah 600 x 424 pixel. Jangan follow aku yer. Korang set ikut blog korang sendiri.

 

Optimumkan imej untuk blog

 

Setelah masukkan dalam template yang sedia ada dan juga ada editing atau improvisasi jika ada. Kemudian click export for web. Automatik kita ada dapat screen seperti dibawah yang memaparkan kualiti dan size imej yang berbeza.

Imej kita memang berwarna warni, lagi banyak warna lagi  maka besarlah file tersebut. Jadi final output yang terhasil selalunya berbeza beza, jadi selalunya aku tidak fix option yang mana. Yang penting tidak pecah dan size bawah 100kb

Dalam empat screen dibawah sebenarnya ada perbezaan kualiti gambar. Dari yg tingin hinggalah paling rendah. Pilihlah gambar yang sharp dan file bawah 75kb. Korang boleh tengok  perbezaan setiap file dibawah yang aku bulatkan warna biru

 

 

Untuk mereka yang tidak memmpunya software photoshop jadi option yang ada sama ada menggunakan paint dalam windows dan juga online tools sepeti Canva online yang korang boleh setkan dimension yer . atau beberapa tools lain seperi yang di highlightkan dalam entri https://wiser.my/kecilkan-saiz-gambar-sehingga-90-dengan-kualiti-optimum/

Sebagai contoh dari befunky.com dibawah ini juga ada menyatakan resize imej seperti di skrin kecik.

 

So ini lah sedikit sebanyak perkongsian aku kepentingan untuk korang refer. Buzz me kalau tak faham apa apa or letak komen dibawah yer.

24 Comments

  1. Huda February 8, 2019
  2. sohoque February 8, 2019
    • azni February 10, 2019
  3. ina February 8, 2019
    • azni February 10, 2019
  4. SitiYangMenaip February 10, 2019
    • azni February 10, 2019
  5. Julia Mahir February 11, 2019
  6. Suria Amanda February 11, 2019
  7. Syamimi February 11, 2019
  8. adianiez AIDA February 11, 2019
  9. Chrissella February 11, 2019
  10. Ezna February 11, 2019
  11. Mahamahu February 11, 2019
    • azni February 11, 2019
  12. Ayu Rafikah February 12, 2019
  13. Hanny Abdullah February 12, 2019
  14. Fadzi Razak February 12, 2019
  15. Zharif Azis February 12, 2019
  16. Bonda chanteq February 12, 2019
  17. AlongMurni February 12, 2019
  18. JMR February 12, 2019
  19. Mek onie February 12, 2019
  20. Zayani Zulkiffli February 12, 2019

Add Comment

CommentLuv badge

error: Content is protected !!
%d bloggers like this: