Journocoders: Introduction to HTML/CSS

Aghnia Adzkia mengampuh materi workshop pengenalan HTML/CSS -Journocoders Indonesia
Aghnia Adzkia mengampuh materi workshop pengenalan HTML/CSS -Journocoders Indonesia
© Journocoders Indonesia /niyani@beritagar.id

Journocoders Indonesia yang sudah berdiri sejak Maret 2018 bertujuan untuk menyediakan wadah setiap bulannya bagi para jurnalis dan orang-orang yang bergerak di bidang media di Indonesia sebagai tempat pengembangan, belajar bersama, maupun sebagai wadah untuk berdiskusi.

Jounocoders kembali mengadakan kegiatan rutinnya pada Sabtu, 29 Juni 2019 lalu di kantor Beritagar.id. Pertemuan Journocoders Indonesia dimulai pukul tiga sore yang dihadiri sekitar 20 orang. Workshop kali ini membahas mengenai pengenalan HTML/CSS bagi pemula.

Pertemuan yang diawali dengan perkenalan ini berlanjut membahas secara singkat mengenai apa itu HTML/CSS. Aghnia Adzkia yang merupakan tim data dari Beritagar.id menjelaskan bahwa HTML dan CSS merupakan komponen untuk membuat website. Di mana, dapat diumpamakan bahwa website ini sebagai rumah dan untuk membangun rumah tersebut dibutuhkan tukang dalam hal ini HTML. Sedangkan, untuk tahap dekorasi rumah agar lebih bagus menggunakan tukang dekorato (CSS).

Pada laman web atau web page dapat menampilkan teks, gambar, maupun suara. Halaman yang ditampilkan di browser diatur dan dibentuk oleh HTML. Pembentukan dan pengaturan halaman tersebut menggunakan tanda atau lebih umum disebut tag. Sedangkan, CSS adalah bahasa yang menggambarkan gaya dokumen HTML. Keterbatasan kemampuan HTML dalam mengatur tampilan halaman website dapat digantikan menggunakan CSS.

Selesai penjelasan singkat mengenai apa itu HTML/CSS, Aghnia Adzia lanjut menjelaskan HTML secara lebih rinci dengan praktek langsung melalui atom.io dan w3schools.com. Para peserta pun turut antusias memperhatikan dan ikut pula mempraktikkannya.

Aghnia Adzkia saat memulai pengenalan materi workshop
Aghnia Adzkia saat memulai pengenalan materi workshop
© Journocoders Indonesia /niyani@beritagar.id

Aghnia Adzkia menjelaskan satu persatu bagian dari tags yang terdiri dari Head, Body, hingga footer. Tag HTML mempunyai tag pembuka dan penutup. Tag pembuka menggunakan simbol lebih kecil dari (<) dan lebih besar dari (>). Pada tag penutup ditambahkan slash (/). Selain itu, juga membahas bagaimana membuat tabel, mancantumkan link dan gambar, text formatting, hingga iframe dalam HTML yang langsung dipraktekan oleh para peserta di tiap penjelasannya.

Para peserta mempratikkan pengodean tags dan melihat bagaimana tampilan yang akan muncul melalui w3schools.com.

Selesai membahas HTML, Journoders pun mengulik CSS yang dijelaskan oleh Aghnia Adzkia. Ia menjelaskan bahwa kode CSS memiliki tiga bagian yakni selector, property, dan value. Di mana penggunaan CSS ini dapat menggunakan tiga cara seperti Inline Style Sheet yang langsung menuliskan kode css pada tag HTM. Cara kedua menggunakan Internal/Embedded Style Sheet​ yang menggabungkan kode css dengan file HTML dan ditulis di dalam tag head. Cara terakhir yakni External Style Sheet, dengan memisahkan kode css anda di file sendiri dengan ekstensi .css.

Narsum saat memberi materi tag HTML
Narsum saat memberi materi tag HTML
© Journocoders Indonesia /niyani@beritagar.id

HTML dan CSS ini merupakan dasar bagi yang ingin bergelut dengan pemrograman web. Baik dia seorang web programmer, web designer, web developer maupun profesi yang berhubungan dengan website. Pemahaman tentang HTML dan CSS ini juga akan memudahkan proses pengambilan atau scrapping data dari website yang disebut teknik parsing HTML. Hal tersebut dikarenakan, kita sudah memahami tag-tag dalam HTML. Teknik ini kemudian digunakan untuk mengekstraksi text, links, dan data.

Setelah serangkaian penjelasan mengenai HTML/CSS ini, semua peserta Journocoders mempraktikkan membuat laman web melalui HTML/CSS sambil diselingi memakan cemilan. Para peserta membuat laman web yang menampilkan artikel disertai gambar dengan menggunakan atom.io.

Menjelang maghrib, acara rutin Journocoders ini pun berakhir. Untuk informasi mengenai Journocoders yang diadakan rutin setiap bulannya dapat disimak melalui twitter Journocoders Indonesia.

BACA JUGA