sumber: hewan.id

BAB 1

Konsep Teknologi dan Format Text Pada Aplikasi Web

A. Konsep Teknologi Aplikasi Web

1. Konsep WWW

Singkatan www di awal nama alamat website tersebut sebagai langkah awal memasuki sebuah website. WWW (World Wide Web) pada umumnya dikenal web, yakni system dokumen hypertext yang bisa diakses melalui internet.

2. Macam - Macam Browser

Dari sekian banyak web browser, beberapa di antaranya sangat familiar dan banyak digunakan, seperti internet Explorer, Mozilla Firefox, Goggle Chrome, Opera, dan Safari.

3. Konsep Web Server

Web server adalah sebuah software (perangkat lunak) yang memberikan layanan berupa data. Berfungsi untuk menerima permintaan HTTP atau HTTPS dari klien atau kita kenal dengan web browser

Web awalnya digunakan sebagai penyedia informasi, sekarang digunakan untuk komunikasi e-mail, chatting, hingga melakukan transaksi bisnis.

4. Macam - Macam Software Web Server

Web server yang paling banyak diugunakan biasanya memiliki kelebihan (fitur) jika dibandingkan web server laiunnya.

a. Web server berbayar

1. Microsoft Internet Information Services (IIS)

Layanan ini berfungsi sebagai pendukung protocol TCP/IP yang berjalan dalam lapisan aplikasi.

2. LifeSpeed

LifeSpeed menawarkan kecepatan akses yang tinggi bagi para penggunanya dan dipercaya 6 kali lebih cepat dari web server Apache. Jika dibandingkan dengan web server Nginx sekalipun, LifeSpeed masih tetap menjadi yang tercepat.

b. Web Server Gratis

1. Apache

Di urutan teratas dari jajaran web servcer yang paling popular dan paling banyak digunakan saat ini adalah Apache web server. Web server yang satu ini juga mendukung system operasi Windows.

2. Nginx

Jika dibandingkan web server lain termasuk Apache, Nginx terbilang lebih stabil dan hemat resource sehingga banyak web master yang memiliki spesifikasi server tidak terlalu besar lebih memilih menggunakan Nginx daripada web server gratis lainnya.

5. Macam- Macam Text Editor

Text editor iddentik dengan software atau perangkat yang digunakan untuk mengetikkan coding yang akan dibuat menjadi sebuah web. Pada dasarnya, tecxt editor hanyalah tempat anda meletakkan barisan - barisan code.

a. Adobe Dreamweaver

Text editor yang paling sering digunakan, bias multi-tab. Tampilan eye catching dan tidak terlalu memakan banyak memori PC. Namun, software ini berbayar.

b. NetBeans

NetBeans cukup baik untuk coding web, namun tidak direkomendasikan untuk PC yang memorinya kecil atau seadanya karena akan membuat proses yang memakan memori cukup besar.

c. Notepad++

Notepad++ hampir sama dengan notepad biasa, namun fitur lebihnya adalah pewarnaan pada kode - kode tertentu sehingga akan sedikit memudahkan penggunanya.

6. Tool Pengembang Web

Tool atau peralatan yang identic dengan perangkat lunak yang digunakan dalam proses pengembangqan website. Berikut ini beberapa tool pengembang web yang sering digunakan.

1. Adobe Edge Inspect

2. Firebug

3. Lorem Ipsum

4. FavIcon Generator

B. Format Teks Pada Halaman Web

HTML (Hypertext Markup Language) identic dengan Bahasa standar yang dipakai pada halaman web. Halaman - halaman web bisa dibuat dengan menggunakan HTML.

1. Struktur Dasar HTML

Setiap halaman HTML minimal memiliki struktur dasar yang terdiri atas tag DTD atau DOCTYPE, tag html, tag head, dan tag body. Struktur - struktur tersebut sebagai hal mendasar dari HTML, walaupun HTML tidak hanya berisi struktur tersebut.

2. Versi HTML

Seiring perkembangan dunia global, khususnya dunia IT, HTML juga ikut berpartisipasi memajukan dunia IT terutama dalam bidang Web App. Berikut ini beberapa versi HTML dari awal hingga sekarang.

a. Versi HTML1 (heading, hypertext, cetak tebal, cetak miring, list, dan paragraph)

b. Versi HTML2 (form)

c. Versi HTML3 (tabel)

d. Versi HTML4 (lebih interaktif)

e. Versi HTML5 (video, audio, artikel, footer, header, nav, kalender, tanggal, waktu, url, search)

3. HTML Head, Title, dan Body

a. HTML

