Cara Membuat Halaman Sederhana dengan HTML - Tempat Belajar Asyik Seputar Dunia Website

Artikel Terkini

Post Top Ad

Senin, 24 Juli 2017

Cara Membuat Halaman Sederhana dengan HTML

Okeh broo setelah kita sudah berusaha mengenal dan mempelajari tentang HTML, apa itu tag html, dan sudah mengerti struktur dasar html, serta sudah mengerti bagaimana cara penggunaannya, kini tiba saatnya broo untuk membuat sebuah halaman dengan HTML.

Pada kesempatan kali ini kita akan membahas cara membuat website sederhana dengan html 5, sebelumnya anda diharapkan sudah mengerti tag html, dan sudah mengerti struktur dasar html, karena pada tutorial kali ini, admin sudah tidak akan menjelaskan secara mendetail mengenai struktur dan tag pada HTML, tutorial ini hanya menjelaskan secara garis besar fungsi dari elemen yang akan kita gunakan dalam membuat halaman html.

Dan sekarang kita akan mencoba membuat halaman yang cukup sederhana dengan menggunakan bahasa HTML seperti gambar dibawah ini.



Cukup sederhana kan? Hal ini cukup mudah kok untuk di praktekan. apalagi kalo kalian sudah mengerti cara penggunaan tag pada html dan struktur dasar html, Sekarang ane mau jelasin tag html apa saja yang digunakan untuk membuat halaman seperti gambar diatas. Berikut tag tag html yang digunakan untuk membuat halaman website seperti di atas.
  1. Tag <h1> Berfungsi untuk membuat judul 
  2. Tag <h2> Berfungsi untuk membuat sub-judul (ukuran font lebih kecil daripada tag <h1> )
  3. Tag <p> Berfungsi untuk membuat text paragraf
  4. Tag <b> Berfungsi untuk membuat bold pada suatu text
  5. Tag <br /> Membuat baris baru
  6. Tag <ol> berfungsi untuk membuat list urutan dengan nomor
  7. Tag <ul> berfungsi untuk membuat list urutan dengan symbol

Note :
Jangan lupa untuk penempatannya setelah tag <body> yah guys, atau jika masih kurang jelas cobalah baca lagi tentang struktur dasar html,

Ada yang berbeda untuk penggunaan tag <ol> dan tag <ul>, tag ini membutuhkan sub tag yang bernama tag <li>..</li> berfungsi untuk memberikan urutan textnya. Jadi setiap urutan memerlukan tag <li>, untuk lebih jelasnya bisa dilihat script yang dilampirkan dan pastinya di coba, mudah kok guys. Tetap semangat guys untuk mencobanya.

Agar lebih mudah dan simple, ane lampirkan scriptnya nih..
<!DOCTYPE HTML>
<head>
<meta http-equiv="content-type" content="text/html" />
<meta name="author" content="IndoNgoding" />
<title>Belajar HTML</title>
</head>
<body>
    <h1>Belajar Membuat Halaman Dengan HTML</h1>
 
    <p>HTML atau Hypertext Markup Language adalah dasar dari semua halaman web di internet. Jika anda ingin mempelajari cara membuat website, maka Tutorial Belajar HTML Dasar Untuk Pemula di IndoNgoding lah yang paling mudah, simple dan ringan untuk dipelajari. ini adalah halaman HTML pertama yang kalian buat.<br />
    Disini kita mencoba menggunakan beberapa tag dalam html untuk membuat suatu halaman dalam html. apa saja tag yang digunakan, <b>berikut adalah tag yang kita gunakan</b>
 
    <ol>
        <li>Tag "h1" yang artinya membuat title dengan format heading1</li>
        <li>Tag "p" sebagai element Paragraf</li>
        <li>Tag "b" untuk membuat </li>
        <li>Tag "ol" untuk membuat urutan dengan angka</li>
    </ol>
 
    </p>
 
    <h2>Lanjutan Penggunaan Sub Heading</h2>
    <p>
    Ini adalah paragraf baru, biar lebih baik dan lebih rapi, boleh kok menggunakaan lebih dari satu element paragraf dalam HTML, jika kalian sudah paham dalam membuat ini berarti kalian sudah lulus dalam membuat html, silahkan dicoba diulang dengan kalimat dan kata kata yang berbeda.<br />
    materi selanjutnya yang akan admin indo ngoding bahas selanjutnya adalah css, apa saja yang akan kita bahas, berikut urutan nya :
    <ul>
        <li>Penjelasan singkat tentang css</li>
        <li>penggunaan css</li>
        <li>implementasi penggunaan css dan html</li>
    </ul>
 
    okeh guys sekian.<br /><br /><br /><br />
    Salam Indonesia Hebat<br />
    Salam Indo Ngoding
    </p>
 
</body>
</html>

Selamat mencoba dan kreasikan dengan menambahkan tag tag yang kalian telah pelajari sebelumnya. atau kalian bisa coba dengan tag tag baru atau download kumpulan tag tag html

Salam Indonesia hebat



Tidak ada komentar:

Posting Komentar

Post Top Ad

Responsive Ads