UBB Perspective
Universitas Bangka Belitung
Artikel UBB
Universitas Bangka Belitung's Article
01 Agustus 2008 | 07:22:40 WIB
Dasar Dasar HTML untuk Design Website atau Blog
Ditulis Oleh : Admin
Sebuah Web atau Blog tidak bisa lepas dari yang namanya HTML (Hyper Text Mark up Language) karena HTML inilah yang mendasari sebuah web/blog. Walaupun sekarang kita bisa membuat web/blog hanya dengan klak-klik mouse tapi setidaknya kita harus sedikit mengerti tentang dasar-dasar HTML, ya tho?. Dalam tutorial kali ini kita tidak akan membahas tentang semua dasar-dasar HTML tapi kita akan mempelajari tag-tag atau kode-kode penting yang sering digunakan dalam membangun sebuah web/blog misalnya cara membuat link, menampilkan gambar, mengganti warna font, membuat barus baru dll. Ok marikita mulai pelajaranya :
* CARA MEMASUKKAN GAMBAR
kode :
<img src="https://ubb.ac.id/gambar.jpg" border="0" height="17" width="90">
keterangan :
yang warna biru adalah lokasi gambar kamu.
height="17" width="90" adalah ukuran lebar dan tinggi gambar
hasil :
* CARA MEMBUAT LINK
Kode :
<a href="https://www.ubb.ac.id" >UBB </a>
Keterangan :
Text warna biru adalah link yang dituju.
Tulisan "UBB" adalah tulisan yang ditampilkan.
Jika ingin yang dikasih link bukan tulisan melainkan gambar maka ganti tulisan tersebut dengan kode gambar seperti diatas, sehinga kodenya akan seperti ini :
<a href="https://www.ubb.ac.id" target="_blank"><img src="https://www.ubb.ac.id/gambar.jpg" border="0" height="17" width="90"> </a>
Jika ingin link yang dituju dibuka dalam window baru maka tambahkan kode target="_blank" setelah kode "https://www.ubb.ac.id"
Hasil :
UBB
(dibuka pada window yg sama)
(dibuka pada window baru)
* CARA MENGETENGAHKAN TEXT/GAMBAR
Kode :
<center>text</center>
Keterangan :
Ganti tulisan "text" dengan tulisan yana kamu inginkan, tau bisa juga diganti dengan gambar
* CARA MEMBUAT BARIS BARU
Kode :
<br>
Keterangan :
Tambahkan kode tersebut sebelum objek (text/gambar) yang dinginkan
* MEMBUAT HURUF TEBAL, MIRING DAN BERGARIS BAWAH
Kode :
<b>text</b>
<i>text</i>
<u>text</u>
Hasil :
Tebal
Miring
Garis Bawah
* MEMBERI WARNA TEXT
<font color="#FF0000"> text merah</font>
<font color="#FF6600"> text orange</font>
Keterangan :
Ganti text yang dicetak tebal dengan warna atau kode warna kesukaanmu.
Hasil :
text merah
text orange
* KODE-KODE WARNA
Warna Kode #000000 #999999 #FFFFFF #FF0000 #00FF00 #0000FF #FFFF00 #00FFFF #FF00FF #9900FF #FF6600
Kode-kode Warna untuk HTML
Di dalam dunia web/blog, warna itu sangat penting dan sangat berpengaruh terhadap penampilan web/blog. Warna-warna biasanya digunakan untuk background, text, links, table dll. Kalau kombinasi warna pada web/blog kita tidak sesuai, atau tidak enak dipandang mata mata, maka hal itu akan membuat pengungjung web/blog kita menjadi kurang nyaman, dan kemungkinan akan malas untuk mengunjungi blog kita lagi. Tapi karena untuk untuk membuat warna-warna ini harus menggunakan kode-kode warna, maka bagi yang tidak begitu mahir tentang html akan kesulitan untuk mendapatkan kode-kode warna ini.PENULISAN KARAKTER-KARAKTER KHUSUS
Oleh karena itulah dibawah ini dibuat Chart HTML Kode Warna bagi yang membutuhkan kode-kode warna.
Cara penggunaannya cukup mudah, tinggal klik warna yang dipilih, maka kode warnanya akan tampil di kotak "kode warna:".
Ada beberapa karakter yang tidak bisa ditulis secara langsung, jika ditulis maka akan hilang atau berubah, jadi untuk menuliskanya harus menggunakan kode-kode tertentu, berikut ini contoh karakter-karakter tersebut :
Karakter | Kode |
> | > |
< | < |
& | & |
" | " |
(spasi) | |
Cara Membuat Kotak Blogroll dan Marquee
Ada dua macam kotak blogroll yaitu:
1. Kotak Blogroll Model Textarea
Cara membuatnya :
Pasang code berikut ini di kedalam element (Page Element --> Add Page Element --> HTML /Javascript)
<div style="border: 1px solid rgb(153, 153, 153);keterangan:
overflow: auto;
width: 200px;
height: 200px;
text-align: center; ">
#link1 <br />
#link2 <br />
#link3 <br />
#link...
</div>
- Kode width: 200px; dan height: 200px; adalah ukuran lebar dan panjang kotak, kita bisa merubahnya dan menyesuaikanya dengan ukuran yg disuka.
- Ganti tulisan "#link1,#link2, #link3 dst" dengan daftar link-link, juga bisa diisi dengan banner link.
- Jika ingin daftar link-linknya berjajar, maka hilangkan kode <br />
2. Kotak Blogroll Model Marquee
Kotak ini juga mampu menampung banyak link dalam tempat yang sempit. Namun kotak blog roll ini berbeda dengan kotak yg diatas, karena kotak yang ini tidak memiliki rollbar (yg biasanya disebelah kanan trus ditarik keatas kebawah). Link-link atau isi didalam kotak ini akan bergerak/berjalan, bisa vertikal ato horizontal. Cara membuatnya :
Pasang code berikut ini di kedalam element (Page Element --> Add Page Element --> HTML /Javascript)
<MARQUEE align="center" direction="up" height="100" scrollamount= "2"
onmouseover='this.stop()' onmouseout='this.start()' width="95%" >
#link1 <br />
#link2 <br />
#link3 <br />
#link...<br />
</marquee>
Keterangan :
- Kode "up" itu menunjukan arah pergerakan, kamu bisa menggantinya dengan down, left, right (udah mudeng to artinya, gak usah dijelasin ya).
- Jika kamu menggantinya dengan pergerakan horizontal (left ato right) maka hilangkan kode <br />.
- Angka "100" menunjukkan tinggi dari kotak blogroll kamu. Semakin banyak angkanya maka semakin tinggi pula ukuran blogroll.
OK SELAMAT MENCOBA......
Source :
UBB Perspectives
FAKTOR POLA ASUH DALAM TUMBUH KEMBANG ANAK
MEMANFAATKAN POTENSI NUKLIR THORIUM DI KEPULAUAN BANGKA BELITUNG : PELUANG DAN DAMPAK LINGKUNGAN
Pengaruh Sifat Fisika, Kimia Tambang Timah Terhadap Tingkat Kesuburan Tanah di Bangka Belitung
Akuntan dan Jurnalis: Berkolaborasi Dalam Optimalisasi Transparan dan Pertanggungjawaban
Sustainable Tourism Wisata Danau Pading Untuk Generasi Z dan Alpa
Perlunya Revitalisasi Budaya Lokal Nganggung di Bangka Belitung
Semangat PANDAWARA Group: Dari Sungai Kotor hingga Eksis di Media Sosial
Pengaruh Pembangunan Produksi Nuklir pada Wilayah Beriklim Panas
Pendidikan dan Literasi: Mulailah Merubah Dunia Dari Tindakan Sederhana
Mengapa APK Perguruan Tinggi di Babel Rendah ?
Dekonstruksi Cara Pikir Oposisi Biner: Mengapa Perlu?
PENINGKATAN KUALITAS PELAYANAN PUBLIK DENGAN ASAS GOOD GOVERNANCE
UMP Bangka Belitung Naik, Payung Hukum Kesejahteraan Pekerja atau Fatamorgana Belaka?
Peran Generasi Z di Pemilu 2024
Pemilu Serentak 2024 : Ajang Selebrasi Demokrasi Calon Insan Berdasi
Menelusuri Krisis Literasi Paradigma dan Problematik di Bumi Bangka Belitung
Jasa Sewa Pacar: Betulkah Menjadi sebuah Solusi?
Peran Sosial dan Politis Dukun Kampong
Mahasiswa dan Masalah Kesehatan Mental
Analogue Switch-off era baru Industri pertelevisian Indonesia
Di Era Society 50 Mahasiswa Perlu Kompetensi SUYAK
HUT ke-77 Kemerdekaan Republik Indonesia, sudah merdekakah kita?
Pemblokiran PSE, Pembatasan Kebebasan Berinternet?
Pentingnya Pemahaman Moderasi Beragama Pada Mahasiswa di Perguruan Tinggi Umum
SOCIAL MAPPING SEBAGAI SOLUSI TATA KELOLA SUMBER DAYA ALAM
Bisnis Digital dan Transformasi Ekonomi
Masyarakat Tontonan dan Risiko Jenis Baru
Penelitian MBKM Mahasiswa Biologi
PEREMPUAN DI SEKTOR PERTAMBANGAN TIMAH (Refleksi atas Peringatan Hari Kartini 21 April 2022)
Kiat-kiat Menjadi “Warga Negara Digital” yang Baik di Bulan Ramadhan
PERANG RUSIA VS UKRAINA, NETIZEN INDONESIA HARUS BIJAKSANA
Kunci Utama Memutus Mata Rantai Korupsi
Pengelolaan Sumber Daya Air yang Berkelanjutan
SI VIS PACEM PARABELLUM, INDONESIA SUDAH SIAP ATAU BELUM?
KONKRETISASI BELA NEGARA SEBAGAI LANGKAH PREVENTIF MENGHADAPI PERANG DUNIA
Memaknai Sikap OPOSISI ORMAWA terhadap Birokrasi Kampus
Timah, Kebimbangan yang Tak akan Usai
Paradigma yang Salah tentang IPK dan Keaktifan Berorganisasi
Hybrid Learning dan Skenario Terbaik
NEGARA HARUS HADIR DALAM PERLINDUNGAN EKOLOGI LINGKUNGAN
Mental, Moral dan Intelektual: Menakar Muatan Visi UBB dalam Perspektif Filsafat Pierre Bourdieu
PEMBELAJARAN TATAP MUKA DAN KESIAPAN
Edukasi Kepemimpinan Milenial versus Disintegrasi
Membangun Kepemimpinan Pendidikan di Bangka Belitung Berbasis 9 Elemen Kewarganegaraan Digital
Menuju Kampus Cerdas, Ini yang Perlu Disiapkan UBB
TI RAJUK SIJUK, DIANTARA KESEMPATAN YANG TERSEDIA
Mengimajinasikan Dunia Setelah Pandemi Usai
ILLEGAL MINING TIMAH (DARI HULU SAMPAI HILIR)
PERTAMBANGAN BERWAWASAN LINGKUNGAN
Inflasi Menerkam Masyarakat Miskin Semakin Terjepit
NETRALITAS DAN INTEGRITAS PENYELENGGARA PEMILU
Siapa Penjarah dan Perampok Timah ???
Menjaga Idealisme dan Kemandirian Pers
POLITIK RAKYAT DAN TANGGUNG JAWAB PEMIMPIN
Penelitian Rumpon Cumi Berhasil di Perairan Tuing, Pulau Bangka
Gratifikasi, Hati-Hatilah Menerima Sesuatu
Perairan Tuing, Benteng Sumberdaya Perikanan Laut di Kabupaten Bangka