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.
Table of Contents
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.
Rekomendasi:
Cara Mengatasi Hp Bootloop Tanpa Menghapus Data, Mudah! Palingit.com - Bagi Anda pengguna handphone Android pasti sudah tidak asing lagi dengan istilah bootloop. Menariknya sekarang Anda bisa menggunakan cara mengatasi HP bootloop tanpa menghapus data, supaya mempermudah penggunaannya.…
Rekomendasi Aplikasi Musik Terbaik Untuk Android & iOS 2023 palingit.com - Aplikasi musik adalah sebuah program atau software yang dirancang untuk memainkan. Dan mengelola berbagai jenis musik secara digital pada perangkat elektronik seperti smartphone, tablet, atau komputer. Aplikasi musik…
Cara Mengatasi Sinyal Hilang di HP Android [Ampuh] Palingit.com - Salah satu ketidaknormalan yang sepele namun nyatanya bikin repot, yakni masalah sinyal hilang di HP Android. Bagaimana tidak, lagi asik-asiknya streaming misalnya, tiba-tiba jaringan hilang sendirinya. Tentu kesal,…
Buat Fotomu Makin Menarik dengan Tutorial Lightroom Ini Palingit.com - Kini kamu bisa lho, mengedit foto menjadi estetis cukup bermodalkan smartphone. Salah satunya adalah lewat aplikasi Adobe Lightroom. Mungkin aplikasi yang satu masih belum terlalu familier bagi sebagian…
Kenapa Handphone Panas Saat Dicharge? Ini Jawabannya! Palingit.com - Seringkali handphone saat diisi daya, akan terasa panas. Data seluler yang tetap menyala sering dianggap sebagai penyebab kenapa hp panas saat dicharger. Namun tak hanya itu lho penyebabnya,…
Cara Membuat Email Baru di HP, Simpel! Palingit.com - Di era yang semua halnya serba canggih ini, email hampir selalu menjadi syarat utama ketika kamu mendaftarkan akun media sosial maupun akun bisnis di e-commerce. Apabila kamu berniat…
Cara Mudah Mematikan HP Baterai Tanam Macet atau Hang [100%… Palingit.com - Mematikan HP Baterai Tanam - HP lagi nyaman dipakai tiba-tiba hang, tentu sangat menjengkelkan sekaligus panic mode on! Terlebih jika sedang ngerjain projek yang belum disimpan, sakit rasanya.…
12 Daftar Aplikasi Pembersih Android Terbaik dan Ringan Palingit.com - Pemeliharaan Android merupakan salah satu langkah yang harus kamu lakukan untuk menjaga kualitas ponsel. Download dan jalankan aplikasi pembersih Android terbaik dan ringan untuk menyingkirkan history, cache dan…
Cara Menghapus Akun Google di Handphone Secara Mudah Palingit.com - Banyak alasan mengapa orang ingin mengetahui bagaimana cara menghapus akun Google di handphone secara permanen. Ternyata, ini bisa dilakukan baik itu melalui handphone maupun laptop. Di dalam handphone,…
Cara Screenshot di Laptop dengan Mudah dan Cepat palingit.com - Cara Screenshot Laptop - Screenshot atau tangkapan layar laptop adalah proses mengambil gambar dari layar laptop Anda. Proses ini sangat berguna dalam berbagai situasi, seperti menangkap momen tertentu…
HP Android Murah namun Mumpuni untuk Kebutuhan Sehari-hari Palingit.com - Hp Android murah namun mumpuni - Di zaman modern seperti sekarang, HP telah seperti menjadi kebutuhan utama. Oleh karena itu, sekarang telah tersedia berbagai macam merek HP mulai…
Mengenal Apa Itu Username dan Kegunaannya Palingit.com - Pengertian Username - Selama kita berselancar di dunia Internet tentunya tidak akan dilewatkan untuk memasukkan username dan password seperti halnya di Facebook, Twitter, maupun Instagram. Ya, tujuannya adalah…
Cara Blokir Iklan di HP yang Mengganggu Tiba-Tiba [100%… Palingit.com - Cara Blokir Iklan di HP - Suka kesel enggak sih, hp lagi enak dipakai tiba-tiba muncul iklan. Selain mengganggu, munculnya iklan seperti itu sangat tidak baik bagi hp,…
Cara Membuat Halaman di Word Mudah Anti Ribet palingit.com - Cara Membuat Halaman di Word - Microsoft Word adalah salah satu program pengolah kata yang paling populer digunakan di seluruh dunia. Program ini dilengkapi dengan berbagai fitur yang…
Cara Menghilangkan Virus di Laptop Windows 10 yang Praktis Palingit.com - Ada banyak penyebab, mengapa laptop Windows 10 menjadi lola alias loading lama. Mengatasi laptop lola karena kehabisan kapasitas memori sangatlah mudah kamu cukup menghapus file-nya saja lantas bagaimana…
Script HTML Bucin 2023 Terbaru Palingit.com - Script HTML Bucin - Merupakan sekumpulan kata-kata untuk mengungkapkan perasaan maupun hanya sekedar memberikan hiburan yang disajikan dalam bentuk HTML. Kumpulan Script HTML Bucin Terbaru Jika Benar…
Cara Membuat Tabel di Html, Lengkap dan Mudah Palingit.com - Ketika kamu membuat suatu website, kadang kamu memerlukan kolom untuk kebutuhan tertentu, misalnya data siswa, atau yang lainnya. Namun bagi kamu yang masih tahap pemula dalam dunia pemrograman,…
Tutorial Excel Lengkap untuk Pemula Palingit.com - Tidak dapat dipungkiri bahwa selain Microsoft Words, Excel juga menjadi program yang harus kamu kuasai saat ini. Tidak hanya untuk pekerjaan yang sifatnya administratif, ada banyak bidang…
Tutorial Canva Lengkap untuk Pemula Palingit.com - Kamu pasti sudah tidak asing dengan nama Canva, bukan? Aplikasi ini memang cukup populer dan sangat membantu dalam dunia desain. Nah, buat kamu yang masih awam dan ingin…
7 Cara Mengecek Kesehatan Baterai Oppo Palingit.com - Siapa yang pengguna HP Android Oppo sejak lama? Eits, jangan asal pakai-cas-pakai-cas, ya. Kamu perlu mengecek kesehatan baterai (battery health) secara berkala untuk tahu performa HP-mu. Butuh tutorial…
Cara Membuat Script HTML Bucin versi Minta Maaf ke Doi Palingit.com - Kali ini saya akan membagikan sebuah cara membuat Script HTML Bucin versi Minta Maaf ke Doi. Berikut ini tautan yang bisa langsung kalian salin dan lihat hasilnya: Demo…
11 Daftar Aplikasi Nonton Film Gratis di Android TV Palingit.com - Perubahan aturan terhadap penggunaan TV digital membuat setiap orang mencari solusinya. Solusi terbaiknya dengan memilih jenis Android TV, sehingga tidak membutuhkan antena analog lagi. Dengan begitu, akan lebih…
8 Game Tembak-tembakan Android Offline Terbaik, Seru Abis Palingit.com - Game tembak-tembakan Android offline terbaik bisa kamu dapatkan dengan mengunduh berbagai jenis permainan menarik. Game ini sangat populer dan bisa kamu mainkan terutama pada platform Android. Dengan kecanggihan…
Cara Mengembalikan Foto yang Terhapus di HP Secara Mudah Palingit.com - Banyak orang yang mencari informasi bagaimana cara mengembalikan foto terhapus di HP karena berbagai faktor. Bisa karena tidak sengaja menghapusnya, atau handphone yang di install ulang. Bisa jadi…
Cara Download Foto Profil Instagram dengan Mudah Palingit.com - Cara download foto profil instagram sangat berguna jika kita ingin mengunduh foto profil instagram yang menarik. Instagram merupakan salah satu platform media sosial yang populer di kalangan pengguna…
6 Cara Mengisi Formulir PDF di Laptop Gratis & Praktis Palingit.com - Formulir sering kali disimpan dalam format PDF yang tidak bisa diedit supaya isi tidak berubah. Lantas, bagaimana cara mengisi formulir PDF di laptop? Berbagai formulir menggunakan format PDF,…
5 Cara Mengatasi Icon Headset Selalu Muncul di Notifikasi HP Palingit.com - Cara mengatasi icon headset selalu muncul di notifikasi sebenarnya dapat dilakukan sendiri tanpa harus membawanya ke counter secervis, simak tutorialnya! Mengatasi icon headset muncul terus di notifikasi bisa…
4+ Cara Mengatasi Aplikasi Tidak Menanggapi, Terbukti… Palingit.com - Pernahkah aplikasi pada ponsel Anda tidak merespon saat digunakan? Kondisi ini sebenarnya cukup umum terjadi, dan biasanya bisa normal kembali setelah dibiarkan beberapa saat. Namun, akan lebih baik…
Cara Upgrade Processor Laptop Dengan Mudah dan Aman Palingit.com - Cara upgrade processor laptop sebenarnya sangat mudah, akan tetapi perlu melakukan penyesuaian untuk menghubungkan beberapa komponen sehingga dapat merakit dan juga mempermudah proses upgrade. Mungkin ada beberapa yang…
Terapkan 6 Tips Ini Agar Menyerap Ilmu Jadi Lebih Mudah! Palingit.com - Menyerap Ilmu - Siapa di sini kalau belajar materi yang diberikan guru sering sulit konsentrasi? Niat hati buka HP ingin menuntut ilmu, malah pusing setengah mati karena otak…