You are here
Home > web desain > Berkenalan dengan HTML Dasar (Bag 1)

Berkenalan dengan HTML Dasar (Bag 1)

html5 logo

HTML (Hyper Text Markup Language) adalah sebuah bahasa markah dan bukan sebagai sebuah bahasa pemrograman yang digunakan untuk membuat sebuah halaman website. Di dalam dunia pemrograman berbasis web , HTML menjadi pondasi dasar pada halaman website.

Merujuk pada konten w3school disebutkan bahwa HTML adalah sebagai berikut :

  • HTML menggambarkan struktur halaman web
  • HTML memberitahu browser cara menampilkan konten sebuah halaman web
  • HTML terdiri dari serangkaian elemen
  • dan lain-lain

Untuk menuliskan script ataupun tag-tag html maka dibutuhkan sebuah tools pendukung yaitu teks editor dan juga browser yang akan menampilkan output dari kode program yang telah dituliskan.

Teks Editor

Ada banyak sekali pilihan teks editor yang dapat kita gunakan mulai dari yang berbayar sampai gratisan. biasanya setiap programmer memiliki alasan-alasan khusus untuk memilih salahsatu dari banyaknya teks editor, mulai dari alasan popularitas dalam artian teks editor tersebut banyak digunakan oleh programmer atau juga lebih ke tampilannya saja.

Berikut adalah rekomendasi teks editor yang dapat kita gunakan :

Untuk penggunaan browser disesuaikan dengan kebutuhan dan favorit masing-masing saja, karena browser sekarang biasanya sudah dilengkapi dengan fitur tambahan yang membantu mempercepat untuk men-develop desain sebuah website seperti Developer Tools pada GoogleChrome.

1. Cara membuat dan menjalankan file HTML

Pertama buatlah sebuah file dokumen html yang dituliskan pada teks editor kemudian simpan file tersebut pada lokasi folder dimana saja pada computer anda dengan akhiran (ekstension) .html
sebagai contoh : index.html

dengan script seperti berikut :

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Ini adalah bagian titel pada dokumen HTML</title>
</head>
<body>
    <p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quo voluptatem omnis maiores dolore. 
        Sed, molestiae ratione repellendus, provident eum beatae nisi cumque in qui aperiam esse enim 
        facere a nulla aliquid labore vero ipsum et sunt quasi maiores totam? Id placeat dicta quae 
        enim obcaecati veniam natus fuga consectetur esse sequi. Ut, officia molestias ducimus adipisci
         exercitationem omnis id. Rerum eum laborum totam vero beatae et hic iste autem, quod accusamus
          natus magnam eveniet ab nam officia saepe nemo consectetur omnis corporis quasi nostrum 
          perferendis. Minima, praesentium voluptatem voluptatum id iste alias quas expedita neque, 
          deserunt non quae illo dolores?
</p>
</body>
</html>


Kemudian simpan script tadi pada folder yang diinginkan, biasanya untuk pengguna xampp, file diletakkan di dalam folder htdocs.
Setelah itu buka file index.html dengan browser sebagai contoh saya akan menggunakan safari, hasilnya seperti gambar berikut :

Dokumen HTML dengan menampilkan paragraph

Leave a Reply

Top