[PANDUAN] Praktik terbaik dalam menggunakan gambar di forum/web

[taufik123]

Topik Asli   : Guide: Best practices for using images on the forum/web
Penulis Asli : joker_josue


Panduan: Praktik terbaik dalam menggunakan gambar di forum/web
Didukung oleh TalkImg

Setelah lebih dari satu tahun TalkImg Diluncurkan, layanan hosting gambar yang sepenuhnya didedikasikan untuk forum ini, telah menjawab beberapa pertanyaan terkait penggunaan gambar, saya memutuskan untuk membuat panduan tentang praktik terbaik dalam menggunakan gambar di forum dan di web secara umum menggunakan talkimg. Panduan ini menyoroti penggunaan gambar di Bitcointalk, namun praktik ini juga berguna untuk digunakan pada situs web lain.

 Ukuran File  .:
Di situs web mana pun, tidak hanya Bitcointalk, penting untuk mempertimbangkan ukuran file gambar yang akan digunakan. Ini penting agar pengunjung dapat menikmati pengalaman menjelajah terbaik. Meskipun banyak yang sudah memiliki koneksi internet yang cepat, hal ini tidak selalu cukup agar website dapat dimuat dengan cepat, diperlukan optimasi yang baik untuk memastikan kecepatan. Pengoptimalan ini terutama melibatkan gambar, dan mungkin sumber daya lain yang dimiliki situs web.

Ukuran file akan mempengaruhi seberapa cepat sebuah gambar diproses, jika ukurannya besar (dalam byte; kB; MB) maka akan memakan waktu lebih lama untuk diproses. Ukuran file akan bergantung pada dimensi gambar, resolusi, dan jenis filenya. Biasanya, disarankan agar gambar yang digunakan di web tidak lebih dari 1 MB untuk performa yang baik. Memang benar bahwa forum mengizinkan gambar hingga 2,5MB, tetapi perlu di ingat ingat gambar dengan ukuran yang besar membutuhkan waktu lebih lama untuk proses.

Misalnya,logo TalkImg jika tidak dioptimasi akan memakan 220kB lebih banyak, jika dioptimasi akan memakan waktu kurang dari 70kB.

Banyak yang mengira, mungkin hal ini bisa membuat Anda kehilangan kualitas gambar yang di upload, namun bila dilakukan dengan baik, kualitas tidak akan hilang.
Ikuti panduannya dan pelajari cara melakukannya.

 Jenis File  .:
Untuk mencapai optimasi gambar yang baik, Anda perlu memilih jenis file yang sesuai. Di web, tidak disarankan menggunakan gambar dalam Format BMP atau TIF, karena ini adalah jenis file dengan optimasi rendah. Yang paling direkomendasikan adalah JPG, PNG dan GIF. Di beberapa situs web dimungkinkan untuk menggunakan file WEBP, yang memiliki tingkat pengoptimalan sangat baik. Tapi Hanya JPG, PNG dan GIF yang diterima di forum Bitcointalk.

Jenis file apa yang harus dipilih? Hal ini tergantung pada tujuan dari gambar tersebut.
Jenis JPG ideal untuk foto dan gambar tanpa latar belakang transparan.
Jenis PNG ideal untuk grafik, gambar dengan teks, atau gambar yang memerlukan latar belakang transparan.
Jenis GIF ditujukan untuk gambar animasi, tetapi tidak boleh memiliki resolusi besar atau animasi yang sangat panjang.

Contoh: foto pizza di kontes pizza harus dalam format JPG. Spanduk presentasi kontes harus dalam format PNG.


 Ukuran Gambar  .:
Hal lain yang perlu dipertimbangkan untuk mendapatkan gambar yang dioptimalkan untuk web adalah ukurannya (piksel). Dalam kebanyakan kasus, gambar berukuran besar atau yang beresolusi tinggi tidak diperlukan, terutama di forum. Kecuali jika gambar tersebut untuk dicetak atau untuk menganalisis detail, ukuran gambar tidak perlu terlalu besar.

Gambar berukuran 1920x1280 piksel sudah lebih dari cukup untuk sebagian besar kasus penggunaan di web. Namun, kemungkinan besar Anda bisa mendapatkan hasil yang bagus pada gambar yang ukurannya kurang dari setengahnya. Untuk forum, gambar dengan ukuran antara 600px dan 1200px (di sisi yang lebih besar) biasanya sudah cukup.

Berikut tipsnya: selalu gunakan resolusi yang proporsional. Dengan kata lain, jika gambar aslinya berukuran 1920x1280 dan ingin diperkecil menjadi 600, maka hasilnya akan menjadi 600x400px. Jika Anda mengubahnya dengan ukuran lain dan tidak proporsional, ini akan merusak gambar, sehingga gambar tidak akan terlihat bagus.


 Bagaimana Mengoptimalkannya?  .:
