Rabu, 15 April 2015

Belajar HTML

Assalamualaikum wr.wb

oke disini saya akan menjelaskan tentang HTML. HTML atau Hyper Text Markup Language adalah salah satu aplikasi yang paling dasar digunakan oleh web programer. HTML digunakan untuk menghias tampilan web.


berikut langkah-langkah membuat html


  1. Klik Start, kemudian search notepad ++, atau kita bisa gunakan notepad biasa.
  2. Kemudian ketikkan kalimat di bawah ini sebagai contoh. Kemudian save dengan ekstensi Hyper Text Markup Language File dengan ekstensinya adalah .html atau .htm. Kemudian setelah selesai menyimpan maka tulisannya akan berubah, kalimat yang berada pada kurang dari dan lebih dari akan berubah warna menjadi biru. kemudian setelah di save kita dapat melihat halaman web kita maka akan tampil seperti pada gamabar ke 4.
HTML kita bisa kita ubah semenarik mungkin, kita dapat menyisipkan foto, video, atudio, kemudian mengubah background dan lainnya. Sebelumnya kalian pasti bertanya-tanya kenapa harus ada tanda kurang dari dan sebagainnya,
Tanda kurang dari dan lebih dari digunakan sebagai tag untuk menutup elemen atau kata yang berada didalamnya, pada sebuah kode biasanya sepasang pembuka dan penutup, contoh <html> maka pada bagian paling akhir ditutup dengan </html>.
Catatan: untuk setiap penutup sama seperti bagian pembuka, tetapi setelah tanda kurang dari diberi tanda garis miring.

Oke selanjutnya akan saya bahas bagaimana menghias HTML kita,
1. Pada judul kita buat 6, yaitu <h1> sampai dengan <h6>. Disini <h1> akan memiliki font terbesar dibandingkan yang lain dan <h6> adalah font terkecil. lihat saat sudah menjadi html.


2. Untuk membuah form yang didalamnya berisi tabel, maka kita dapat memasukan kode seperti ini
a. untuk mengubah warna background dapat dilakukan dengan
bgcolor = warna, warna didapat dengan mengkopi kode yang didapat pada alamat web berikut www.color-hex.com. caranya sangat mudah bukan hanya dengan mengisikan kode warna yang kita sukai pada bgcolor = warna.

b. <td> adalah kepanjangan dari table data yang digunakan untuk membuat isi dari th atau barsi seperti cell.
c. <tr> adalah kepanjangan dari table row yang digunakan untuk mendefinisikan baris pada tabel.

d. fungsi input type submit size dan align pada kode diatas adalah untuk membuat tabel tersebut berada di tengah dan mengatur besarnya atau ukuran tabel.

3. Ordered and Unordered List
Pada kode diatas terjadi perbedaan antara <ul> yang digunakan untuk membuat bullets, dengan  <ol> yang digunakan untuk membuat numbering.

4. Membuat teks dan gambar bergerak kemudian menyisipkan gambar dan audio.
perhatikan kode berikut ini :
Pada kode diatas menunjukkan bgcolor yang telah dijelaskan diatas untuk membuat background berwarna, kemudian pada nomor 2 adalah <marquee> yang digunkan untuk membuat teks atau gambar bergerak ke kanan atau ke kiri. maka untuk mengatur teks atau gambar bergerak ke arah yang kita sukai gunakan perintah direction kemudian arah. contoh: <marquee direction ="right">.
untuk membuat gambar bergerak maka lakukan seperti teks tetapi sisipkan gambar caranya
<img src = "nama foto.jpg" width ...% height=...%>
untuk membuat keterangan gambar dapat dilakukan dengan kode 
<figcaption><strong> keterangan gambar </strong></fightcaption>

kemudian untuk menyisipkan audio, sama halnya dengan menyisipkan sebuah foto yaitu :
<source src = "nama lagu.mp3" type="audio/mpeg">
maka akan tampil seperti di bawah ini


5. Menyisipkan video
menyisipkan sebuah video sama halnya dengan menyisipkan sebuah audio hanya saja berbeda typenya, caranya adalah:
<source src = "alamat video.mp4" type="video/mp4">
untuk video, misalnya kita ambil dari youtube klik bagikan kemudian ada alamat embbed kemudian copy. masukkan alamat pada kode yang akan kita buat.
setelah pengkodean selesai maka muncul tampilan seperti di bawah ini 


Catatan: untuk menyisipkan sebuah foto, audio maka filenya harus berada dalam satu folder dengan file html.

Sekian penjelasan dari saya, terima kasih sudah berkunjung ke blog saya. :D





0 komentar:

Posting Komentar