Sabtu, 11 April 2015
» » » How to use HTML (Hyper Text Markup Language)

on
No Comment
https://sutrisnoeno53.files.wordpress.com/2015/04/html-jpg2.jpg
Hai guys, sekarang kita sudah sampai ke pembahasan PENKOM yang terakhir sesi uts hehehe. Sekarang kita akan membahas tentang bagaimana caranya kita membuat suatu  web dengan cara yang paling dasar yaitu HTML. Sekarang kita akan mencoba untuk memakai bahasa HTML yang sudah umum digunakan untuk membuat source code web. Untuk kelanjutannya , check this out !

HTML (Hyper Text Markup Languange)

HTML merupakan suatu metoda untuk mengimplementasikan konsep hypertext dalam suatu naskah atau dokumen. HTML sendiri bukan tergolong pada suatu bahasa pemrograman karena sifatnya yang hanya memberikan tanda (marking up) pada suatu naskah teks dan bukan sebagai program.

Untuk tutorial kali ini kita akan mencoba membuat text HTML dengan Notepad++ . Jika kamu tidak punya Notepad++ ini link download nya : http://goo.gl/UvvxZf

1. MEMBUAT HTML

Oke pertama , kita buat dulu folder untuk menyimpan data HTML dan lain-lain untuk webpage kita.
Setelah itu baru kita buka notepad yang sudah diinstal tadi
AAA
Inilah tampilan awal notepad++ kita . Hal yang paling dasar untuk mempelajari HTML kita harus menulis komponen ini terlebih dahulu. Ketik text berikut :
<html>
<head>
<title>Judul Halaman</title>
</head>
<body>
Ini halaman pertama saya.
<br>
<b> Text ditebalkan </b>
</body>
</html>
Lalu simpan file di folder yang telah kita buat , ingat simpan dengan ekstensi file .html .
AA
Setelah itu coba buka file tersebut menggunakan browser anda. Inilah tampilan nya.
AB
Mengapa bisa text tersebut bisa menampilkan hal tersebut? Masih bingung? Ini tips awal buat kamu.
  • Setiap tag diapit oleh tanda lebih kecil dan lebih besar. Kamu bisa melihat bahwa tag pertama adalah <html>. Tag HTML pada umumnya selalu memiliki pasangan yang memiliki tag sama dengan sedikit tambahan tanda garis miring “/”, dan kamu bisa melihat pasangan tag <html> di akhir script yaitu </html>.
  • Tag <html> memberitahu browser bahwa inilah awal dari dokumen HTML. Tag pasangannya yaitu </html> menyatakan bahwa inilah akhir dari dokumen HTML.
  • Teks di antara <head> dan </head> adalah teks informasi header. Informasi header ini tidak ditampilkan pada jendela browser.
  • Teks di antara <title> adalah judul dokumen kamu. Judul ini akan ditampilkan di caption browser (lihat di bagian paling atas kanan dari browser kamu).
  • Teks di antara tag <body> adalah teks yang akan ditampilkan pada jendela browser kamu.
  • Tag <br> untuk membuat baris baru atau break.
  • Dan terakhir, teks di antara <b> dan </b> akan ditampilkan dalam huruf tebal.

2. MENGATUR UKURAN FONT
Untuk mengatur ukuran font pada HTML anda dapat menggunakan tag <h1> </h1>, <h2> </h2>.
Contoh :
<h1> Halaman Pertama Saya <h1>
<h2> Halaman Pertama Saya <h2>
<h3> Halaman Pertaman Saya </h3>
  • Ketikan seperti Script berikut.
4
  • Save as dengan format .html dan buka pada browser anda.
3
3. MEMBUAT TABEL
  • Tambahkan Script berikut di body HTML anda.
5
  • Save as dengan format .html dan buka pada browser anda.
6
  • Anda bisa mengatur warna font yang anda inginkan dengan cara mengubah code warnanya, anda bisa mencari code warnanya di internet.
4.  MEMBUAT TEXTFIELD
  • Tambahkan Script berikut di body HTML anda.
7
  • Save as dengan format .html dan buka pada browser anda.
8
5. MEMBUAT TEXT BERJALAN
  • Tambahkan Script berikut di body HTML anda.
9
  • Save as dengan format .html dan buka pada browser anda.
10
6. MEMBUAT HEADER AND HEADER GROUP
Header biasanya ditembatkan dibagian awal website, sedangkan header group digunakan jika kita memiliki satu atau lebih heading berurutan. anda bisa melakukannya dengan cara:
  • Tambahkan Script berikut di body HTML anda.
11
  • Save as dengan format .html dan buka pada browser anda.
12
7. FIGURE FOR PICTURES
Figure and pictures berfungsi untuk menampilkan gambar dengan coptionnya. anda bisa melakukannya dengan cara:
  • Tambahkan Script berikut di body HTML anda. anda bisa menambahkan link gambar yang anda ingin tampilkan di halaman website dengan cara mengcopy link gambar dan mempastenya ke body script HTML anda.
14
  • Save as dengan format .html dan buka pada browser anda.
13
8. AUDIO
Berfungsi untuk menampilkan audio control pada halaman website anda. anda bisa melakukannya dengan cara:
  • Tambahkan Script berikut di body HTML anda.
16
  • Save as dengan format .html dan buka pada browser anda.
15
9. VIDEO
Berfungsi untuk menampikan video, anda bisa melakukannya dengan cara:
  • Tambahkan Script berikut di body HTML anda.
18
  • Save as dengan format .html dan buka pada browser anda.
17
10. FOOTER
Footer berfungsi untuk membuat catatan kaki. anda bisa melakukannya dengan cara:
  • Tambahkan Script berikut di body HTML anda.
19
  • Save as dengan format .html dan buka pada browser anda.
20
Tetapi , ketika menggunakan cara ini kita harus terkoneksi dengan internet sehingga video dari youtube bisa kita play. Sehingga tidak dijalankan secara offline.

Inilah pembahasan tentang HTML dasar dari saya. Semoga pembahasan kali ini bisa membantu anda untuk membuat website sendiri menggunakan HTML. Terimakasih
Diposting oleh di 21.00.00
Share:

0 komentar:

Posting Komentar

Silahkan tinggalkan jejak
No Spamming, No direct link
Komentar Usahakan menggunakan kata-kata yang baik dan tidak mengandung SARA.

Langganan: Posting Komentar (Atom)