Contoh HTML Form

    Form adalah suatu bagian di dalam halaman web yang berfungsi untuk mengizinkan pengguna mengirimkan data ke web server. Dengan kata lain, form berperan sebagai user interface (antar-muka) atau media untuk berkomunikasi antara user dengan web server. Untuk membangun sebuah form terdapat beberapa tag yang digunakan, seperti tag form, input, select, textarea, dan button.

Adapun tag-tag yang digunakan untuk membuat sebuah form antara lain :

• <form>
  Tag form memiliki attribute wajib berupa method untuk mendefinisikan metode pengiriman data dan action yang mendefinisikan aksi yang merujuk kepada lokasi pengolahan data pada form.
• <input/>
  Tag input digunakan untuk membangun kontrol form atau interface (antar-muka) untuk mengambil request dari pengguna yang selanjutnya akan diproses oleh web server. Tag input memiliki attribute wajib berupa type yang mendefinisikan tipe kontrol dan tag name yang mendefinisikan nama dari sebuah form kontrol yang akan bertindak sebagai nama yang menampung data atau variable secara implisit.
• <textarea>...</textarea>
  Tag textarea digunakan untuk memasukkan text yang dapat menerima data dalam jumlah karakter yang lebih banyak bahkan dalam bentuk paragraf, karakteristiknya sama dengan inputan tipe text, hanya saja kontrol inputannya lebih besar dari biasanya.
• <select><option>...</option></select>
  Tag select digunakan untuk memasukkan inputan berupa combo-box yang merepresentasikan data dalam bentuk list atau daftar pilihan. Sama seperti elemen-elemen yang terdapat dalam form, attribute wajib pada tag select adalah name, untuk membentuk sebuah list-box maka perlu ditambahkan attribut size. Kemudian, untuk menambahkan data pada elemen combo-box atau list-box yang akan dipilih, diperlukan tag option.

FORMULIR PENDAFTARAN ANGGOTA ROHIS KRAMZAH AKHWAT
Nama Lengkap
Nama Panggilan
Kelas
Tempat, Tanggal Lahir
Alamat
No. Handphone
Akun Medsos (WhatsApp/LINE)
Hobby
Cita-cita
Alasan/Motivasi untuk Mendaftar
Prestasi yang Pernah diraih
Pas Foto 3x4

Berikut adalah listing tertentu dari output form di atas :
<form method="POST" action="Formulir_Pendaftaran_Anggota_Rohis.php">
<tr>
<th bgcolor="white" colspan="6">
<img src="C:\Users\asus\Documents\kiki\SMA\ROHIS\Kop Kramzah.jpg" align="left" alt="Kop Kramzah" width="100" height="80">
<font size="5" face="elephant">FORMULIR PENDAFTARAN ANGGOTA ROHIS KRAMZAH AKHWAT>
</th>
</tr>
<tr>
<td>Nama Lengkap</td>
<td>
<input type="text" placeholder="Nama Lengkap" name="nlengkap"/>
</td>
</tr>
<tr>
<td>Tempat, Tanggal Lahir</td>
<td>
<input type="text" placeholder="Tempat Lahir" name="tempat"/>&nbsp;&nbsp;
<input type="date" name="tanggal"/>
</td>
</tr>
<tr>
<td>Alamat</td>
<td>
<textarea cols="35" placeholder="Alamat" name="alamat></textarea>
</td>
</tr>
<tr>
<td>No. Handphone</td>
<td>
<input type="text" placeholder="No. Handphone" name="nomorhp" maxlength="14"/>
</td>
</tr>
<tr>
<td>Pas Foto 3x4</td>
<td>
<input type="file" name="foto"/>
</td>
</tr>
<tr>
<td></td>
<td>
<input type="reset"/>&nbsp;&nbsp;&nbsp;<input type="submit" value="Daftar" name="daftar"/>
</td>
</tr>
</form>

Curriculum Vitae

Data Pribadi

1. Nama Lengkap                    : Rasty Permata Sari R.
2. Tempat & Tanggal Lahir       : Makassar, 28 Januari 1999
3. Alamat                               : Griya Mannuruki Permai Blok B No. 1
4. Jenis Kelamin                     : Perempuan
5. Status Perkawinan              : Belum Menikah
6. Agama                               : Islam
7. No. Telepon                       : 0823-4877-0997
8. E-mail                               : rasty9425@gmail.com

