Materi pembelajaran tentang HTML dan CSS

HTML dan CSS
Pengenalan HTML (Hypertext Markup Language)

HTML adalah bahasa standar pemrograman yang digunakan untuk membuat halaman website, yang diakses melalui internet. Singkatamn dari "Hypertext Markup Language" atau "bahasa markup". HTML disusun berdasar kode dan simbol tertentu, yang dimasukkan dalam sebuah file atau dokumen, sehingga bisa ditampilkan pada layar komputer.

        Kode HTML tersebut memastikan format teks dan gambar yang tepat untuk browser Internet. Tanpa HTM, browser tidak akan tahu bagaimana menampilkan teks sebagai elemen atau memuat gambar atau elemen lainnya. HTML dianggap sebagai tulang (struktur) dari sebuah halaman web, dan CSS sebagai kulitnya atau tampilan.

   Penulisan HTML, biasanya menggunakan open Tag dan close Tag contohnya seperti ini <b>..</b>


Struktur HTML 

Setiap Halaman HTML setidaknya memiliki struktur dasar yang terdiri dari : Tag DOCTYPE, tag html, tag head, dan tag body. Inilah yang merupakan struktur paling dasar dari HTML, walaupun HTML tdak hanya berisi struktur tersebut.



Keterangan :

    • <!DOCTYPE html> Merupakan type dari dokumen/file tersebut berekstensi HTML.
    • <html></html> Merupakan satu bagian utuh dari halaman, jika diibaratkan bagian tubuh tag <html></html.> merupakan bagian utuh dari seluruh tubuh.
    • <head</head> Merupakan elemen HTML yang berfungsi sebagai tempat untuk meletakkan metadata yaitu informasi-informasi halaman web yang tidak ditampilkan pada halaman tersebut seperti CSS, dan link-link eksternal
    • <title></title> Merupakan elemen untuk membuat judul pada sebuah halaman web
    • <body>,/body> Merupakan tempat menunjukkan konten sebuah dokumenn. Isi dari sebuah HTML yang akan ditampilkan pada jendela browser yang terdapat pada halaman web.

 

Apakah HTML Merupakan Bahasa Pemrograman?

HTML tidak dianggap sebagai bahasa pemrograman karena tidak bisa memberikan fungsi yang dinamis. Sekarang, bahasa markup ini dianggap sebagai standar web resmi, dikelola oleh World Wide Web Consortium (W3C), yang juga bertugas merilis pembaruan rutin HTML 

 


 

 



Pengenalan CSS (Cascading Stayle Sheet)

CSS adalah bahasa Cascading Style Sheet dan biasanya digunakan untuk mengatur tampilan elemen yang tertulis dalam bahasa markup, seperti HTML. CSS berfungsi untuk memisahkan konten dari tampilan visualnya di situs.

CSS dibuat dan dikembangkan oleh W3C (World Wide Web Consortium) pada tahun 1996 untuk alasan yang sederhana. Dulu HTML tidak dilengkapi dengan tags yang berfungsi untuk memformat halaman. Anda hanya perlu menulis markup untuk situs.

Tags, seperti <font>, diperkenalkan di HTML versi 3.2, dan ketika itu menyebabkan banyak masalah bagi developer. Karena website memiliki berbagai font, warna background, dan style, maka untuk menulis kembali (rewrite) kode memerlukan proses yang sangat panjang dan sulit. Oleh sebab itu, W3C membuat CSS untuk menyelesaikan masalah ini.

HTML dan CSS memiliki keterikatan yang erat. Karena HTML adalah bahasa markup (fondasi situs) dan CSS memperbaiki style (untuk semua aspek yang terkait dengan tampilan website), maka kedua bahasa pemrograman ini harus berjalan beriringan.

Tak hanya penting di sisi teknis, CSS juga berpengaruh pada tampilan sebuah website. Tentunya Anda tidak ingin website terlihat seperti situs yang ‘telanjang’ tanpa modifikasi apa pun, bukan? 

Pemanggilan CSS dapat digunakan didalam file HTML (CSS INTERNAL)  atau diluar dari pada file HTML (CSS EKSTERNAL )

CSS Internal merupakan teknik penulisan style yang ditulis pada halaman HTML.            CSS Eksternal merupakan teknik penulisan style yang ditulis pada halaman yang berbeda dan akan menjadi 2 file yang artinya ada file html dan file css.   

Contoh Penerapan CSS Internal 








Contoh Penerapan CSS Eksternal


 

 

   





Bagusnya pakai yang mana?

Cara terbaik menggunakan CSS yaitu Eksternal Style Sheet. Karena selain membuat dokumen HTML terlihat lebih rapi, cara ini juga memngkinkan kita membuat beberapa halaman web dengan tampilan yang sama.