Ada beberapa program yang dapat digunakan untuk membantu proses optimasi. Bahkan beberapa smartphone telah menyertakan beberapa fungsi yang membantu dalam bidang ini. Tentu saja, ada apikasi Photoshop yang memungkinkan Anda melakukan penyesuaian pada gambar agar lebih optimal. Namun ada beberapa program gratis lainnya yang memungkinkan Anda melakukan tugas ini dengan lebih mudah.

Mungkin salah satu program pengeditan gambar gratis yang paling terkenal adalah GIMP. Ia bekerja di Linux, Windows dan Mac. Banyak yang menganggapnya sebagai pesaing Photoshop open source.
Bagi yang tidak ingin menginstal program apa pun, bisa menggunakan website edit.photo. Tersedia Gratis, tidak perlu membuat akun, tidak ada cookie, iklan, atau pelacakan.


 Contoh Praktis  .:
Saya akan memberikan contoh gambar dengan resolusi tinggi dan bagaimana saya dapat mengoptimalkannya dengan menggunakan edit.photo.

Contoh gambar: https://www.pexels.com/photo/close-up-shot-of-a-bitcoin-6765369/
Ukuran asli: 5311x3541px
Ukuran File: 3.56MB
Jenis File: JPG

1. Pilih gambar:


2. Pilih opsi "Resize":


3. Di bagian tengah bawah, temukan kolom "Height" dan "Width", dengan gambar gembok. Close gembok (untuk memastikan proporsionalitas) dan pilih ukuran yang diinginkan.


4. Di bagian pojok kanan atas, Anda akan menemukan opsi "Export" . Pilih JPG, atur kualitas menjadi 80% dan unduh.


5. GunakanTalkImg, atau situs hosting gambar lainnya, untuk mengunggah gambar yang diekspor dan kemudian mendapatkan kode BBCode yang bisa diposting di forum.

Hasil:
Ukuran yang dioptimalkan: 800x533 px
Ukuran file: 90kB
Jenis File: JPG


Lihatlah gambar aslinya dan lihat gambar yang sudah diedit, Anda akan melihat bahwa tidak ada penurunan kualitas yang signifikan, namun saya dapat mengoptimalkan gambar tersebut agar berkinerja baik di forum/web. Coba ulangi panduan ini dan Anda akan melihat betapa mudahnya mengoptimalkan gambar dengan kualitas yang sama tapi dengan ukuran file yang lebih kecil.


 Kesimpulan  .:
Seperti yang Anda lihat, memiliki gambar yang dioptimalkan untuk penggunaan forum tidaklah terlalu rumit, hal ini dapat dilakukan hanya dengan beberapa klik. Anda dapat menggunakan prosedur ini dalam program pengeditan gambar apa pun, tidak peduli betapa sederhananya itu. Jika Anda memanfaatkan gambar dengan baik, Anda akan dapat memperkaya pengalaman forum yang baik untuk semua orang.


Saya harap panduan ini bisa bermanfaat bagi semua orang dan saya akan tetap siap membantu Anda jika ada klarifikasi. Jika Anda menginginkan panduan lebih lanjut tentang topik ini, silakan bertanya, dan saya akan memeriksa apa yang dapat saya lakukan.


Terjemahan Ini sudah mendapatkan persetujuan dari joker_josue

[Chikito]

Kalau saya simple cukup ditambahkan (width=) atau (height=) untuk memperkecil ukuran gambar. Karena di forum ini gambar hanyalah pemanis, atau untuk pelengkap tutorial jika diskusinya ke hal teknis, itu pun gambar hanya dipakai untuk pelengkap langkah-langkah. Karena nilai suatu thread bukan kepada betapa bagusnya gambar yang disajikan tapi ke point dari tulisan itu sendiri.

[taufik123]

Kalau saya simple cukup ditambahkan (width=) atau (height=) untuk memperkecil ukuran gambar. Karena di forum ini gambar hanyalah pemanis, atau untuk pelengkap tutorial jika diskusinya ke hal teknis, itu pun gambar hanya dipakai untuk pelengkap langkah-langkah.

Yang simpel emang pakek cara add HTML width=xxx, height=xxx untuk tampilan yang lebih presisi dan bisa di sesuaikan, tapi bukan cuman itu tujuannya,
ini lebih kepada mengurangi besarnya ukuran file gambar agar tidak terlalu membebani storage server dan juga tidak perlu waktu lama untuk memuat gambar yang di sematkan.