Pendidikan

2004-2005                          TK Tunas Mekar Sidoarjo
2005-2007                          SD Negeri Tropodo IV Sidoarjo
2007-2011                          SD Inpres Pajjaiang Makassar
2011-2014                          SMP Negeri 25 Makassar
2014-2017                          SMA Negeri 18 Makassar
2017-sekarang                    Universitas Muslim Indonesia Makassar

HTML

Tentang HTML

Hypertext Markup Language (HTML) adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuah penjelajah web Internet dan pemformatan hiperteks sederhana yang ditulis dalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi. Dengan kata lain, berkas yang dibuat dalam perangkat lunak pengolah kata dan disimpan dalam format ASCII normal sehingga menjadi halaman web dengan perintah-perintah HTML. Bermula dari sebuah bahasa yang sebelumnya banyak digunakan di dunia penerbitan dan percetakan yang disebut dengan SGML (Standard Generalized Markup Language), HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web. HTML saat ini merupakan standar Internet yang didefinisikan dan dikendalikan penggunaannya oleh World Wide Web Consortium (W3C). HTML dibuat oleh kolaborasi Caillau TIM dengan Berners-lee Robert ketika mereka bekerja di CERN pada tahun 1989 (CERN adalah lembaga penelitian fisika energi tinggi di Jenewa).

Fungsi HTML

Fungsi HTML yang pertama adalah untuk membuat suatu halaman website yang dapat dibaca dan dipahami oleh pengguna dengan lebih mudah. Semua laman website yang terdapat dalam internet dibuat dengan HTML dan tidak ada pengecualian.

Menandai teks pada suatu laman, HTML ditulis pada suatu halaman dokumen dengan tag atau simbol tertentu dimana simbol dan tag tersebut akan menandai teks menjadi tebal, miring, bergaris tebal dan lain sebagainya.

Misalnya, apabila kita membuat suatu teks menjadi teks miring atau italic, dalam laman HTML dituliskan kode <i> untuk italic, <b> untuk teks tebal dan <u> untuk teks bergaris bawah.

Sebagai dasar website, website yang dibuat tentunya mempunyai beberapa fitur yang dibuat dengan menggunakan java script (untuk mengatur perilaku web), implemetasi bahasa pemrograman server PHP, dan mendesain web menggunakan CSS. Semua bahasa tersebut bisa diaplikasikan apabila web memunyai bahasa html sebagai dasarnya.

Menampilkan tabel, gambar, video, dan lain-lain. Pada umumnya dalam website atau blog kita tidak dapat langsung meletakkan tabel, gambar ataupun video, oleh karena itu komponen tersebut diletakkan pada web dengan menggunakan bahasa HTML.

Selain itu, HTML juga berfungsi untuk menandai elemen dan membuat online form, HTML juga berguna untuk menandai bagian-bagian dalam website, misalnya header, main, footer, navigation dan lain-lain. Selain itu HTML juga berfungsi sebagai bahasa dalam membuat suatu online form atau formulir digital.

Tag pada HTML

Di dalam website ada empat bagian buat tag, di antaranya :

1. <HTML> Sebagai tanda awal dokumen HTML.

- HTML tidak membedakan penggunaan huruf besar ataupun huruf kecil dari suatu elemen

- HTML terdiri dari tag-tag beserta teks yang ada dalam tag-tag tersebut. Tag ini di nyatakan dengan tanda lebih kecil (<) dan tanda lebih besar (>)

2. <HEAD> Sebagai informasi page header. Dokumen HTML diapit oleh tag <HEAD></HEAD>.

3. <TITLE> Sebagai title atau judul halaman. Kalimat yang terletak di dalam tag ini akan muncul pada bagian paling atas browser Anda (pada title bar).

4. <BODY> Sebagai isi dari sebuah halaman website Bagian BODY, yang dinyatakan dengan tag <BODY>…</BODY>, merupakan tubuh atau isi dari dokumen HTML di mana Anda meletakkan informasi yang akan ditampilkan pada browser.

Tag biasanya merupakan suatu pasangan yang disebut dengan :

