Cara Menambahkan Background di HTML dengan Mudah

Palingit.com – Menambahkan background di HTMl bisa membuat web lebih menarik dan kustom. Cara menambahkan background di HTML tidaklah cukup sulit sebenarnya. Namun, memang butuh kejelian untuk bisa menyusun script yang sesuai dengan kebutuhan.

Ini karena script inilah yang akan berperan dalam mengatur tampilan di laman yang tersebut. Oleh karena itu, kamu perlu memahami benar seputar ilmu dasar pelajaran script HTML ini. Baru setelah itu, kamu bisa beranjak dan mengutak-atik desain situsmu sendiri, termasuk dalam hal hosting.

Cara Mudah Menambah Background di HTML

Ada banyak cara membuat tampilan situs jadi lebih menarik. Mungkin, salah satunya dengan menambahkan background image dengan HTML. Memang, tidak hanya bisa dilakukan menggunakan HTML saja, tapi cara satu ini adalah yang paling relevan dan praktis.

Bikin background dengan HTML bisa kamu lakukan dengan beberapa cara: bisa dengan eksekusi langsung pada script-nya, melalui CSS, dan semacamnya. Yang mana yang mau kamu pilih bergantung kepada kebisaanmu dan relevansi saja.

Misalnya, kamu mau buat background dengan CSS. Tentunya, kamu butuh beberapa properti yang menunjang seperti gambar dan URL gambar. URL pada gambar biasanya memiliki penamaan fail khusus seperti “nama fail.format”, misalnya.

Nah, nantinya URL ini akan berisi tautan asal atau sumber gambar yang ingin kamu jadikan latar belakang. Jika fail gambar tersebut tersimpan jadi satu dengan script HTML yang ada, maka cukup dengan format “url(nama fail.format)” saja.

Namun, jika fail gambarnya ada di folder yang lain, kamu perlu menyertakan tambahan menjadi “url(background/nama fail.format)”. Jadi, misalnya fail gambar tadi bernama “sisir.jpg” atau “bunga.jpeg” maka URL-nya jadi “url(background/sisir.jpg)” atau “url(background/bunga.jpeg)”.

Itu hanya intermezo mengenai tutorial kali ini. Lebih detailnya, kamu bisa terus baca uraian lengkapnya berikut ini.

Cara Menambah Background Secara Langsung

Untuk menambahkan background secara langsung, ini yang perlu kamu lakukan:

• kamu bisa membuat gambar background langsung dengan tag head.
• Nantinya, cara ini bisa kamu labeli secara direct sealigus dengan tag style-nya.
• Format script yang kamu lihat pada gambar di atas itu bisa kamu ketikkan ulang, kemudian silakan “Run” lalu “Launch” melalui browser Chrome.

Periksa ulang sebelum kamu jalankan format script di atas. Satu karakter saja luput kamu inputkan, bisa jadi program tidak berjalan. Kamu bisa kerja dua kali untuk membuat background di HTML dengan cepat.

Dengan format yang tak jauh berbeda, kamu juga bisa melakukannya sebenarnya. Script di bawah ini jauh lebih sederhana untuk kamu salin dan jalankan. Namun, kamu perlu melakukan input tag yang ada dalam script HTML terlebih dahulu sebelum memunculkan background.

Yang perlu kamu catat adalah script di atas wajib kamu ketikkan dalam tag style. Tulis ulang dengan persis tanpa meninggalkan satu kode pun. Ini penting agar bisa berjalan lancar.

Cara Menambah Background dengan CSS

Cara yang lain, kamu bisa memanfaatkan CSS, ini caranya:

• Sedikit berbeda dari cara sebelumnya, kalau kamu memutuskan menggunakan CSS ini, kamu perlu properti type untuk tag  style-nya.

• Ketikkan script di atas.
• Masukkan dalam tag style.
• Text/CSS yang ada wajib kamu gunakan dalam type kali ini. Jika ingin menghendaki gambar secara penuh menjadi latar belakangnya, silakan tambahkan “<div id = “main”>”.

Usahakan agar selalu cermat dalam memasukkan setiap kode yang ada. Lebih baik sekali kerja tapi lama, daripada sembrono dan harus mengulang pekerjaan dengan level kerumitan yang bisa berlipat ganda.

Cara Menambah Background dengan Tag Body