TalkImg contohnya membatasi ukuran file gambar hingga 2.5MB, tapi kita sebagai user tentu bisa memperkecil ukuran file gambar dibawah 1MB saja tapi dengan kualuitas yang sama menggunakan beberapa tool yang sudah di jelaskan di atas.

walaupun gambar cuman hanya pelengkap saja, tapi ketika melihat sebuah data yang disertakan dengan gambar, itu lebih terlihat nyaman saja.
Karena saya juga sering menyematkan gambar di beberapa thread dan komentar yang saya buat untuk mempertegas apa yang saya sampaikan.

Karena nilai suatu thread bukan kepada betapa bagusnya gambar yang disajikan tapi ke point dari tulisan itu sendiri.

Ya itu poin yang penting, gambar hanya opsional saja mau pakek atau enggak.
yang penting tujuan artikel atau tulisan itu dibuat bisa tersampaikan.

[Chikito]

~

btw, saya kaget ngeliat mentioned di telegram (bitcointalk supernotifier) dari sampeyan kok sampe 43 kali ya?. apa errornya di thread ini atau bot telegramnya?.

[Husna QA]

Kalau saya simple cukup ditambahkan (width=) atau (height=) untuk memperkecil ukuran gambar. Karena di forum ini gambar hanyalah pemanis, atau untuk pelengkap tutorial jika diskusinya ke hal teknis, itu pun gambar hanya dipakai untuk pelengkap langkah-langkah. Karena nilai suatu thread bukan kepada betapa bagusnya gambar yang disajikan tapi ke point dari tulisan itu sendiri.

Settingan dengan menambahkan width ataupun height lebih ke untuk ukuran tampilan gambar dan tidak merubah filesize ataupun resolusi dari gambar aslinya itu sendiri.

Untuk tampilan di website memang perlu optimasi dari sisi resolusi gambar dan file size-nya dibuat sekecil mungkin agar bisa lebih cepat di load oleh browser user, namun tetap dengan tampilan yang masih cukup baik dilihat.

Berbanding terbalik dengan gambar yang digunakan untuk cetak fisik yang mana perlu gambar sedari awal dengan resolusi tinggi untuk hasil maksimal (contoh untuk seukuran poster ke bawah idealnya minimal menggunakan 300 Pixel/Inch).

-snip-

Yang simpel emang pakek cara add HTML width=xxx, height=xxx untuk tampilan yang lebih presisi dan bisa di sesuaikan, tapi bukan cuman itu tujuannya,
ini lebih kepada mengurangi besarnya ukuran file gambar agar tidak terlalu membebani storage server dan juga tidak perlu waktu lama untuk memuat gambar yang di sematkan.

TalkImg contohnya membatasi ukuran file gambar hingga 2.5MB, tapi kita sebagai user tentu bisa memperkecil ukuran file gambar dibawah 1MB saja tapi dengan kualuitas yang sama menggunakan beberapa tool yang sudah di jelaskan di atas.
-snip-

Ada trik sederhana lain yang biasa saya gunakan selain dengan mengedit resolusi gambar sebagaimana di OP, yakni dengan menggunakan metode screenshot.
Berikut ini tips-nya:

- buka file gambar menggunakan aplikasi default di OS untuk melihat gambar;
- kemudian gunakan shortcut* atau aplikasi untuk men-screenshot gambar tersebut;
- file screenshot tersebutlah yang di upload ke image hosting.

Kalau penasaran, silahkan bandingkan filesize gambar yang asli dengan filesize screenshot tersebut.

[MAAManda]

Kalau saya simple cukup ditambahkan (width=) atau (height=) untuk memperkecil ukuran gambar. Karena di forum ini gambar hanyalah pemanis, atau untuk pelengkap tutorial jika diskusinya ke hal teknis, itu pun gambar hanya dipakai untuk pelengkap langkah-langkah. Karena nilai suatu thread bukan kepada betapa bagusnya gambar yang disajikan tapi ke point dari tulisan itu sendiri.

Settingan dengan menambahkan width ataupun height lebih ke untuk ukuran tampilan gambar dan tidak merubah filesize ataupun resolusi dari gambar aslinya itu sendiri.

Untuk tampilan di website memang perlu optimasi dari sisi resolusi gambar dan file size-nya dibuat sekecil mungkin agar bisa lebih cepat di load oleh browser user, namun tetap dengan tampilan yang masih cukup baik dilihat.