1. Tag awal, dinyatakan dalam bentuk <nama tag>

2. Tag akhir, dinyatakan dalam bentuk </nama tag>

Formatnya :

<nama tag> teks yang ditampilkan </nama tag>.

Contoh :

untuk menampilkan teks dalam format teks bergaris bawah. Teks ini terlihat bergaris bawah di browser Anda dengan perintah HTML <u> Teks ini terlihat bergaris bawah di browser Anda </u>

Contoh dokumen HTML sederhana :

<!DOCTYPE html>

<html>

<head>

<title>Hello HTML</title>

</head>

<body bgcolor="purple">

<font face = "Comic Sans MS" color = "pink" size = "5">

<p>Hello Huang Renjun!</p>

</body>

</html>

Keterangan dan pengertian HTML dan tag HTML

HTML code Beserta Keterangan :

1. <!–    –> : Memberi komentar atau keterangan. Kalimat yang terletak pada tag kontiner ini tidak akan terlihat pada browser

2. <a href> : Membuat link ke halaman lain atau ke bagian lain dari halaman tersebut

3. <a name> : Membuat nama bagian yang didefinisikan pada link pada halaman yang sama

4. <applet> : Sebagai awal dari Java applets

5. <area> : Mendefinisikan daerah yang dapat diklik (link) pada image map

6. <b> : Membuat teks tebal

7. <basefont> : Membuat atribut teks default seperti jenis, ukuran dan warna font

8. <bgsound> : Memberi (suara latar) background sound pada halaman web

9. <big> : Memperbesar ukuran teks sebesar satu point dari defaultnya

10. <blink> : Membuat teks berkedip

11. <br> : Pindah baris

12. <caption> : Membuat caption pada tabel

13. <center> : Untuk perataan tengah terhadap teks atau gambar

14. <comment> : Meletakkan komentar pada halaman web tidak tidak akan nampak pada browser

15. <dd> : Indents teks

16. <div> : Represents different sections of text.

17. <embed> : Menambahkan sound or file avi ke halaman web

18. <fn> : Seperti tag  <a name>

19. <font> : Mengganti jenis, ukuran, warna huruf yang akan digunakan utk teks

20. <form> : Mendefinisikan input form

21. <frame> : Mendefinisikan frame

22. <frameset> : Mendefinisikan attribut halaman yang akan menggunakan frame

23. <h1>…<h6> : Ukuran font

24. <hr> : Membuat garis horizontal

25. <html> : Berarti dokumen HTML

26. <i> : Membuat teks miring

27. <img> : Image, imagemap atau an animation

28. <input> : Mendefinisikan input field pada form

29. <li> : Membuat bullet point atau baris baru pada list (berpasangan dengan tag <dir>, <menu>, <ol> and <ul> )

30. <map> : Mendefinisikan client-side map

31. <marquee> : Membuat scrolling teks (teks berjalan)

32. <nobr> : Mencegah ganti baris pada teks atau images

33. <noframes> : Jika browser user tidak mendukung frame

34. <ol> : Mendefinisikan awal dan akhir list

35. <p> : Ganti paragraf

36. <pre> : Membuat teks dengan ukuran huruf yg sama

37. <script> : Mendefinisikan awal script

38. <table> : Membuat tabel

39. <td> : Kolom pada tabel

40. <tr> : Baris pada tabel

41. <u> : Membuat teks bergaris bawah

Sources :

http://blaakraan.blogspot.com/2015/03/pengertian-dan-bagian-bagian-dari-html.html

https://id.wikipedia.org/wiki/HTML

http://www.sumberpengertian.co/pengertian-html

SEJARAH DAN PERKEMBANGAN WEB

Pengertian Web

