Pages

Monday, June 8, 2020

Belajar Memahami Dasar-Dasar HTML untuk Pemula

Belajar Memahami Dasar-Dasar HTML untuk Pemula - HTTP (Hypertext Transfer Protocol) merupakan protokol yang digunakan untuk mentransfer data antara web server ke web browser. Protokol ini mentransfer dokumen-dokumen web yang ditulis atau berformat HTML (Hypertext Markup Language).

Dikatakan markup language lantaran HTML berfungsi untuk 'memperindah' file teks biasa buat ditampilkan dalam acara web browser, hal ini dilakukan menggunakan menambahkan elemen atau acapkali diklaim sebagai tag-tag dalam file teks biasa tersebut.

Saat ini sudah dikenal dengan HTML5 yg menunjukkan banyak sekali fitur menarik yang tidak didukung oleh HTML sebelumnya. Beberapa fitur yang tersedia pada HTML5 antara lain sebagai berikut.

Belajar Dasar-Dasar HTML
Www.Codepolitan.Com

  • Canvas. Memungkinkan pembuatan gambar dalam kanvas. Jadi, gambar tidak lagi diambil dari gambar utuh, melainkan bisa disusun sendiri, bak menggunakan program Paint.
  • Header. Berguna untuk menyatakan suatu judul, yang bisa diisi dengan elemen logo dan nama perusahaan.
  • Footer. Merupakan kebalikan dari Header. Sebagai catatan kaki, elemen ini berguna untuk menaruh informasi di bagian bawah halaman web.
  • Time. Elemen ini berguna untuk menyajikan informasi tentang waktu.
  • Audio. Memungkinkan penyajian player untuk memutar suara.
  • Video. Memungkinkan player untuk memainkan film.

Secara prinsip, fitur dalam HTML dapat dikelompokkan ke dalam :

  • Struktur halaman ;
  • Presentasi visual ;
  • Piranti penyaji gambar ;
  • pendukung media ; dan
  • peningkatan koneksi dengan JavaScript.

Tag HTML biasanya berupa tag-tag yang berpasangan dan ditandai dengan simbol lebih besar (<) dan (>). Pasangan dari sebuah tag ditandai dengan symbol garis miring (/). Misalnya pasangan dari tag <contoh> adalah </contoh>.

Dalam hal ini <contoh> kita sebut sebagai elemen dan biasanya dalam suatu elemen terdapat atribut-atribut untuk mengatur elemen itu. Jadi misalnya elemen <contoh> bisa ditulis dengan atributnya sebagai berikut:

<contoh atribut1="nilai_atribut1"atribut2="nilai_atribut2="....>

Dalam penulisan tag HTML tidaklah case sensitive ialah penggunaan huruf kecil ataupun modal tidaklah menjadi sebuah perkara yang akbar.

Struktur Dasar Dokumen HTML

Setiap dokumen HTML memiliki struktur dasar atau susunan arsip menjadi berikut :

<HTML>

<head>

<title>Ini Judul</title>

</head>

<body>

Berisi text, gambar, ataupun yg tampil dalam dokumen web.

</body>

</HTML>

Seperti terlihat, struktur file HTML diawali dengan sebuah tag <HTML> dan ditutup dengan tag </HTML>. Di dalam tag ini terdapat dua buah bagian besar, yaitu yang diapit oleh tag <head>...</head> dan tag <body>......</body>.

Bagian yang diapit oleh tag HEAD merupakan header dari halaman HTML dan tidak ditampilkan pada browser. Bagian ini berisi tag-tag header seperti <title>....</title> yang berfungsi untuk mengeluarkan judul pada title bar window web browser.

Bagian kedua, yg diapit sang tag BODY merupakan bagian yg akan ditampilkan dalam page web browser nantinya. Pada bagian ini Anda akan menuliskan seluruh jenis liputan berupa teks dengan bermacam format maupun gambar yg ingin disampaikan pada pengunjung nantinya.

Pengaturan Properti Dokumen

Properti dokumen diatur melalui atribut-atribut yang terdapat dalam elemen <body>. Sebagai contoh adalah pengaturan warna latar belakang halaman, warna teks, warna link dan lain-lain.

Kode Warna

Dalam pengaturan rona memakai kode RGB yang mana ditampilkan dalam nilai hexadesimal. Setiap bagian 2 digit kode menampakan banyaknya intesitas menurut kombinasi warna merah, hijau & biru. Berikut ini adalah model kode warna:

White = #FFFFFF

Red = #FF0000

Blue = #0000FF

Cyan = #00FFFF

Black = #000000

Green = #00FF00

Yellow = #FFFF00

Chocolate = #5C3317

Pink = #FF6EC7

Atribut elemen <body>

Background = lokasi & nama arsip (latar belakang image dokumen)

BGCOLOR = Warna (warna latar belakang dokumen, default putih)

Text = Warna (rona teks dokumen, default hitam)

Link = Warna (rona link dokumen, default biru)

Vlink = Warna (warna visited link dokumen, default ungu)

Alink = Warna (rona aktif link dokumen, default merah)

Elemen Heading <h1>.....<h6>

Tag heading berfungsi untuk memformat heading (judul dan sub judul) dari suatu halaman web. Heading ini akan memperbesar ukuran huruf untuk setiap jenis heading. Heading yang kita kenal di HTML, yaitu dari <h1> sampai <h6>

Elemen yg dihilangkan di HTML5

Berikut ini elemen HTML 4.01 yg dihilangkan pada HTML5:

  • <acronym>
  • <applet>
  • <basefont>
  • <big>
  • <center>
  • <dir>
  • <font>
  • <frame>
  • <frameset>
  • <noframes>
  • <strike>
  • <tt>

Dokumen HTML5

Sebuah dokumen HTML5 misalnya berikut adalah, cukup ditulis dengan text editor ataupun HTML editor:

<! DOCTYPE HTML>

<HTML>

<head>

<title>contoh HTML5</title>

</head>

<body>

selamat belajar HTML5

</body>

</HTML>

Berikut ini adalah penerangan menurut dokumen HTML5 diatas:

  • Sebuah dokumen HTML5 diawali dengan <! DOCTYPE HTML>
  • Tanda <HTML> disebt tag. Sebuah tag seperti itu menyatakan sebuah elemen dalam dokumen html
  • Beberapa tag berpasangan, sebagai contoh <head> berpasangan dengan </head>
  • Namun, tidak semua tag berpasangan, sebagai contoh <br> tidak punya pasangan. Khusus untuk tag seperti ini, tidak ada keharusan untu menyertakan tanda / sebelum >. Pada XHTML, tanda seperti / memang diharuskan untuk ditulis
  • Pasangan <HTML>....</HTML> menyatakan awal dokumen
  • Di dalam <HTML>....</HTML> terdapat pasangan <head>...</head> dan <body>....</body>
  • Pasangan <head>....</head> menyatakan bagian judul dokumen HTML. Isinya paling tidak berupa pasangan <title>....</title>
  • Pasangan <body>....</body> menyatakan bagian tubuh dokumen.

Baca pula:Definisi Sejarah Situs Website, Standar Web & Cara Kerja Web

Demikianlah artikel kali ini tentang Belajar Memahami Dasar-Dasar HTML untuk Pemula. Semoga bermanfaat bagi Anda. Sekian dan terimakasih.

Sumber: Ebook Pemrograman Web Sem 1

No comments:

Post a Comment