Saya juga menggunakan cara yang digunakan oleh om @Chikito, menurut saya lebih simpel saja tanpa harus memerlukan kegiatan ekstra lagi seperti mengoptimasi ukuran gambar-nya. Lagipula, jika gambar yang di upload resolusinya besar dan yang di cantumkan di forum gambarnya sudah di sesuaikan, ketika pengguna lain ingin melihat gambar yang lebih jelas bisa langsung drag & drop ke tab saja. Berbeda jika kita mengoptimasi terlebih dahulu, apa yang kita lihat di forum, begitulah adanya jika kita drag & drop di tab lain, cara yang saya & om @Chikito gunakan saya kira memiliki keunggulannya tersendiri.

[Husna QA]

-snip-

Settingan dengan menambahkan width ataupun height lebih ke untuk ukuran tampilan gambar dan tidak merubah filesize ataupun resolusi dari gambar aslinya itu sendiri.

Untuk tampilan di website memang perlu optimasi dari sisi resolusi gambar dan file size-nya dibuat sekecil mungkin agar bisa lebih cepat di load oleh browser user, namun tetap dengan tampilan yang masih cukup baik dilihat.

Saya juga menggunakan cara yang digunakan oleh om @Chikito, menurut saya lebih simpel saja tanpa harus memerlukan kegiatan ekstra lagi seperti mengoptimasi ukuran gambar-nya. Lagipula, jika gambar yang di upload resolusinya besar dan yang di cantumkan di forum gambarnya sudah di sesuaikan, ketika pengguna lain ingin melihat gambar yang lebih jelas bisa langsung drag & drop ke tab saja. Berbeda jika kita mengoptimasi terlebih dahulu, apa yang kita lihat di forum, begitulah adanya jika kita drag & drop di tab lain, cara yang saya & om @Chikito gunakan saya kira memiliki keunggulannya tersendiri.

Poin dari OP bukan ke size tampilan, tapi ke size dari file-nya.
Tujuannya untuk mengurangi besaran file yang di upload ke image hosting dan untuk menghemat bandwith user juga. Bayangkan jika agan adalah penyedia image hosting kemudian semua user mengupload file dengan ukuran maksimal semua (contoh 2,5 mb per image) tentunya akan cepat penuh itu storage penyimpanan filenya dibandingkan dengan user yang mengupload gambar dengan kualitas hampir sama namun ukuran filenya lebih kecil.

btw, Saya sendiri seringkali menggunakan image dalam postingan, namun tidak mengupload image dengan file size besar dan biasanya cukup dengan meng-screenshot gambar kemudian untuk merapikan gambar di postingan dengan menambahkan code width ataupun height.

Merubah ukuran (resize) Gambar
-snip-
b. Cara kedua (lebih simpel, karena hanya merubah di BBCode nya saja)

Tambahkan kode width= … pada BBCode image (titik-titik diisi dengan ukuran dalam pixel yang kita inginkan).
Untuk height otomatis menyesuaikan secara proporsional.

Contoh:

Code:

[img width=200]https://talkimg.com/images/2023/05/17/blob4cfe93ba3e043f18.png[/img]

[mu_enrico]

Terbaik itu relatif sih, IMO cara begini (meminimalkan dan meresize gambar) masih ada kekurangannya dan sangat fatal kalau ga punya raw backup yang kualitasnya bagus --meskipun kebanyakan orang tidak akan mengalami permasalahan ini.

Trus kalau mau kualitas tidak hilang itu pakai algo yang "lossless" dan sepengetahuan ane metode @OP di atas masih "lossy" CMIIW
Jadi tetap hilang kualitasnya. Mungkin si A atau si B tidak bisa mendeteksi, tapi si C atau si D mungkin bisa mendeteksi...

Sehingga alur kerja ane yang ideal adalah*:
(1) Resize resolusi, save masih kualitas tinggi (jangan dikompress gila dulu)
(2) Upload di layanan kompresi lossless (kalau penggunaan dikit ada yang gratisan)
(3) Pakai lossless algo untuk mengompress gambar.
(4) Gambar siap digunakan.

*Kalau untuk forum hanya perlu resize saja. Jadi gini, untuk jaman sekarang attachment gambar itu tidak terlalu berat untuk user/client karena bandwidth sudah besar meskipun akses via ponsel. Optimasi gambar lebih bertujuan untuk mendapatkan load time dan skor SEO yang bagus. Terlebih lagi kalau pakai image hosting gratisan itu kecepatan juga bergantung dari si server tsb., jadi bisa jadi gambar juga tampil lambat ataupun tidak tampil sama sekali meskipun udah dikecilkan, tergantung kemampuan si penyedia jasa.