Situs web (bahasa Inggris: website) adalah suatu halaman web yang saling berhubungan yang umumnya berada pada peladen yang sama berisikan kumpulan informasi yang disediakan secara perorangan, kelompok, atau organisasi. Sebuah situs web biasanya ditempatkan setidaknya pada sebuah server web yang dapat diakses melalui jaringan seperti Internet, ataupun jaringan wilayah lokal (LAN) melalui alamat Internet yang dikenali sebagai URL. Gabungan atas semua situs yang dapat diakses publik di Internet disebut pula sebagai World Wide Web atau lebih dikenal dengan singkatan WWW. Meskipun setidaknya halaman beranda situs Internet umumnya dapat diakses publik secara bebas, pada praktiknya tidak semua situs memberikan kebebasan bagi publik untuk mengaksesnya, beberapa situs web mewajibkan pengunjung untuk melakukan pendaftaran sebagai anggota, atau bahkan meminta pembayaran untuk dapat menjadi aggota untuk dapat mengakses isi yang terdapat dalam situs web tersebut, misalnya situs-situs yang menampilkan pornografi, situs-situs berita, layanan surel (e-mail), dan lain-lain. Pembatasan-pembatasan ini umumnya dilakukan karena alasan keamanan, menghormati privasi, atau karena tujuan komersial tertentu.

Sejarah Web

Penemu situs web adalah Sir Timothy John "Tim" Berners-Lee, sedangkan situs web yang tersambung dengan jaringan pertamakali muncul pada tahun 1991. Maksud dari Tim ketika merancang situs web adalah untuk memudahkan tukar menukar dan memperbarui informasi pada sesama peneliti di tempat ia bekerja. Pada tanggal 30 April 1993, CERN(tempat di mana Tim bekerja) mengumumkan bahwa WWW dapat digunakan secara gratis oleh publik.

Sebuah situs web bisa berupa hasil kerja dari perorangan atau individu, atau menunjukkan kepemilikan dari suatu organisasi, perusahaan. biasanya pembahasan dalam sebuah situs web merujuk pada sebuah ataupun beberapa topik khusus, atau kepentingan tertentu. Sebuah situs web bisa berisi pranala yang menghubungkan ke situs web lain, demikian pula dengan situs web lainnya. Hal ini terkadang membuat perbedaan antara situs web yang dibuat oleh individu ataupun perseorangan dengan situs web yang dibuat oleh organisasi bisnis menjadi tidak begitu jelas.

Situs web biasanya ditempatkan pada server web. Sebuah server web umumnya telah dilengkapi dengan perangkat-perangkat lunak khusus untuk menangani pengaturan nama ranah, serta menangani layanan atas protokol HTTP yang disebut sebagai Server HTTP (bahasa Inggris: HTTP Server) seperti Apache HTTP Server, atau Internet Information Services (IIS).

Perkembangan Web

a. Web 1.0 (1990-2000)

Web 1.0 adalah generasi pertama dari website di internet. Dalam web 1.0 para pengunjung dapat mencari dan browsing data yang ada di dalam web, namun pengunjung tidak memiliki akses untuk memasukkan data atau informasi ke dalam situs. Pada masa web 1.0, layanan internet masih berkisar di antara static website yang saling dihubungkan dengan hyperlink. Website pada kala itu, hanya menyampaikan informasi satu arah dalam bentuk brosur online.  Pada tahun 1998 Google berdiri dan internet semakin mudah untuk digunakan. Pada masa itu, website dengan format portal berita dan took online (example: Amazon.com) menjadi website yang paling diminati oleh para investor.

Beberapa ciri khas dari situs Web 1.0 termasuk :

1. Halaman statis, bukan dinamis pengguna-konten yang dihasilkan.

2. Penggunaan framesets.

3. Milik HTML ekstensi seperti dan tag diperkenalkan pada awal perang browser.

4. Online guestbook.

5. GIF tombol, biasanya 88×31 piksel dalam ukuran web browser dan mempromosikan produk lain.

6. Pengguna akan mengisi formulir, dan setelah mereka mengklik mengirimkan email klien akan mencoba untuk mengirim email yang berisi formulir rincian.

b. Web 2.0 (2001-2010)

Web 2.0, adalah sebuah istilah yang dicetuskan pertama kali oleh O'Reilly Media pada tahun 2003, dan dipopulerkan pada konferensi web 2.0 pertama pada tahun 2004, merujuk pada generasi yang dirasakan sebagai generasi kedua layanan berbasis web—seperti situs jaringan sosial, wiki, perangkat komunikasi, dan folksonomi—yang menekankan pada kolaborasi daring dan berbagi antar pengguna. O'Reilly Media, dengan kolaborasinya bersama MediaLive International, menggunakan istilah ini sebagai judul untuk sejumlah seri konferensi, dan sejak 2004 beberapa pengembang dan pemasar telah mengadopsi ungkapan ini.

