Super Tips of All Time for me [IMO] aka Terms Difference aka baru tau gw!: SOURCE-CODE (kode sumber) / RENDERED-TEXT (hasil render)
$ChatGPT
Berikut perbedaan paling jelas dan simpel antara rendered-text dan source-code — khususnya di Blogger/Blogspot, HTML, CSS, shaded-box, embed, dll.
✅ 1. SOURCE-CODE (kode sumber)
Yang Anda tulis.
Ini adalah kode mentah yang dimasukkan ke dalam editor HTML Blogger.
Contoh:
<div style="background:#f0f0f0; padding:10px;">
<b>Hello World</b>
</div>
Ciri-ciri:
-
Berisi tag seperti
<div>,<p>,<span>,<iframe>,<style>, dll. -
Tidak memiliki warna/cetak-tebal/box sampai browser memprosesnya.
-
Yang terlihat adalah teks kode mentah (tidak diproses).
-
Ini yang selalu Anda kerjakan saat bilang:
“rewrite source-code,” “warna coding,” “hilangkan background code,” dll.
✅ 2. RENDERED-TEXT (hasil render)
Yang dilihat pembaca di halaman blog.
Browser mengubah source-code menjadi tampilan visual:
Contoh hasil render dari kode di atas:
Ciri-ciri:
-
Sudah punya warna, layout, box, bold, line-height, spacing.
-
Sudah menjadi tampilan final.
-
Tidak terlihat tag HTML-nya.
-
Ini yang Anda maksud ketika bilang:
“warna terlalu gelap saat dirender,” “hilangkan background pada rendered text,” “make full width,” dll.
🎯 Cara Paling Mudah Memahami:
| Jenis | Definisi | Yang Anda Lihat | Contoh |
|---|---|---|---|
| Source-code | Kode mentah sebelum diproses browser | <div> ... </div> |
Editor HTML Blogger |
| Rendered-text | Tampilan visual hasil interpretasi browser | Box, warna, teks cantik | Halaman Blog ditampilkan ke pembaca |
🔍 Analogi Super Singkat:
-
Source-code = resep masakan.
-
Rendered-text = makanan jadi yang disajikan.
Comments