Tl;dr
Jadi kalau mau pakai cara @OP, saran ane:
(1) Tetap simpan file original kalau-kalau diperlukan
(2) Ketahui kalau cara di atas adalah metode "lossy" sehingga pasti ada penurunan kualitas
(3) Meskipun gambar sudah kecil, tapi belum tentu bisa ditampilkan dengan cepat, karena tergantung penyedia layanan hosting


Bonus:

Yang terbaik itu sistem kek di WordPress IMO, jadi gambar yang diupload akan dibuatkan copynya dalam berbagai resolusi. Kalau kata AI di google:

WordPress automatically creates four default image sizes when you upload an image:
Thumbnail: 150 x 150 pixels
Medium: Maximum 300 x 300 pixels
Large: Maximum 1024 x 1024 pixels
Full size: The original size of the uploaded image

Plus kalau pakai plugin tertentu bisa langsung kompresi "lossless" setelah gambar original diupload. Jadi tinggal upload aja gambar originalnya nanti sistem otomatis kerja.

Tinggal pilih sesuai kebutuhan dan kalau yang diinginkan, misalnya ingin kualitas maksimal untuk showcase arts yang detil misalnya tanpa membebani users. Tinggal pilih yang ukuran kecil, nanti dilink ke gambar full size.

[taufik123]

btw, saya kaget ngeliat mentioned di telegram (bitcointalk supernotifier) dari sampeyan kok sampe 43 kali ya?. apa errornya di thread ini atau bot telegramnya?.

Botnya Error LOL :v

Saya juga menggunakan cara yang digunakan oleh om @Chikito, menurut saya lebih simpel saja tanpa harus memerlukan kegiatan ekstra lagi seperti mengoptimasi ukuran gambar-nya. Lagipula, jika gambar yang di upload resolusinya besar dan yang di cantumkan di forum gambarnya sudah di sesuaikan, ketika pengguna lain ingin melihat gambar yang lebih jelas bisa langsung drag & drop ke tab saja. Berbeda jika kita mengoptimasi terlebih dahulu, apa yang kita lihat di forum, begitulah adanya jika kita drag & drop di tab lain, cara yang saya & om @Chikito gunakan saya kira memiliki keunggulannya tersendiri.

Poin dari OP bukan ke size tampilan, tapi ke size dari file-nya.
Tujuannya untuk mengurangi besaran file yang di upload ke image hosting dan untuk menghemat bandwith user juga. Bayangkan jika agan adalah penyedia image hosting kemudian semua user mengupload file dengan ukuran maksimal semua (contoh 2,5 mb per image) tentunya akan cepat penuh itu storage penyimpanan filenya dibandingkan dengan user yang mengupload gambar dengan kualitas hampir sama namun ukuran filenya lebih kecil.

Bener yang dikatakan om husna, tujuan panduan ini dibuat untuk mengurangi besarnya file image yang di upload di hosting dan juga gak memberatkan pemrosesan gambar.
Panduan ini dibuat oleh joker_josue yang sudah kita tahu bersama sebagai pembuat Hosting TalkImg yang kita gunakan sekarang secara gratiiiissss.

Dia membuat panduan ini agar pengguna bisa lebih bijak dan melakukan praktik terbaik untuk menghasilkan gambar yang kualitasnya sama tapi dengan file size yang lebih kecil.

dan belajar dari kejadian tumbangnya TalkImg kemarin yang berlangsung cukup lama karena serangan DDOS, membuat Joker_josue harus bekerja keras untuk mengembalikan gambar agar tetap berada di tempatnya dan tentu backup yang dibutuhkan akan lebih besar jika gambar yang di upload di atas 2MB atau 2.5MB sebagai batas maksimal yang boleh di uplaod.

btw, Saya sendiri seringkali menggunakan image dalam postingan, namun tidak mengupload image dengan file size besar dan biasanya cukup dengan meng-screenshot gambar kemudian untuk merapikan gambar di postingan dengan menambahkan code width ataupun height.

Biasanya saya juga pakek cara ini dan ukuran gambar dibawah 1MB, bahkan dibawah 100kb tergantung luas area dan warna gambar yang di screenshoot.
saya pekek aplikasi Lightshoot untuk screenshoot dan langsung bisa di tandai area mana yang akan di ambil gambarnya.

Terbaik itu relatif sih, IMO cara begini (meminimalkan dan meresize gambar) masih ada kekurangannya dan sangat fatal kalau ga punya raw backup yang kualitasnya bagus --meskipun kebanyakan orang tidak akan mengalami permasalahan ini.
-snip-

Ya saya sendiri masih nyimpen file asli gambar sebelum di kompresi, seperti gambar-gambar hasil Art kontes yang saya upload.
terlebih dahulu saya urutkan namanya dan mulai di komrpresi secara bersamaan, sehingga saya masih punya backupan file asli dengan kualitas tinggi.

