Pengenalan HTML & CSS, Membuat Halaman HTML (1)

Close
Halo sobat blogger :D

Kali ini Saya mencoba membuat tutorial HTML dan CSS, sebelum mempelajari adakalanya kita mencari tahu terlebih dahulu apa itu HTML dan CSS.

Pengertian HTML

HTML(Hyper Text Markup Language) adalah salah satu dari bahasa pemrograman yang berbasis Web  yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuah Penjelajah web Internet dan formating hypertext sederhana yang ditulis kedalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi.

Pengertian CSS

CSS (Cascading Style Sheets) adalah bahasa pemrograman web yang digunakan untuk mengatur tampilan suatu dokumen HTML. Dalam konteks sebuah website, CSS dapat diartikan sebagai bahasa yang digunakan untuk mengatur tampilan / desain suatu halaman HTML.

Membuat Halaman HTML Sederhana

Pertama-tama siapkan tool/alat tempurnya :

1. Notepad++ (Download), Notepad biasa bawaan windows juga bisa pelajari caranya disini, atau bisa juga Adobe Dreamweaver, dan masih banyak lagi tool/software lainnya yang bisa digunakan, tapi disini ane akan menggunakan Notepad++

2.Web Browser. Mozzila Firefox, Google Chrome, dll.

Setelah peralatan sudah tersedia, sekarang mari kita coba belajar membuat HTML & CSS sederhana

- Buka Notepad++ 
- Klik tab File - New
- Lalu klik tab File - Save As, pada File name tuliskan  index , pada Save as type pilih Hyper Text Markup Language file (html... . Tampilan 1
- Lalu klik tab File - New lagi, kemudian File-Save As, pada File name tuliskan style , pada Save as type pilih Cascade Style Sheets File (*.css). Tampilan 2
- Setelah file index.html dan style.css terbuat, lanjut untuk mengisi file tersebut.
- Didalam setiap perintah pada bahasa pemrograman html selalu diawali tag < > dan diakhiri oleh tag < / >.
- Isi file index html tadi dengan script berikut ini :

<!doctype html>

<html>



</html>

- Diantara perintah <html> dan </html> inilah kita akan meletakkan kode-kode/ script untuk membangun sebuah halaman HTML. Sekarang akan kita coba untuk mengisi perintah didalamnya. Masukkan script ini diantara <html> dan </html>.

<head>
<title> Belajar HTML </title>
</head>

<body>
Ini Halaman HTML
</body>

Tag <head> dan </head> adalah tag untuk kita meletakkan title / judul dari sebuah halaman website, diantara tag ini juga kita dapat meletakkan perintah/kode CSS, jika ingin menggabungkan perintah CSS didalam halaman HTML.
Tag <body> dan </body> adalah tag untuk kita meletakkan segala perintah yang akan ditampilkan pada halaman HTML. 
- Save dokumen HTML nya dengan menekan tombol CTRL+S atau File - Save.
- Kemudian buka file index.html yang telah kita buat tadi.

thumbnail
- Agar dokumen style.css (CSS) nya include atau tergabung dengan dokumen HTML, salin / copy kode berikut ini diatas kode </head> :
 <link rel="stylesheet" type="text/css" href="style.css" />

Demikian tutorial ini Saya buat semoga bermanfaat bagi sobat sekalian, untuk tutorial berikutnya klik Tutorial Membuat Tabel Halaman HTML (2).

Terimakasih telah berkunjung dan membaca artikel di Blog ini. Tinggalkan kritik, saran, dan pertanyaan pada kolom komentar.