HTML merupakan dasar atau tulang punggung dalam pembuatan sebuah Web. Penulisan Tag HTML adalah incasesensitive yang artinya <HTML> akan sama dengan <html> atau <Html>.

b. Head

Header berfungsi sebagai tanda pengenal pada halaman yang akan dibuat.

c. Title

Tag <title> berfungsi untuk membuat judul website. Sementara itu, tag <head> berfungsi untuk membuat kepala dokumen.

d. Body

HTML elemen body menunjukkan konten sebuah dokumen.

BAB 2
Format Tabel Dan Format Multimedia Pada Halaman Web

A. Format Tabel pada halaman web

1. Tag - Tag Tabel dalam HTML

<table> = Digunakan untuk membuat tabel

<tr> = Singkatan dari table row, digunakan untuk membuat baris dari tabel

<td> = Singkatan dari table data, digunakan untuk menginput data ke tabel

2. Cellpadding

Atribut cellpadding digunakan untuk menentukan jarak spasi di dalam sel, yaitu di antara dinding sel dan isi sel

3. Cellspacing

Atribut cellspacing digunakan untuk menentukan jarak spasi antarsel.

4. Border

Atribut border digunakan untuk membuat bingkai pada tabel dengan menentukan tebal bingkai tersebut.

5. Rowspan dan Colspan

HTML menyediakan atribut khusus untuk merge cell, yaitu rowspan dan colspan. Penggunaan atribut colspan dan rowspan diterapkan pada tag <td> dan tag <th>. Colspan berartiu penggabungan beberapa kolom sel menjadi satu sel, sedangkan rowspan berarti penggabungan beberapa baris sel menjadi satu baris sel.

B. Format Multimedia pada Halaman Web

1. Tag menampilkan gambar

Penambahan gambar pada HTML dapat menggunakan elemen img. Elemen img merupakan elemen yang bersifat self-contained (tidak memjiliki tag penutup).

2. Tag untuk audio

HTML memiliki fitur untuk menambahkan pemutar suara (audio) pada dokumen web. Elemen audio diguanakan untuk tujuan tersebut sama seperti menggunakan elemen img dengan memberikan nilai tempat menyimpan file audio melalui atribut src.

3. Tag untuk video

Atribut - atribut yang dapat digunakan pada elemen audio juga digunakan pada elemen video sehingga perbedaan utama dari kedua elemen ini terdapat pada nama elemen dan dukungan format.

BAB 3
Format Kaitan dan Format Formulir Pada Halaman Web

A. Format Kaitan pada Halaman Web

1. Konsep Hyperlink dalm HTML

Link berguna untuk menghubungkan antar dokumen HTML. Link merupakan singkatan dari hyperlink, yang identik dengan sebuah fungsi dalam HTML yang digunakan untuk memudahkan user untuk elususitri seluruh isi atau informasi yang tersimpan dalam website bersangkutan.

Link Absolut adalah link yang mengarah langsung pada website tertentu, di mana sebuah dokumen dikunci pada alamat valid sebuah website

Link Relatif adalah link yang mengarah langsung pada lokasi path atauy direktori tujuan yang tersimpan pada web server atau komputer.

2. Tag - Tag untuk Hyperlink

<a> berfungsi dalam mendefinisikan sebuah hyperlink yang digunakan untuk menghubungkan halaman satu ke halaman lain.

<nav> berfungsi untuk mendefinisikan link navigasi.

Mailto berfungsi memudahkan pengguna untuk mengirimkan e-mail ke suatu alamat e-mail tertentu.

B. Format Formulir pada Halaman Web

1. Penggunaan Tag Form

<button> Merupakan tombol yang dapat diklik

<form> Mendefinisikan untuk form bagi user

<input> Mendefinisikan kontrol input pada form

<select> Merupakan daftar secara drop-down

<textarea> Mendefinisikan kontrol input berupa area text pada form

2. Metode Get dan Post

Metode GET identik dengan metode yang digunakan oleh browser untuk meminta server mengirim kembali resource yang diberikan.

Metode POST sedikit berbeda dengan GET karena pada POST akan mengirimkan server permintaan respons dengan memperhitungkian data yang tersedia.

3. Tipe - Tipe Inputan dalam Form (Text, Password, Radio, Checkbox, Hidden, Button, Submit, dan File)

a. Komponen textarea multiline

Komponen textarea merupakan area untuk menyimpan text baru atau bisa dikatan sebuah komponen HTML yang digunakan untuk menampilkan text dalam bentuk dan format text.

b. Komponen Input Text Password

Komponen input text password bertanggung jawab untuk memasukkan data password.

c. Komponen input text

Komponen input text merupakan komponen untuk memasukkan data text ke server dalam bentuk textfield.

Dasar - Dasar Web