Belajar Html Dasar Bagi Pemula Dengan mudah

HyperText Markup Language (HTML) adalah sebuah bahasa markup 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.
Belajar Html Dasar Bagi Pemula Dengan mudah
Belajar Html Dasar Bagi Pemula Dengan mudah


1. HTML DASAR

A. STRUKTUR DASAR DOKUMEN HTML
HTML merupakan singkatan dari HyperText Markup Language adalah script untuk menyusun dokumen-dokumen Web. Dokumen HTML disimpan dalam format teks reguler dan mengandung tag-tag yang memerintahkan web browser untuk mengeksekusi perintah-perintah yang dispesifikasikan.
baca juga : Basic Tag HTML, Mengenal Perintah Dasar Pada HTML

Struktur dasar HTML sebagai berikut.
  1. <html>
  2. <head>
  3. <title>Disini Judul Dokumen HTML</title>
  4. </head>
  5. <body>
  6.         Disini penulisan informasi Web dari freakprogrammer.com
  7. </body>
  8. </html>
Hasil
Belajar Html Dasar Bagi Pemula Dengan mudah

Dari Source code di atas dapat kita jelasakan.
  • Tag
Secara umum tag terdiri atas tag pembuka dan tag penutup untuk tag pembuka contohnya seperti <head> dengan tag < > dan untuk tag penutup contohnya seperti </head> dengan tag </ >.
  • Element
pada source code di atas kita ambil contoh dari element suatu html yaitu tag title 
<title> digunakan untuk pembuka element title
Disini Judul Dokumen HTML isi dari elemet title
</title> digunakan untuk penutup element title


Tag-tag yang ditulis secara berpasangan pada suatu element HTML,  tidak boleh saling tumpang tindih dengan pasangan tag-tag lainnya.
  • Contoh penulisan tag-tag yang benar
  1. <p>
  2.    < b>
  3.         penulisan tag html yang benar
  4.     </b>
  5. </p>
  • Contoh penulisan tag-tag yang salah
  1. <p>
  2.     <b>
  3.         penulisan tag html yang salah
  4.    /p>
  5. </b>
  • Attribute
Attribute mendefinisikan property dari suatu element HTML, yang terdiri atas nama dan nilai. Penulisannya adalah sebagai berikut:
  1. <TAG nama-attr="nilai belajar dari freakprogrammer">
  2.    .................
  3. </TAG>
Secara umum nilai attribute harus berada dalam tanda petik satu atau dua. Sebagai contoh, untuk membuat warna teks menjadi kuning dan latarbelakang halaman web menjadi hitam, penulisannya adalah
 <body background-color="black" text="white">
  • Element HTML
Menyatakan pada browser bahwa dokumen Web yang digunakan adalah HTML.
jadi jenis element html ini yang akan di ketahui oleh browser bahwa suatu halaman web di bagun oleh element HTML.
sintax html :
  1. <html>
  2. .......... //ini adalah element html
  3. </html>
  • Element HEAD
Head adalah kepala dari dokumen html dimana head berada di posisi atas. Tag <head> dan tag </head> terletak di antara tag< html> dan tag< /html>.
Sintax head;
  1. <html>
  2. <head>
  3. .......... //ini adalah element head
  4. </head>
  5. </html>
  • Element TITLE
Merupakan judul dari halaman web yang akan di tampilkan di browser. 
Belajar Html Dasar Bagi Pemula Dengan mudah
Sintax Title :
  1. <html>
  2. <head>
  3. <title> Freakprogrammer: Belajar pemograman Gratis </title>
  4. .......... 
  5. </head>
  6. </html>
hasil :
Belajar Html Dasar Bagi Pemula Dengan mudah
  • Element BODY
element body yang berperan menampilkan isi dokument html tag <body> berada di bawah </head> semuda yang akan di tampilkan di halaman web di letakan di dalam tag body 
Sintax Body :
  1. <html>
  2. <head>
  3. <title> Freakprogrammer: Belajar pemograman Gratis </title>
  4. .......... 
  5. </head>
  6. <body>
  7. ..........  //ini adalah contoh tag body
  8. </body>
  9. </html>
Selanjutnya belajar tag yang ada di dalam body
  • heading