Selanjutnya, kamu bisa gunakan alternatif lainnya, yaitu cara menambah background dengan tag body. Caranya, kamu cermati format kode script di atas. Sangat simpel, bukan?

Sekarang, coba bandingkan dengan format berikut ini.

Cara yang ini sedikit lebih rumit karena melibatkan beragam atribut yang mesti kamu atur sedemikian rupa. Jelas ini jauh lebih kompleks jika dibandingkan dengan format sebelumnya. Namun, secara fungsional, cara kedua ini lebih efektif.

Keuntungan Menambahkan Background

Tentunya ada alasan yang mendasari mengapa seseorang lebih menghendaki adanya gambar latar belakang pada situs mereka daripada polos belaka. Tidak hanya sebatas urusan estetika semata, ini manfaat lain menambahkan background.

1. Mempercantik Situs

Jelas, urusan pertama yang bertautan dengan kehadiran latar belakang pada laman web adalah soal keindahan. Kamu tentu akan lebih merasa nyaman membaca atau mengunjungi web tertentu jika background image yang ada mendukung.

Kontur warna, tema, dan dominasi latarnya pun diperkirakan dengan perhitungan yang matang oleh si pemilik situs. Kamu tidak bisa asal-asalan dalam memilih background di HTML.

2. Memberikan Kenyamanan

Dengan kemampuan memilih yang tepat, kamu bisa membuat pengunjung situsmu jadi lebih nyaman dalam berselancar. Kenyamanan pengunjung situs inilah yang akan menaikkan traffic situsmu.

Tingkat kepadatan pengunjung ini mampu mengubah situs yang biasa-biasa saja jadi situs terpopuler dalam waktu yang relatif singkat. Rawatlah apa yang sudah menjadi hal baik dalam tampilan situsmu dan maksimalkan sisanya dengan cara-cara yang terbarukan.

Jangan tutup telinga terhadap komentar dari pengunjung situsmu. Itu menjadi timbal balik positif yang bagus untuk evaluasimu dalam membangun situs. Pikirkan matang-matang dan benahi perlahan mana yang perlu jadi prioritas pilihan.

3. Menjadi Ciri Khas

Alasan lain kenapa saat memilih latar belakang gambar di situs tidak bisa sembarangan adalah urusan identitas. Corak situs yang selama ini tertanam di benak para pengunjung bisa menghadirkan kesan tersendiri yang dapat kamu implementasikan sebagai sebuah kekhasan.

Ciri yang sudah ada dan melekat dalam situsmu, entah itu pola dasar ilustrasinya maupun warna tema latar belakang, menjadi impresi awal bagi para pengunjung. Jika itu dipikirkan secara matang, bukan tidak mungkin jumlah pengunjung situsmu akan terus bertumbuh.

4. Penyegaran Berkala

Karena menjadi identitas yang melekat pada situsmu, bukan berarti kamu tidak boleh untuk mengganti latar belakang gambar situsmu yang sudah ada. Justru pembaruan itu perlu agar para pengunjung tidak bosan dengan situsmu.

Dengan ini, para pengunjung bisa terus merasakan keseruan yang sama kala mengunjungi situsmu. Penggantian background semacam ini tidak akan mengubah identitas yang sudah kamu bangun untuk situsmu, asalkan tidak melenceng jauh darinya.

Inilah mengapa saat melakukan evaluasi, unsur latar belakang ini menjadi pertimbangan yang cukup vital. Corak warna, font, maupun semiotika pembaca amat perlu kamu pikirkan agar bisa membuat para pengunjung selalu merasa nyaman saat berkunjung.

Kesimpulan

Jika kamu membutuhkan referensi seputar dunia blogging dan teknologi, kamu bisa langsung mampir ke situs Paling IT. Ada banyak kemudahan dan pengetahuan menarik yang bisa kamu jumpai di sana.

Kamu akan belajar banyak hal tentang bagaimana mengoptimalkan situs yang sudah ada dan meraih lebih banyak pengunjung setiap harinya. Buat pengunjung situsmu lebih nyaman dan selalu mampir tiap waktu.

PalingIT.com memberikan banyak tips yang akan berguna bagi pengembangan situsmu. Mulai dari memaksimalkan traffic pengunjung hingga cara menambahkan background di HTML, bisa kamu pelajari di sini.