Dan beberapa alur kerja pemrosesan gambar yang om mu_enrico lakukan bisa jadi acuan juga bagi teman-teman untuk mendapatkan hasil gambar yang lebih maksimal.

[Husna QA]

btw, Saya sendiri seringkali menggunakan image dalam postingan, namun tidak mengupload image dengan file size besar dan biasanya cukup dengan meng-screenshot gambar kemudian untuk merapikan gambar di postingan dengan menambahkan code width ataupun height.

Biasanya saya juga pakek cara ini dan ukuran gambar dibawah 1MB, bahkan dibawah 100kb tergantung luas area dan warna gambar yang di screenshoot.
saya pekek aplikasi Lightshoot untuk screenshoot dan langsung bisa di tandai area mana yang akan di ambil gambarnya.

Ya, screenshot cenderung lebih kecil file size-nya (biasanya hanya beberapa KB saja) karena hanya mengambil area screen yang digunakan PC atau sebagian area window tertentu yang bisa di seleksi menggunakan tool seperti di atas. Di MacOS, secara default, untuk mengambil screenshot sudah disediakan beberapa opsi (jadi tidak perlu install aplikasi third-party), user tinggal menyesuaikan shortcut-nya saja untuk akses lebih cepat ke fungsi tersebut:

[mu_enrico]

Ya saya sendiri masih nyimpen file asli gambar sebelum di kompresi, seperti gambar-gambar hasil Art kontes yang saya upload.
terlebih dahulu saya urutkan namanya dan mulai di komrpresi secara bersamaan, sehingga saya masih punya backupan file asli dengan kualitas tinggi.

Untuk gambar banyak emang lebih enak kalau pakai tools "batch resizer" dulu ini juga salah satu senjata ane ketika hanya mampu sewa shared hosting 50MB

Di MacOS, secara default, untuk mengambil screenshot sudah disediakan beberapa opsi (jadi tidak perlu install aplikasi third-party), user tinggal menyesuaikan shortcut-nya saja untuk akses lebih cepat ke fungsi tersebut:

Windows juga punya, namanya Snipping Tool yang bisa diakses dengan Win + Shift + S
Cuma sekarang mainan baru ane adalah ShareX karena konon Lightshot itu tidak aman (tidak opensource juga).
ShareX juga memiliki fitur untuk upload langsung ke server pribadi, sedangkan Lightshot tidak.

Anyway betul diskusi agan-agan di atas kalau pakai BBCode atau HTML untuk merubah ukuran maka users/client akan tetap mengunduh file fullnya. Artinya kalau gede dan servernya lemot akan jadi problematik. Jadi ya kalau mau pakai gratisan apalagi TalkImg ya dikecilkan untuk menghargai usaha webmaster yang ngasi jasa gratis buat members BTT.

[Husna QA]

Ya saya sendiri masih nyimpen file asli gambar sebelum di kompresi, seperti gambar-gambar hasil Art kontes yang saya upload.
terlebih dahulu saya urutkan namanya dan mulai di komrpresi secara bersamaan, sehingga saya masih punya backupan file asli dengan kualitas tinggi.

Terkadang sebagian image memang perlu disimpan file aslinya untuk keperluan berikutnya, terlebih jika filenya hasil editing yang masih memiliki layer*. Kalau sudah terlanjur di flat dan di kompresi tentunya akan ribet jika sewaktu-waktu perlu di-edit.

* Contoh, image untuk judul header pada thread Hardware Wallet bahkan saya masih menyimpan file format psd-nya.

Windows juga punya, namanya Snipping Tool yang bisa diakses dengan Win + Shift + S
Cuma sekarang mainan baru ane adalah ShareX karena konon Lightshot itu tidak aman (tidak opensource juga).

Ah iya ada. Dulu di PC kantor, saya malah menggunakan aplikasi Greenshot (free dan open-source) alih-alih menggunakan aplikasi bawaan WindowsOS. Jadinya tidak begitu 'ngeh' karena jarang menggunakan aplikasi tersebut.

[Chikito]

btw, saya kaget ngeliat mentioned di telegram (bitcointalk supernotifier) dari sampeyan kok sampe 43 kali ya?. apa errornya di thread ini atau bot telegramnya?.

Botnya Error LOL :v

Iya, ternyata Tryninjnya lagi deal-dealan iklan/sponsor. 



btw kalau untuk upload di talkimg.com sudah dilengkapi dengan width dan height secara otomatis jadi pengguna tidak perlu repot-repot lagi untuk nambah opsi tersebut untuk memperkecil image.

[taufik123]