Walaupun kelihatannya istilah ini menunjukkan versi baru daripada web, istilah ini tidak mengacu kepada pembaruan kepada spesifikasi teknis World Wide Web, tetapi lebih kepada bagaimana cara si-pengembang sistem di dalam menggunakan platform web. Mengacu pada Tim Oreilly, istilah Web 2.0 didefinisikan sebagai berikut:

"Web 2.0 adalah sebuah revolusi bisnis di dalam industri komputer yang terjadi akibat pergerakan ke internet sebagai platform, dan suatu usaha untuk mengerti aturan-aturan agar sukses di platform tersebut. ”

Prinsip-prinsip Web 2.0 :

- Web sebagai platform

- Data sebagai pengendali utama

- Efek jaringan diciptakan oleh arsitektur partisipasi

- Inovasi dalam perakitan sistem serta situs disusun dengan menyatukan fitur dari pengembang yang terdistribusi dan independen (semacam model pengembangan perangkat bersumber terbuka)

- Model bisnis yang ringan, yang dikembangkan dengan gabungan isi dan layanan

- Akhir dari siklus peluncuran (release cycle) perangkat lunak (perpetual beta)

- Mudah untuk digunakan dan diadopsi oleh user

Web 2.0 mempunyai keuntungan yaitu memungkinkan pengguna internet dapat melihat konten suatu website tanpa harus berkunjung ke alamat situs yang bersangkutan.

3. Web 3.0 (2005-now)

Web 3.0 adalah generasi ketiga dari layanan internet berbasis web. Konsep Web 3.0 pertama kali diperkenalkan pada tahun 2001, saat Tim Berners-Lee, penemu World Wide Web, menulis sebuah artikel ilmiah yang menggambarkan Web 3.0 sebagai sebuah sarana bagi mesin untuk membaca halaman-halaman Web. Hal ini berarti bahwa mesin akan memiliki kemampuan membaca Web sama seperti yang manusia dapat lakukan sekarang ini.

Web 3.0 berhubungan dengan konsep Web semantik, yang memungkinkan isi web dinikmati tidak hanya dalam bahasa asli pengguna, tetapi juga dalam bentuk format yang bisa diakses oleh agen-agen software. Beberapa ahli bahkan menamai Web 3.0 sebagai Web Semantik itu sendiri.

Keunikan dari Web 3.0 adalah konsep dimana manusia dapat berkomunikasi dengan mesin pencari. Kita bisa meminta Web untuk mencari suatu data spesifik tanpa bersusah-susah mencari satu per satu dalam situs-situs Web. Web 3.0 juga mampu menyediakan keterangan-keterangan yang relevan tentang informasi yang ingin kita cari, bahkan tanpa kita minta.

Web 3.0 terdiri dari:

- Web semantik

- Format mikro

- Pencarian dalam bahasa pengguna

- Penyimpanan data dalam jumlah besar

- Pembelajaran lewat mesin

- Agen rekomendasi, yang merujuk pada kecerdasan buatan Web

Web 3.0 menawarkan metode yang efisien dalam membantu komputer mengorganisasi dan menarik kesimpulan dari data online. Web 3.0 juga memungkinkan fitur Web menjadi sebuah sarana penyimpanan data dengan kapasitas yang luar biasa besar.

Walaupun masih belum sepenuhnya direalisasikan, Web 3.0 telah memiliki beberapa standar operasional untuk bisa menjalankan fungsinya dalam menampung metadata, misalnya Resource Description Framework (RDF) dan the Web Ontology Language (OWL). Konsep Web Semantik metadata juga telah dijalankan pada Yahoo’s Food Site, Spivack’s Radar Networks, dan sebuah development platform, Jena, di Hewlett-Packard.

Sources :

https://mantapmm.wordpress.com/2017/07/30/sejarah-dan-perkembangan-web/

https://id.wikipedia.org/wiki/Situs_web

https://tyayanpriadipln.wordpress.com/2010/01/21/perbedaan-perbedaan-antara-web-1-0-dan-web-2-0-serta-web-3-0/

https://id.wikipedia.org/wiki/Web_2.0

https://id.wikipedia.org/wiki/Web_3.0