HTML Bagian-5 (Format Text)

Pada tutorial ini kita akan membahas tentang pengolahan text menjadi tebal, miring, dan tanda-tanda tertentu.

<b> untuk menebalkan text

<strong> teks yang penting

<i> teks miring biasanya menandakan bahasa, istilah-istilah tertentu

<em> hasilnya sama miring tapi tujuannya untuk penekanan

<mark> teks yang ditandai

<small> teks kecil

<del> teks yang dihapus

<ins> teks yang disisipkan

<sub> teks subskrip

<sup>Teks Superscript

untuk lebih jelas dapat kita lihat pada perintah di bawah ini

jika dijalankan di browser maka akan tampil seperti gambar di bawah ini

HTML Bagian-4 (Dasar-2)

Pada tutorial sebelumnya kita telah membahas tentang dokumen html, tag-tag utama dan headings. Pada turorial ini kita akan membahas tentang paragraph, link dan image dalam HTML.

HTML Paragraphs

untuk mendefinisikan paragraphs gunakan perintah <p> dan ditutup dengan </p>.

HTML Link

Continue reading “HTML Bagian-4 (Dasar-2)”

HMTL Bagian-3 (Dasar-1)

Pada tutorial bagian ketiga ini, kita pelajari dasar syntax HTML, untuk mempemudah pembahasan kita pisah menjadi beberapa bagian.

Dokumen HTML

Setiap dokumen HTML selalu didahului dengan syntax

perintah di atas agar browser dapat menampilkan data yang kita kirim dengan benar, dan menyatakan bahwa kita menggunakan HTML5. Perintah ini diletakkan paling atas. Setelah itu tag pembuka pada dokumen HTML yaitu <html> dan diakhiri dengan </html>

Continue reading “HMTL Bagian-3 (Dasar-1)”

HMTL Bagian-2 (Editor)

Setelah memahami dasar dari struktur HTML pada tutorial bagian pertama, selanjutnya kita perlu memahami editor yang dapat digunakan ketika mempelajari HTML, pada tutorial ini hanya 3 editor yang akan di bahas

NOTEPAD

Aplikasi bawaan windows ini dapat digunakan sebagai editor untuk mempelajari dan mempraktikkan syntax HTML. sebagai contoh perhatikan gambar di bawah ini

Notepad

setelah selesai mengetik perintah di atas, klik file dan save as, perhatikan kotak dialog di bawah ini

Proses Penyimpanan FIle

ketik nama file pada file name sebagai contoh index.html, pemberian nama harus diakhiri dengan ekstensi filenya yaitu .html. Simpan file pada folder khusus, sehingga data kita tersusun dengan rapi.

NOTEPAD ++

Untuk editor yang kedua yaitu notepad++, perhatikan gambar di bawah ini

Notepad++

silahkan simpan dengan mengklik file >> Save as dan beri nama.

Visual Studio Code

Editor ketiga ini Visual Studio Code, perhatikan contoh di bawah ini

VS CODE

selanjutnya simpan dan jalankan.

Setelah selesai mengetik perintah di atas, kita coba jalankan. Silahkan buka windows explorer untuk menjalankan file yang sudah dibuat.

klik kanan pada file index.html dan klik open with dan pilih browser yang biasa digunakan.

File index.html ketika dibuka dengan browser

sekian

HTML Bagian-1 (Intro)

HTML merupakan singkatan dari Hyper Text Mark Up Language, Bahasa HTML adalah bahasa yang sederhana dan hanya memiliki sedikit kesulitan. Bahasa yang merupakan dasar dari framework Internet ini ditemukan oleh Tim Berners-Lee pada tahun 1989. Hampir setiap situs web menggunakan bahasa ini, entah sekedar menampilkan texs, animasi, tampilan grafis ataupun suara. Bahasa HTML sebenarnya berasal dari bahasa lama yang disebut dengan SGML (Standard Generalized Markup Language). beberapa versi telah dikembangkan dan sampai saat ini HTML 5.

Pada pengenalan ini perlu dipahami struktur dasar dari HTML sebagai berikut:

Keterangan:

<!DOCTYPE html> mendefinisikan bahwa ini merupakan HTML5

<html> Perintah dasar pembuka untuk dokumen HTML

<head> bagian yang akan memuat informasi tentang halaman HTML, memasukan perintah external untuk memanipulasi tampilan HTML dan interaksi web dengan pengguna.

<title> judul dari halaman HTML yang tampil di browser web

<body>secara singkat seluruh yang akan ditampilkan pada website

<p> untuk mendefinisikan paragrap

Secara singkat perintah HTML selalu berpasangan seperti <body> dan </body>, namun ada juga yang self enclosed seperti <br/> untuk membuat baris baru.