Langkah-Langkah belajar html secara online:
- Buka github.com di google chrome
- Daftar dengan akun outlook
- Ikuti arahan
- Setelah website kita terdaftar lalu klik tombol (+) di sebelah kanan atas
- klik new repository
- Isi kolom repository name dengan index.html lalu klik create repository di paling bawah biasanya berwarna hijau
- klik index.html
- Isi teks yang ada dengan pola
- Kirim teks
- Lihat hasil di new tab (tab yang baru) dengan alamat: nama akun kita.github.io/index.html contoh triyonosaputra.github.io/index.html
Yang di maksud pola di atas adalah sebagai berikut:
<html>
<head>
</head>
<body>
</body>
</html>Pastikan pola tersebut tersusun dengan rapi .Jika sistem tidak berjalan cek semua dengan teliti apakah sudah benar-benar tepat. Kurang atau kelebihan 1 hurufpun tidak bisa terbaca oleh computer,atau bahkan jika pola tidak tersusun dengan rapi ,hasilnya nanti tidak sesuai dengan apa yang kita inginkan
Pola yang dimaksud diatas adalah kode,dan itu kerangka utamanya. Tanda lebih dari dan kurang dari itu disebut tag. Setiap pembuka pasti ada penutup dan penutupnya dikasih tanda garis miring/ , contoh sepeerti diatas tadi yaitu dibuka dengan <html> ditutup dengan </html>.
Dan yang diatas itu masih berupa kerangka belum ada isinya. Isi berada didalam body yaitu di tengah-tengah pembuka body dan penutup body dan lebih sedikit menjorok kedalam.
Contoh:
<html>
<head>
</head>
<body>
<h1>
bapak sedang bekerja mencari nafkah
</h1>
</body>
</html>Isi terletak di dalam body. dan di dalam isi banyak kode-kode yang harus di pelajari,contohnya:
- p = paragraf
- b = blok
- h1 = judul
- h2 = sub judul dari h1
- h3 = sub judul dari h2
- h4 = sub judul dari h3
- h5 = sub judul dari h4
- h6 = sub judul dari h5
Pastikan semua dibuka dan ditutup sama seperti kearngkanya yang di atas.
Contoh:
<html>
<head>
</head>
<body>
<h1>
judul
</h1>
<p>
Paragrap
isi sesuai apa yang akan
di tulis sesuai judul
yang di buat
</p>
<h2>
sub judul
</h2>
<p>
Paragrap
isi sesuai apa yang akan
di tulis sesuai sub judul
</p>
<h3>
sub judul
</h3>
<p>
Paragrap
isi sesuai apa yang akan
di tulis sesuai sub judul
</p>
</body>
</htmlDan seterusnya. Code-code untuk pelajaran hari ini baru itu dan akan di sambung di pelajaran selanjutnya.
