Desain Web ?
Halooo... Assalamualaikum Warrahmatullahi Wabarakaatuh
Tidak terasa hari ini adalah hari ke tiga tahun tidak menulis apapun di blog ini. Hari ini saya akan menulis sesuatu yang sedikit berbeda.
Tidak terasa hari ini adalah hari ke tiga tahun tidak menulis apapun di blog ini. Hari ini saya akan menulis sesuatu yang sedikit berbeda.
Mungkin postingan pertama saya buat ketika saya sedang menggebu menjadi anak SMA yang punya segudang cita-cita. Di postingan kali ini saya akan melenceng jauh. Saya akan membahas mengenai web design, sesuatu yang sedang sangat saya geluti sekarang. Di blog atau website lain mungkin juga banyak yang membahas mengenai web design dan mungkin lebih baik dari yang akan saya jabarkan. Namun saya akan tetap membahas dengan cara saya sendiri.
Web Design atau Desain Web merupakan proses mendesain web dengan menggabungkan beberapa aspek diantaranya desain grafis, konten dan layout/tata letak.
Yang akan kita bahas kali ini mengenai frontend suatu website. Frontend merupakan halaman muka pada suatu website yang dapat dilihat secara visual.
Baiklah pertama-tama saya akan membahas mengenai text editor yang di gunakan, ada beberapa pilihan mulai dari :
Kalian bisa gunakan pilihan diatas atau kalau tidak ingin repot melakukan instalasi gunakan saja notepad, saya sendiri menggunakan text editor notepad++ dan sublime. Semuanya disesuaikan tergantung kebutuhan.
Oke kita langsung saja ke pembahasan. Kali ini saya akan membahas mengenai HTML
HTML (HyperText Markup Language) adalah sebuah bahasa markup (tanda) yang biasanya digunakan untuk membuat sebuah halaman (menggambarkan struktur halaman web), atau menampilkan informasi di dalam sebuah penjelah web internet dan pemformatan hypertext sederhana. HTML tidak bersifat Sensitive Case jadi bisa ditulis secara Capslock atau tidak.
Struktur dasar HTML
<html>
<head>
</head>
<body>
</body>
</html>
Note: Dapat juga menambahkan <!DOCTYPE html> untuk HTML5
Oke sekarang kita coba menampilkan kata di html, ketikkan coding berikut :
<html>
<head>
<title> Belajar Web Design </title>
</head>
<body>
<h1> Heading Pertama Ku </h1>
</body>
</html>
Note : untuk penjelasan heading lebih jauh bisa dibaca di Macam-macam Tag pada HTML II
Kemudian Run dan jangan lupa simpan file dengan format .html. Jika menggunakan Notepad++ kalian bisa run dengan klik tulisan run di bagian menu bar tentu setelah melakukan proses penyimpanan.
Penjelasan tiap tag:
- Notepad (bawaan dari laptop/pc). Dicari dengan klik Start > ketik Notepad > Enter
- Notepad++ yang bisa di unduh di https://notepad-plus-plus.org/download/v7.5.6.html
- Sublime
- Atom
- dan lain sebagainya.
Kalian bisa gunakan pilihan diatas atau kalau tidak ingin repot melakukan instalasi gunakan saja notepad, saya sendiri menggunakan text editor notepad++ dan sublime. Semuanya disesuaikan tergantung kebutuhan.
Oke kita langsung saja ke pembahasan. Kali ini saya akan membahas mengenai HTML
HTML (HyperText Markup Language) adalah sebuah bahasa markup (tanda) yang biasanya digunakan untuk membuat sebuah halaman (menggambarkan struktur halaman web), atau menampilkan informasi di dalam sebuah penjelah web internet dan pemformatan hypertext sederhana. HTML tidak bersifat Sensitive Case jadi bisa ditulis secara Capslock atau tidak.
Struktur dasar HTML
<html>
<head>
</head>
<body>
</body>
</html>
Note: Dapat juga menambahkan <!DOCTYPE html> untuk HTML5
Oke sekarang kita coba menampilkan kata di html, ketikkan coding berikut :
<html>
<head>
<title> Belajar Web Design </title>
</head>
<body>
<h1> Heading Pertama Ku </h1>
</body>
</html>
Note : untuk penjelasan heading lebih jauh bisa dibaca di Macam-macam Tag pada HTML II
Kemudian Run dan jangan lupa simpan file dengan format .html. Jika menggunakan Notepad++ kalian bisa run dengan klik tulisan run di bagian menu bar tentu setelah melakukan proses penyimpanan.
Penjelasan tiap tag:
- <html> : tag yang menyatakan halaman dari html atau elemen akar suatu halaman yang merupakan pembuka keseluruhan dokumen
- <head> : tag yang berisi informasi meta dokumen (pengaturan di bagian kepala dokumen)
- <title> : tag informasi judul dari kepala dokumen
- <body> : tag yang berisi konten dari keseluruhan halaman
- <h1> : tag heading yang biasa digunakan untutk mendefiniskan judul. Tag heading biasa digunakan untuk menentukan bagian penting dalam suatu text, semakin kecil angka yang di tuliskan maka akan semakin besar tampilan heading yang kita buat (rentang heading yakni h1-h6)
Baiklah sekian dulu penjelasan awal mengenai Desain Web semoga memberi manfaat, terima kasih
Waalaikumussalam Warahmatullahi Wabarakaatuh :)
Comments
Post a Comment