-snip-
Anyway betul diskusi agan-agan di atas kalau pakai BBCode atau HTML untuk merubah ukuran maka users/client akan tetap mengunduh file fullnya. Artinya kalau gede dan servernya lemot akan jadi problematik. Jadi ya kalau mau pakai gratisan apalagi TalkImg ya dikecilkan untuk menghargai usaha webmaster yang ngasi jasa gratis buat members BTT.

Nah tujuan Panduan ini emang untuk mnegecilkan Filze size gambar agar gak terlalu memebani server Hoting imagenya katak TalkImg, Karena emang udah disediakan gratis tanpa bayar apapun ( tapi kalo mau donasi di persihlakan ).
Itung-itung menghemat Storage server, saya biasanya kalo gambar yang gak butuh detail banget wajib dibawah 1MB biar loadnya juga gak berat.

Terkadang sebagian image memang perlu disimpan file aslinya untuk keperluan berikutnya, terlebih jika filenya hasil editing yang masih memiliki layer*. Kalau sudah terlanjur di flat dan di kompresi tentunya akan ribet jika sewaktu-waktu perlu di-edit.

* Contoh, image untuk judul header pada thread Hardware Wallet bahkan saya masih menyimpan file format psd-nya.

Yups, file asli selalu dibutuhkan kalo berkaitan dengan banner atau file gambar yang penting biar gak ngedit dari awal lagi.
Saya juga nyimpen file PSD seperti Gambar untuk banner konter, nanti tinggal ganti aja pakek gambar lain dengan ukuran dan template yang hampir sama.
Dan beberapa gambar HD Originalnya juga saya simpan, Tapi gambar yang penting-penting aja.

btw kalau untuk upload di talkimg.com sudah dilengkapi dengan width dan height secara otomatis jadi pengguna tidak perlu repot-repot lagi untuk nambah opsi tersebut untuk memperkecil image.

Setelah update emang udah lengkap sama ukuran gambarnya Tinggal ganti ukuran sesuai yang dibutuhkan saja, Tapi tujuan panduan ini dibuat bukan hanya untuk mengecilkan ukuran lewat fitur width dan height, Tapi mengecilkan file sizenya biar gak membebani server seperti yang di jelaskan sama om mu_enrico

[Husna QA]

btw kalau untuk upload di talkimg.com sudah dilengkapi dengan width dan height secara otomatis jadi pengguna tidak perlu repot-repot lagi untuk nambah opsi tersebut untuk memperkecil image.

Setelah update emang udah lengkap sama ukuran gambarnya Tinggal ganti ukuran sesuai yang dibutuhkan saja, -snip-

Angka pada height dan width nampaknya otomatis mengikut image size yang di-upload. Namun, jika ingin memodifikasi 'tampilan' melalui pengubahan ukuran pada BBCode tersebut, agar lebih mudah mendapatkan tampilan yang proporsional cukup gunakan salah satunya (width saja atau height saja). Kalau menggunakan keduanya perlu diketahui perbandingan yang sama, jika salah satunya (height atau width) dirubah.

[Chikito]

btw kalau untuk upload di talkimg.com sudah dilengkapi dengan width dan height secara otomatis jadi pengguna tidak perlu repot-repot lagi untuk nambah opsi tersebut untuk memperkecil image.

Setelah update emang udah lengkap sama ukuran gambarnya Tinggal ganti ukuran sesuai yang dibutuhkan saja, -snip-

Angka pada height dan width nampaknya otomatis mengikut image size yang di-upload. Namun, jika ingin memodifikasi 'tampilan' melalui pengubahan ukuran pada BBCode tersebut, agar lebih mudah mendapatkan tampilan yang proporsional cukup gunakan salah satunya (width saja atau height saja). Kalau menggunakan keduanya perlu diketahui perbandingan yang sama, jika salah satunya (height atau width) dirubah.

Ya kalau misal mau ubah height, maka harus ubah juga width-nya.

Saya rasa juga tidak terlalu ribet, cukup lihat saja angkanya, misal contoh gambar di atas, Height=331, width=889, misal mau memperkecil ukuran cukup diseting; Height=231, width=789, atau Height=131, width=689, yang penting imbang aja.

[Husna QA]

Angka pada height dan width nampaknya otomatis mengikut image size yang di-upload. Namun, jika ingin memodifikasi 'tampilan' melalui pengubahan ukuran pada BBCode tersebut, agar lebih mudah mendapatkan tampilan yang proporsional cukup gunakan salah satunya (width saja atau height saja). Kalau menggunakan keduanya perlu diketahui perbandingan yang sama, jika salah satunya (height atau width) dirubah.

Ya kalau misal mau ubah height, maka harus ubah juga width-nya.

