Pengertian dan fungsi HTML, CSS dan Javascript sebagai pembangun Halaman web

Sebagian besar Halaman web yang terdapat di internet tersusun atas 3 bahasa. 3 bahasa ini adalah HTML, CSS dan Javascript. Pemahaman tentang HTML, CSS dan Javascript merupakan hal yang sangat penting demi kemudahan proses pembangunan blog.

HTML

HTML (Hyper Text Markup Language) adalah bahasa markup yang digunakan untuk membuat Halaman web. HTML adalah markup yang digunakan untuk mendefinisikan struktur halaman web. Hal ini seperti misalnya membuat elemen paragraf, gambar, link dan lain sebagainya. HTML tersusun atas elemen-elemen HTML. Elemen html didefinisikan dengan tag-tag HTML.

Sebagian besar halaman web yang terdapat di internet merupakan halaman yang dibangun dengan HTML. HTML merupakan bentuk utama dari halaman web. CSS dan Javascript terletak didalam file HTML. Sebuah halaman web dapat dibuat hanya dengan menggunakan HTML (Tanpa CSS dan Javascript).

html css javascript


CSS

CSS adalah bahasa yang digunakan untuk mengatur tampilan (gaya) elemen-elemen HTML. Dengan CSS, kita dapat memberikan warna background, border, mengatur posisi elemen, ukuran font dan lain sebagainya.

Javascript

Javascript adalah bahasa pemrograman (berjalan pada web browser) yang digunakan untuk membuat halaman web yang lebih interaktif. Beberapa fungsi yang bisa anda tambahkan menggunakan Javascript seperti misalnya menampilkan elemen tertentu hanya pada browser tertentu saja, membuat fitur yang memungkinkan pengguna untuk dapat menyesuaikan ukuran font pada blog, dan lain sebagainya.


Contoh-contoh

Untuk lebih memperjelas tentang bagaimana ketiga bahasa ini bekerja secara bersamaan, perhatin beberapa contoh berikut:

KodeHasil
<!DOCTYPE html>
<html>
   <head>
      <title>Belajar HTML</title>
   </head>
   <body>
      <p>Paragraf 1</p>
      <p>Paragraf 2</p>
   </body>
</html>

Pada kode HTML diatas, tidak ada satupun konfigurasi CSS yang diterapkan. Hasil yang terlihat juga berupa paragraf sederhana. Pada contoh dibawah ini, beberapa konfigurasi CSS diterapkan untuk elemen paragraf.

KodeHasil
<!DOCTYPE html>
<html>
   <head>
      <title>Belajar HTML</title>
      <style>
         /* KODE CSS DISINI */
      </style>
   </head>
   <body>
      <p>Paragraf 1</p>
      <p>Paragraf 2</p>
   </body>
</html>


Sampai disini, anda tentunya sudah paham tentang fungsi dari CSS. Pada contoh kode dibawah, javascript digunakan untuk menambahkan elemen tombol yang mengungkinkan pengguna untuk dapat menghapus dan me-restore paragraf 2.

KodeHasil
<!DOCTYPE html>
<html>
   <head>
      <title>Belajar HTML</title>
      <style>
            /* KODE CSS DISINI... */
      </style>
   </head>
   <body>
      <p>Paragraf 1</p>
      <p>Paragraf 2</p>
      <script>
            // KODE SCRIPT DISINI... 
      </script>
   </body>
</html>

Komentar

Posting Komentar