HTML Dasar : Pengenalan HTML dasar dan Penulisannya - OMJUAN.COM - Website Pragraming Learning
News Update
Loading...

10/20/2019

HTML Dasar : Pengenalan HTML dasar dan Penulisannya

#HTML #WebDeveloper
Hallo sobat-sobatku semua dimana pun berada, pada kali ini saya akan membagika sedikit pengetahuan tentang HTML (Hyper Text Markup Language). HTML ini merupakan bahasa yang paling dasar yang harus kalian kuasai, jika kalian mau menjadi sorang Web Developer. Oleh karena itu sesuai dengan Deskripsi blog ini, semua artikel yang di bahas dalam situs ini  adalah tentang webiste. Lalu apa saja yang akan kita bahasa di dalam pembahasan kali ini, berikut :

  1. Apa itu HTML
  2. Belajar membuat file HTML
  3. Contoh-contoh Penulisan HTML

Apa itu HTML ?

HTML (Hyper Text Markup Language) adalah sebuah bahasa markah untuk membuat satu atau banyak Halaman Website.

Belajar Membuat file HTML

Untuk membuat file HTML, kita dapat membuatnya dengan Text Editor seperti notepad. Bisa juga kita menggunakan Text Editor yang mempunyai banyak fitur syntax highlighter contohnya : Sublime Text, Atom, Kate, dan lain-lain. Kemudian untuk format file html tersbeut, disimpan dengan format atau ekstensi .html 
Contoh :


Contoh-contoh penulisan HTML

Jika kita ingin membuat tampilan website sederhana dengan informasi atau pesan di tampilan browser kalian, contoh : Selamat Datang Di Situs Ini . Maka kalian bisa menuliskan kode seperti di bawah ini.
<!DOCTYPE html>
<html>
<head>
    <title>Belajar HTML Di WWW.OMJUAN.COM</title>
</head>
<body>
    Selamat Datang Di Omjuan - Tutorial Web Online
</body>
</html>

Untuk menuliskan informasi seperti contoh ini, Perhatikan letak penulisan sebuah informasi yang ingin kalian kalian tampilkan di halaman website tersebut. dalam HTML ada susunan-susunan dengan tag-tag atau penanda. <body> dan di tutup dengan </body>. Tag ini merupakan body (tubuh) dari sebuah halaman website, setiap kali menuliskan informasi di tuliskan didalam tag (penanda) ini.


Kemudian pada contoh selanjutnya dengan <head> dan <title>. Untuk tag <head> ini merupakan kepala dari semua dokumen halaman. Untuk lebih mudah memahami. Silahkan buat kode seperti di bawah ini :
<!DOCTYPE html>
<html>
<head>
    <title>OMJUAN - Tutorial Web Online</title>
</head>

<body>
Situs website ini milik OMJUAN.COM
</body>
</html>
Jika teman-teman lihat di bagian yang saya lingkari berwarna merah itu merupakan Title (Judul) dari website tersebut.


Nah mari kita ke contoh selanjutnya, kita berkenalan dengan tag <h1> dan <p>. Untuk tag <h1> ini jika kita mau membuat judul artikel. H1 merupakan ukuran judul yang paling besar di HTML. Nah kemudia untuk tag <h1> ini jika kita mamu membuat paragraf. Silahkan ubah lagi kode yang tadi sudah di buat sepperti contoh di bawah ini :
<!DOCTYPE html>
<html>
<head>
    <title>OMJUAN - Tutorial Web Online</title>
</head>

<body>
    <h1>About</h1>
<p>Situs blog personal yang membagikan Source Code dan Pembahasan seputar website Gratis (HTML, CSS, JavaScript, PHP, Bootstrap).</p>
</body>
</html>


Coba teman-teman perhatikan hasilnya, Teks yang tadi berada di dalam tag <h1> jika di tampilkan menjadi lebih besar. Karena teks tersebut merupakan Judul dari artikel. Lalu kemudian, teks yang tadi kita sisipkan di dalam tag <p> di tampilkan dengan ukuran yang normal. Nah itu dia penjelasan tentang HTML Dasar : Pengenalan HTML dasar dan Penulisannya. Selain penjelasan di atas tadi masih banyak tag-tag yang harus di pelajari. teman-teman bisa pelajari dengan lebih banyak tag-tag dan model yang lain di W3Shool HTML  dan W3.ORG
Silahkan baca di : Tutorial Lengkap HTML
Oke teman-teman pengenalan tentang HTML. Bagaimana, apakah kalian sudah paham tentang HTML sekarang ?. Beri pendapat kalian di kolom komantar di bawah.

Share with your friends

Give us your opinion

Terimakasih telah mengunjungi situs ini. Silahkan berkomentar dengan bijak.Komentar spam atau berisikan link aktif tidak akan di tampilkan. Terimakasih

Notification
This is just an example, you can fill it later with your own note.
Done
Asal SEO Responsive Blogger Template
Pro Version 2 Pro Dark Version Pro Version 1 Pro Version 5 Proversion 4 Pro Version 3
Eclipse Responsive Blogger Template
Pro Version 3 Pro Version 2 Pro Version 1