Saya rasa juga tidak terlalu ribet, cukup lihat saja angkanya, misal contoh gambar di atas, Height=331, width=889, misal mau memperkecil ukuran cukup diseting; height=231, width=789, atau Height=131, width=689, yang penting imbang aja.

Hitungan seperti di atas keliru mas. Jadi, bukan ketika angka pada height dikurangi 100 atau 200 maka width pun tinggal dikurangi 100 atau 200.
Namun, untuk mendapatkan tampilan image yang proporsional sebagaimana aslinya, penambahan ataupun pengurangan ukuran menggunakan prosentase, contoh jika Height dikurangi 10% maka width pun dikurangi 10%.

Contoh, gambar awal berikut ini dengan height=331 dan width=889

Code:

[img height=331 width=889]https://www.talkimg.com/images/2025/01/01/OU1JC.jpeg[/img]

Jika dirubah menjadi height=231 dan width=789 sebagaimana perhitungan mas di atas, maka hasilnya tidak proporsional (gepeng) sebagaimana nampak berikut ini:

Code:

[img height=231 width=789]https://www.talkimg.com/images/2025/01/01/OU1JC.jpeg[/img]

Nah, berikut ini ukuran yang proporsional:
Jika yang digunakan height=231 maka width (proporsionalnya)=620 (bukan 789)

Code:

[img height=231 width=620]https://www.talkimg.com/images/2025/01/01/OU1JC.jpeg[/img]

Jika yang digunakan width=789 maka height (proporsionalnya)=294 (bukan 231)

Code:

[img height=294 width=789]https://www.talkimg.com/images/2025/01/01/OU1JC.jpeg[/img]

[mu_enrico]

Namun, jika ingin memodifikasi 'tampilan' melalui pengubahan ukuran pada BBCode tersebut, agar lebih mudah mendapatkan tampilan yang proporsional cukup gunakan salah satunya (width saja atau height saja).

Betul ini cukup gunakan salah satunya saja, kalo ane biasanya pakai width saja.

• width resize image to this width. If no height is specified, height will be resized to preserve the aspect ratio.
• height resize image to this height. If no width is specified, width will be resized to preserve the aspect ratio.

Sumur.

Ada yang pakai ShareX? Mungkin bisa dikonek langsung ke Talkimg biar bisa langsung upload setelah screenshot mirip kek di lighshot... Punya ane udah ane setting upload ke FTP mau oprek lagi malas nanti kalau harus setting ulang.

[Chikito]

Ya kalau misal mau ubah height, maka harus ubah juga width-nya.

Saya rasa juga tidak terlalu ribet, cukup lihat saja angkanya, misal contoh gambar di atas, Height=331, width=889, misal mau memperkecil ukuran cukup diseting; height=231, width=789, atau Height=131, width=689, yang penting imbang aja.

Hitungan seperti di atas keliru mas. Jadi, bukan ketika angka pada height dikurangi 100 atau 200 maka width pun tinggal dikurangi 100 atau 200.
Namun, untuk mendapatkan tampilan image yang proporsional sebagaimana aslinya, penambahan ataupun pengurangan ukuran menggunakan prosentase, contoh jika Height dikurangi 10% maka width pun dikurangi 10%.

Ya kayaknya saya salah perhitungan, jika kita kurangin 100 kayak perhitungan saya di atas, yang jadi gambar malah aneh bentuknya, tidak persegi dan gak kelihatan proporsional. Kalau mau praktis, mending pilih salah satu width, atau height aja.

Mungkin perlu di mention ke main thread-nya talkimg biar tidak otomatis langsung ada keduanya, tapi setidaknya ada pilihan untuk salah satunya.

[Husna QA]

-snip-

Ya kayaknya saya salah perhitungan, jika kita kurangin 100 kayak perhitungan saya di atas, yang jadi gambar malah aneh bentuknya, tidak persegi dan gak kelihatan proporsional. Kalau mau praktis, mending pilih salah satu width, atau height aja.

Mungkin perlu di mention ke main thread-nya talkimg biar tidak otomatis langsung ada keduanya, tapi setidaknya ada pilihan untuk salah satunya.

Pencantuman keduanya (width dan height) saya kira sudah sesuai. Jadi, user bisa mengetahui image size yang digunakannya. Nah, kalaupun ingin di modifikasi lebih kecil atau lebih besar, tinggal di delete salah satunya saja secara manual sesuai kebutuhan. Saya sendiri seringnya hanya menggunakan width, sementara untuk height seringkali digunakan ketika menyusun beberapa gambar yang posisinya portrait (semisal screenshot aplikasi di HP) menjadi satu baris.