Penutup 

Bagaimana ? Cukup mudah dimengerti ? 

HTML dan CSS adalah dasar bagi siapapun yang ingin terjun kedunia pemrograman web. Baik dia seorang web programmer, web designer, web developer maupun profesi yang berhubungan dengan website, mereka awalnya berkenalan dengan HTML dan CSS sebelum mereka menjadi seseorang yang profesional pada bidangnya.

Saya sarankan anda untuk tidak berhenti sampai disini, karena judul artikel ini adalah Pengenalan HTML dan CSS, apa yang saya tulis disini hanyalah mengenalkan kepada anda apa itu HTML & CSS dengan penjelasan sederhana dan sedikit contoh.

See you next time.. 

 

 

 

Komentar

Posting Komentar

Postingan populer dari blog ini

Cara Menghitung RAB Rumah Minimalis di Asahan

Gambar
Membangun rumah minimalis di Asahan  Membutuhkan perencanaan yang matang, terutama dalam menghitung Rencana Anggaran Biaya atau RAB. Banyak orang merasa bingung saat memulai karena takut biaya pembangunan membengkak di tengah jalan.  Oleh karena itu, penting untuk memahami bagaimana cara menghitung RAB secara tepat agar anggaran sesuai dengan kebutuhan. Dengan perhitungan yang benar, pembangunan rumah akan berjalan lancar, terkontrol, dan hasilnya sesuai dengan harapan. RAB rumah minimalis adalah dokumen penting yang memuat estimasi biaya pembangunan, mulai dari pembelian material, upah tukang, hingga finishing. Dengan memahami langkah-langkah menghitung RAB, Anda bisa menghindari risiko keuangan yang tidak terduga. Apa Itu RAB Rumah Minimalis RAB atau Rencana Anggaran Biaya adalah perhitungan detail yang mencakup seluruh kebutuhan pembangunan rumah. Dalam konteks rumah minimalis, RAB biasanya lebih sederhana dibandingkan dengan desain rumah besar karena kebutuhan material...
Baca selengkapnya

Perbandingan Bangun Rumah Sendiri vs Menggunakan Jasa Kontraktor

Gambar
Mem bangun rumah adalah salah satu keputusan besar dalam hidup. Bagi banyak orang, ini merupakan proyek impian yang telah direncanakan sejak lama. Ketika saat itu tiba, biasanya muncul dua pilihan utama: membangun rumah secara mandiri (tanpa jasa kontraktor), atau menggunakan jasa kontraktor profesional . Kedua pilihan ini memiliki kelebihan dan kekurangannya masing-masing. Dalam artikel ini, kami akan membandingkan secara objektif antara membangun rumah sendiri dan menggunakan jasa kontraktor, agar kamu bisa mempertimbangkan mana yang paling sesuai dengan kebutuhan, anggaran, dan waktu yang kamu miliki. Perbandingan ini juga bisa menjadi panduan bagi kamu yang sedang berdiskusi dengan keluarga atau pasangan tentang cara paling efektif membangun hunian impian. 1. Perencanaan dan Desain Bangun Sendiri: Umumnya, perencanaan dilakukan secara mandiri, baik dengan bantuan gambar contoh dari internet, saran dari tukang, atau bahkan sekadar berdasarkan pengalaman pribadi. Desainnya b...
Baca selengkapnya

Proses dan Tahapan Membangun Rumah dari Nol hingga Jadi

Gambar
Mem bangun rumah dari nol adalah proses besar yang membutuhkan persiapan matang dan keterlibatan berbagai pihak. Banyak orang mengira bahwa membangun rumah hanya soal membeli material dan menyewa tukang. Padahal, ada tahapan-tahapan penting yang harus dilalui , mulai dari perencanaan hingga rumah siap huni. Jika kamu sedang merencanakan pembangunan rumah, mengetahui tahapan ini akan sangat membantu menghindari kesalahan fatal yang bisa berujung pembengkakan biaya, keterlambatan, atau bahkan kerusakan struktur. Dalam artikel ini, kami akan membahas secara lengkap proses membangun rumah dari nol hingga jadi, seperti yang biasa dilakukan oleh kontraktor profesional seperti CV . PUTRA SION MANDIRI. 1. Tahap Konsultasi dan Perencanaan Langkah pertama sebelum mulai membangun adalah perencanaan yang matang . Ini melibatkan diskusi antara pemilik rumah dan tim arsitek/kontraktor. Beberapa hal yang dibahas pada tahap ini meliputi: Luas tanah dan batas lahan Jumlah lantai yang diingi...
Baca selengkapnya