HTTP adalah protocol yang menentukan aturan yang perlu diikuti oleh web browser dalam meminta dan mengambil lokasi informasi suatu dokumen.
URL adalah menentukan lokasi informasi suatu web server.
HOMEPAGE
Website: alamat (URL) yang berfungsi sebagai tempat penyimpanan data dan informasi berdasarkan topic tertentu.
Server: penyedia berbagai layanan termasuk web.
Client: mengakses informasiii yang disediakan oleh server.
Web Browaer: berjalan pakomputer user dan merupakan tool yang melakukan navigasi.
Server Web: sebuah perangkat lunak server yang berfungsi menerima permintaan HTTP/HTTPS dari client yang dikenal dengan browser web daan menggunakan kembali hasilnya dalam bentuk hal-hal web yang umumnya berbentuk dokumen HTML. Contohnya: server web antar flatform.
WEB PROGRAMIN
Web Statis: yang menampilkan informasi yang tetap. Contohnya: Artikel
Web Dinamis: web yang isinya dapat berubah-ubah setiap saat.
HTML
Bahasa yang digunakan untuk menampilkan informasi pada halaman web.
Software yang digunakan:
Text editor sederhana
Web browser
ISTILAH DALAM HTML
Tag: digunakan untuk menentukan tingkah laku web browser. Dinyatakan dengan tanda lebih kecil “<”(tag awal) dan tanda lebih besar “>” (tag akhir).
Contoh: <nametag>……..</nametag>
Element: jenis-jenis dari tag. Element terdiri atas tiga bagian, yaitu tag pembuka, isi, dan tag penutup.
contoh: <title> ini adalah tag pembuka judul dokumen HTML. Didini judul dokumen HTML ini adalah isi judul dokumen HTML </title> ini adalah tag penutup judul dokumen HTML.
Attribute: digunakan untuk memodifikasi nilai dari elemen HTML. Suatu elemen biasanya akan mempunyai banyak atribut.
TAG SEDERHANA DALAM STRUKTUR DOKUMEN HTML
<html>
<!...untuk menyatakan suatu dokumen html>
<head>
<!...memberikan informasi mengenai dokumen HTML>
</head>
<body>
<!...menyimpan informasi atau data yang akan ditampilkan dalam dokumen HTML >
</body>
</html>
PENGGUAAN KOMENTAR
Format:
<!.. >
Fungsi:
Memberi nama aplikasi
Mendeskripsikan tujuan pengkodean tertentu di dalam file
Memberi nama pengarang
Member tanggal pembuatan
Memberi nomor versi
Member informasi hak cipta
TAG-TAG DALAM <BODY>
Untuk warna latar belakang
Untuk heading
Untuk paragraph
Untuk preformatted text
Untuk bockquote
Untuk break
Untuk font
Untuk format dokumen
Untuk garis pemisah horizontal
Untuk list
Untuk memuat gambar
Untuk hypertext link
Dan lain-lain
ELEMEN BODY
<body text=”v”bgcolor=”w”background=”uri”link=”x”alink=”y”vlink=”z”>
…………..
</body>
Atribut text memberikan warna pada teks,
Bgcolor memberikan warna pada latarbellakang dokumen HTML
Background memberikan latarbelakang dokumen HTML dalam bentuk gambar
Link memberikan nilai warna unuk link
Alink memberikan warna untuk link yang sedang akif
Vlink memberikan warna untuk link yang telah dikunjungi
Jika atribut bgcolor dan background keduanya dispesifikan maka atribut background yang akan digunakan, akan tetapi jika nilai atribut background tidak ditemukan pada dokumen HTML maka atribut bgcolor yang akan digunakan.
MEMBUAT WARNA LATAR BELAKANG
<body text= #nnnnn bgcolor= #nnnnn>…</body>
Script:
<html>
<hhead>
<title> Penggunaan Latar Belakang Warna </title>
</head>
<body text=”blue” bgcolor=”green”> Kami sedang mulai belajar pemograman web
</body>
</html>
MENGGUNAKAN GAMBAR
<body background=”nama_file_gambar”>……</body>
Script:
<html>
<head>
<title> Penggunaan Latar Belakang Gambar </title>
</head>
<body background=”./gambar/picture01.jpg”> Kami sedang mulai belajar Web
</body>
</html>
HEADING
Untuk judul atau Sub judul dalam dokumen HTML
<h1[align=”left”|”right”]>…..</h1>
<h2[align=”left”|”right”]>…..</h2>
<h5[align=”left”|”right”]>…..</h5>
Script:
<html>
<head>
<title> Heading </title>
<body>
<h1 align=”center”> Heading 1: Materi HTML </h1>
<h2 align=”center”> Heading 1: Materi HTML </h2>
<h3 align=”center”> Heading 1: Materi HTML </h3>
<h4 align=”center”> Heading 1: Materi HTML </h4>
<h5 align=”center”> Heading 1: Materi HTML </h5>
</body>
</html>
PARAGRAF
<p[align=”left”|”center”|”right”]>….</p>
Script:
<html>
<head>
<title> Paragraf </title>
</head>
<body>
<h2 align=”center”> Materi HTML </h2>
<p align=”right”> Kami sedang mulai belajar </p>
<p align=”left”> saat ini masih dasarnya </p>
</body>
</html>
PREFORMATTED TEXT
Untuk menampilkan teks sama seperti yang diketikkan dalam dokumen HTML yaitu:
<pre>…..</pre>
BLOCKQUOTE
Untul menulis kutipan teks:
<blockquote>…….</blockquote>
<HTML><BODY>
Ini adalah paragraph normal
<BLOCKQOUTE>
<p>Ini Paragraf Yang Agak Masuk Kedalam
<p align=”justify”>ini juga contoh paragraph yang agak masuk kedalam. Dengan kalimat
yang agak panjang, kita lihat bahwa <b>semuabaris</b>dalam paragraph ini letaknya
agak masuk kedalam. <i> samarata sama jauhnya</i>.
</BLOCKQOUTE>
<p> nah, paragraf ini kemballi ormal, karena tag <i>blockqoute</i> sudah berlalu atau sudah berakhir.
</HTML></BODY>
BREAK
Untuk menulis teks pada baris berikutnya adalah: <br>
FONT
Ukuran Font
<font size=”n”>…</font>
Jenis Font
<font size=”n”face=”jenis_font”>…</font>
Warna Font
<font size=”n”face=”jenis_font”color=”warna”>…. </font>
FORMAT DOKUMEN
Bold
<b>…</b>
Italic
<i>….</i>
Superscript
<sup>…</sup>
Subscripted
<sub>….</sub>
Struck trough
<del>….</del>
GARIS PEMISAH HORIZONTAL
Garis horizontal untuk memisahkan teks dengan teks lain.
<hr[align=”left”|”center”|”right”][size=”n”][width=”nnn”][noshade]></hr>
LIST/DAFTAR
Unordered list <UL> : daftar item dengan tanda bullet.
<ul[type=”disc”|”square”|”circle”]>…</ul>
Ordered list <OL> : untuk membuat daftar item yang berurut.
<ol[type=”1”|”A”|S”|”I”|”i”] [start=”n”]>…</ol>
Definition list <DL> : untuk menjelaskan istilah-istilah.
<dl>…</dl>
<dt>…</dt>
<dd>…[</dd>]
Menu list : menampilkan item-item yang mempunyai link ke page lain.
<menu>…</menu>
Directed list (DIR) : untuk daftar item yang pendek atau kurang dari 20 karakter
<dir>….</dir>
MEMUAT GAMBAR
Memuat gambar ke dalam halaman web
<img src=”URL”|”name”higth=”n”width=”n”align=”top”|”center”|”bottom”]/>
Script:
<html>
<head>
<title> Insert Gambar </title>
</head>
<body>
<b>....</b>
<img src=”./TER2A.gift”>
</body>
</html>
HYPERTEXT LINK
Format
<a href=”address”>…</a>
Link ke dokumen lain
<a href=”nama_dokumen”>…</a>
<a href=”target”>…</a>
Link ke alamat URL atau WebSite
<a href=”alamat_URL”>…</a>
Link ke alamat email
<a href=”maito:alamat_email”>…</a>
Link file yang akan didownload
<a href=”nama_file”>…</a>
CONTOH HTML SEDERHANA
<html>
<head>
<title> Biodata</title>
<body bgcolor="pink">
<div style="background: #40E0D0"><p align="center"><font size="18" color="black"> PROFIL SAYA</font></p></div>
<h3><p align="center"><img src="./fotoku.jpg" width=140"height="240"></img></p></h3>
<p align="center"><i><b><font size ="5"><font color="RED">NAMA : SRI INDRIANI</font></font></b></i></p>
<p align="center"><i><b><font size ="5"><font color="BLUE">TTL : MEDAN, 27 OKTOBER 1997</font></font></b></i></p>
<p align="center"><i><b><font size ="5"><font color="PURPLE">ALAMAT: JLN. SETIA BUDI TANJUNG SARI MEDAN</font></font></b></i></p>
<p align="center"><i><b><font size ="5"><font color="LIME">STATUS : MAHASISWI</font></font></b></i></p>
<p align="center"><i><b><font size ="5"><font color="#800000">EMAIL : SRI10INDRIANI27@GMAIL.COM</font></font></b></i></p>
Selamat mencoba yaah kak bang😊😊😘
Semoga bisa membantu
Tidak ada komentar:
Posting Komentar