heading adalah kepala judul di halaman web heading, umumnya heading terbag menjadi 6 tetapi ada yang mengatakan lebih dari 6 ada pula yang mengatakan heading cuma ada 4 tidak ada yang salah karena memiliki persepsi sendiri-sendiri. contoh heading dalam halaman web yaitu:
<heading 1><heading 2><heading 3><heading 4><heading 5><heading 6>
Sintax Heading :

  1. <html>
  2. <head>
  3. <title> Freakprogrammer: Belajar pemograman Gratis </title>
  4. .......... 
  5. </head>
  6. <body>
  7. <h1> contoh heading 1</h1>
  8. <h2> contoh heading 2</h2>
  9. <h3> contoh heading 3</h3>
  10. <h4> contoh heading 4</h4>
  11. <h5> contoh heading 5</h5>
  12. <h6> contoh heading 6</h6>
  13. </body>
  14. </html>
hasil:
Belajar Html Dasar Bagi Pemula Dengan mudah
  • paragraf
Paragraf merupakan sekumpulan kalimat yang saling berkaitan antara kalimat yang satu dengan kalimat yang lain.
di dalam halaman web paragraf di tandai dengan tag <p> sebagai pembuka dan </p> sebagai penutup 
penulisannya :
<p> belajar pemograman web sangat mengasyikan di freakprogrammer </p>
Sintax paragraf :
  1. <html>
  2. <head>
  3. <title> Freakprogrammer: Belajar pemograman Gratis </title>
  4. .......... 
  5. </head>
  6. <body>
  7. <h1> contoh heading 1</h1>
  8. <h2> contoh heading 2</h2>
  9. <h3> contoh heading 3</h3>
  10. <h4> contoh heading 4</h4>
  11. <h5> contoh heading 5</h5>
  12. <h6> contoh heading 6</h6>
  13. <p> belajar pemograman web sangat mengasyikan di freakprogrammer </p>
  14. </body>
  15. </html>
Hasil :
Belajar Html Dasar Bagi Pemula Dengan mudah

  • Huruf tebal
pembuatan huruf menjadi tebal di halaman web dengan memanfaatkan tag <b> sebagai pembuka dan </b> sebagai penutup
contoh :
<p> belajar pemograman web sangat mengasyikan di<b>freakprogrammer</b> </p>
sintax huruf tebal :
  1. <html>
  2. <head>
  3. <title> Freakprogrammer: Belajar pemograman Gratis </title>
  4. .......... 
  5. </head>
  6. <body>
  7. <p> belajar pemograman web sangat mengasyikan di<b> freakprogrammer</b> </p>
  8. </body>
  9. </html>
hasil :
  • Huruf Miring
pembuatan huruf menjadi miring di halaman web dengan memanfaatkan tag <i> sebagai pembuka dan </i> sebagai penutup
contoh :
<p> belajar pemograman web sangat mengasyikan di<b><i>freakprogrammer</i></b> </p>
Sintax huruf miring:
  1. <html>
  2. <head>
  3. <title> Freakprogrammer: Belajar pemograman Gratis </title>
  4. .......... 
  5. </head>
  6. <body>
  7. <p> belajar pemograman web sangat mengasyikan di <b><i> freakprogrammer</i> </b> </p>
  8. </body>
  9. </html>
hasil:
Belajar Html Dasar Bagi Pemula Dengan mudah
  • Enter
Pembuatan enter atau paragraf baru di kita menggunakan tag <br>
Sintax :
  1. <html>
  2. <head>
  3. <title> Freakprogrammer: Belajar pemograman Gratis </title>
  4. .......... 
  5. </head>
  6. <body>
  7. <p> belajar pemograman web sangat mengasyikan di <b> <br><i> freakprogrammer</i> </b> </p>
  8. </body>
  9. </html>
hasil :
Belajar Html Dasar Bagi Pemula Dengan mudah
Nah itulah tutorial Belajar Html Dasar Bagi Pemula Dengan mudah bagi anda yang mau belajar pemograman pemula lewat email bisa menghubungi admin dengan cara Klik disini
Jika ada yang ingin di tanyakan silahkan berkomentar di bawah.
Jika ingin membaca Ebook sederhana tentang Pemograman HTML bisa download Disini

You might also like

0 Comments

Silahkan berkomentar yang baik dan menarik sesuai dengan isi konten.
Komentar yang tidak diperbolehkan :

1. Berbau penghinaan SARA & P*RN
2. Komentar dengan Link hidup ( akan dianggap spam )
3. Komentar tidak nyambung dengan isi postingan
EmoticonEmoticon