Interaksi Manusia dan Komputer[Kode Kelas]

[ Chapter 8]WWW (World Wide Web) - Website

Dedy Alamsyah, S.Kom, M.Kom[NIDN : 0410047807]

World Wide Web atau WWW atau juga dikenal dengan WEB adalahsalah satu layanan yang didapat oleh pemakai komputer yang terhubung ke internet

WWW (World Wide Web) ditemukan oleh Sir Tim Berners-Lee pada tahun1991.

Website (situs web) merupakan alamat (URL) yang berfungsi sebagaitempat penyimpanan data dan informasi dengan berdasarkan topiktertentu.

Web Page (halaman web) merupakan halaman khusus dari situs web tertentu yang tersimpan dalam bentuk file.

Home page merupakan sarana dasar untuk memperkenalkan secarasingkat tentang apa yang menjadi isi dari keseluruhan website darisuatu organisasi atau pribadi.

Melalui perkembangan teknologi informasi, tercipta suatu jaringanantar komputer yang saling berkaitan.

Jaringan yang dikenal dengan istilah internet secara terus-menerusmenjadi pesan–pesan elektronik, termasuk e-mail, transmisi file, dankomunikasi dua arah antar individu atau komputer.

Definisi Website

1. Menurut Suwanto Raharjo S.Si, M.Kom, Web merupakan salah satu layananinternet yang paling banyak digunakan dibanding dengan layanan lain sepertiftp, gopher, news atau bahkan email.

2. Menurut Wahana Komputer, Web adalah formulir komunikasi interaktif yang digunakan pada sutu jaringan komputer.

3. Menurut A. Taufiq Hidayatullah, Web adalah bagian paling terlihat sebagaijaringan terbesar dunia, yakni internet.

4. Menurut Haer Talib, Web adalah sebuah tempat di internet yang mempunyainama dan alamat.

5. Menurut Boone (Thomson), Web adalah koleksi sumber informasi kaya grafis yang saling berhubungan satu sama lain dalam internet yang lebih besar.

6. Menurut Feri Indayudha, Web adalah suatu program yang dapat memuat film, gambar, suara, serta musik yang ditampilkan dalam internet.

7. Menurut Yuhefizar, Web adalah suatu metode untuk menampilan informasi di internet, baik berupa teks, gambar, suara maupun video yang interaktif danmempunyai kelebihan untuk menghubungkan (link) satu dokumen dengandokumen lainnya (hypertext) yang dapat diakses melalui sebuah browser

Definisi menurut para ahli

Arsitektur Aliran Data Website

Web Statis

Web Dinamis (ASP.Net)

Web Dinamis (PHP)

Cara Kerja Nama Domain (DNS)

a) Informasi web disimpan dalam dokumen dalam bentukhalaman-halaman web atau web page (hypertext markup language)

b) Halaman web tersebut disimpan dalam computer server web (IIS, Apache).

c) Sementara dipihak pemakai ada computer yang bertindak sebagai computer client dimana ditempatkanprogram untuk membaca halaman web yang ada di server web (browser-> Firefox, Chrome, IE).

d) Browser membaca halaman web yang ada di server web

Cara Kerja Web

Perangkat (Komputer, Laptop, Smartphone, Tablet) yang digunakan harus ada koneksi internet

Ada Sistem Operasi yang aktif atau sudah terinstall (Windows, Linux, Mac OSX, Chrome OS, Symbian, dll)

Menggunakan peramban (browser) seperti Firefox, Chrome, Opera, Internet Explorer, Safari

Add on yaitu library tambahan untuk peramban fungsinyauntuk menampilkan content spesifik seperti: flash, video format tertentu, java applet, dst.

Pointer (mouse, touchscreen)

Perangkat Untuk Mengakses Website

Nama domain (Domain name/URL – Uniform Resource Locator) Nama Domain (Domain Name) atau URL adalah alamat unik di dunia internet yang digunakan

untuk mengidentifikasi sebuah website, atau dengan kata lain domain name adalah alamatyang digunakan untuk menemukan sebuah website pada dunia internet,

Fungsi nama domain adalah sebagai tanda pengenal di dunia internet, domain name server berfungsi untuk merubah dari nama alamat ip menjadi nama computer (nama domain) contoh : Google.com -> 8.8.8.8 , umt.ac.id -> 101.50.1.15

Rumah tempat website (Web hosting) Pengertian Web Hosting dapat diartikan sebagai ruangan yang terdapat dalam harddisk tempat

menyimpan berbagai data, file-file, gambar dan lain sebagainya yang akan ditampilkan di website

Semakin space atau ruangan yang disewa maka akan semakin mahal

Bahasa Program (Scripts Program) Bahasa pemrograman computer (3G) yang dikhususkan untuk membuat website menjadi

dinamis, contoh : PHP, ASP.Net, Java, Ruby, JavaScript, dll

Desain website Adalah layout (tata letak) atau disain tampilan sebuah website yang biasanya terdiri dari tata

letak, gambar, warna.

Isi Website (content) Isi website atau content website adalah data dan informasi yang ditampilkan pada website. Bisa

bersifat statis ataupun dinamis.

Unsur Pembentuk Website

1. Fungsi komunikasi

Situs web yang mempunyai fungsi komunikasi pada umumnya adalah situs web dinamis. Karena dibuat

menggunakan pemograman web (server side) maka dilengkapi fasilitas yang memberikan fungsi-fungsi

komunikasi, seperti web mail, form contact, chatting form, dan yang lainnya.

2. Fungsi informasi

Situs web yang memiliki fungsi informasi pada umumnya lebih menekankan pada kualitas bagian

kontennya, karena tujuan situs tersebut adalah menyampaikan isisnya. Situs ini sebaiknya berisi teks dan

grafik yang dapat di download dengan cepat. Pembatasan penggunaan animasi gambar dan elemen

bergerak sepertio shockwave dan java diyakini sebagai langkah yang tepat, diganti dengan fasilitas

yang memberikan fungsi informasi seperti news, profile company, library, reference,dll.

3. Fungsi entertainment

Situs web juga dapat memiliki fungsi entertainment/hiburan. Bila situs web kita berfungsi sebagai sarana

hiburan maka penggunaan animasi gambar dan elemen bergerak dapat meningkatkan mutu

presentasi desainnya, meski tetap harus mempertimbangkan kecepatan downloadnya. Beberapa

fasilitas yang memberikan fungsi hiburan adalah game online, film online, music online, dan sebagainya.

4. Fungsi transaksi

Situs web dapat dijadikan sarana transaksi biisnis, baik barang, jasa, atau lainnya. Situs web ini

menghubungkan perusahaan, konsumen, dan komunitas tertentu melalui transaksi elektronik.

Pembayarannya bisa menggunakan kartu kredit, transfer, atau dengan membayar secara langsung.

Fungsi Web Secara Umum

1. Alat Pemasaran Saat ini media pemasaran tidak hanya media cetak saja. Media elektronik sejenis situs

juga dapat digunakan sebagai media pemasaran. Pemasaran melalui internet lebhcepat sampai dan memiliki jangkauan yang jauh lebih luas.

2. Nilai Tambah Sebuah halaman web merupakan sarana promosi karena media promosi di web lebih

murah dan efektif dibandingkan media promosi konvensional seperti brosur, majalahatau Koran. Pada umumunya konten situs web berupa referensi atau informasitambahan dari apa yang sudah diberikan secara offline. Contohnya seperti di perpustakaan sudah disediakan koleksi skripsi secara tercetak namun di web perpustakaan terdapat repository skripsi yang lebih banyak dan dapat diakses denganmudah dengan cara mendownload bentuk softfile nya.

3. Katalog Untuk di perpustakaan katalognya berupa katalog online yang dapat diakses melalui

web perpustakaan. Pada katalog tersebut tersedia koleksi-koleksi yang dimiliki olehperpustakaan. Pemustaka dapat mengakses koleksi tersebut dengan caramemasukkan judul, pengarang maupun subjek dari suatu koleksi yang dibutuhkan. Sedangkan untuk melakukan peminjaman pemustaka dapat langsung meminjam keperpustakaan.

4. E-Commerce E-Commerce merupakan suatu kumpulan yang dinamis antara teknologi, aplikasi dan

proses bisnis yang menghubungkan perusahaan, konsumen dan komunitas tertentumelalui transaksi elektronik.

Jenis Web Menurut Fungsi

5. E-Learning

Cisco menjelaskan filosofis e-learning sebagai berikut: Pertama, e-learning merupakanpenyampaian informasi, komunikasi, pendidikan, pelatihan secara on-line. Kedua, e-learning menyediakan seperangkat alat yang dapat memperkaya nilai belajar secarakonvensional (model belajar konvensional, kajian terhadap buku teks, CD-ROM, danpelatihan berbasis computer) sehingga dapat menjawab tantangan perkembanganglobalisasi.

6. Komunitas

Sebuah situs web yang dibuat dengan tujuan untuk memungkinkan pengunjung

berkomunikasi secara bersamaan. Pengunjung bisa berbagi pengalaman, cerita, ide,

dna lainnya, bisa juga mencari dan menambah teman, atau untuk membuat suatu

perkumpulan baru.

7. Portal

Portal adalah aplikasi berbasis web yang menyediakan akses suatu titik tunggal dari

informasi online terdistribusi, seperti dokumen yang didapat melalui pencarian, kanal

berita, dan link ke situs khusus. Untuk memudahkan penggunaannya biasanya disediakan

fasilitas pencarian dan pengorganisasian informasi.

8. Personal

Situs personal merupakan situs yang memiliki tujuan untuk mempromosikan atau

menginformasikan tentang seseorang. Biasanya berisi tentang biodata, portofolio

(kumpulan hasil karya yang pernah dibuat), prestasi, atau sebagai diary yang

menceritakan kehidupan sehari-hari yang dipublish agar orang lain dapat mengetahui

dna mengenal tentangnya.

1. Usability

Pengguna dalam berinteraksi dengan aplikasi atau situs web dapat dioperasikan dengan

mudah dan cepat (Mudah untuk dipelajari, Efisien dalam penggunaan, Mudah untuk

diingat, Tingkat kesalahan rendah, Kepuasan pengguna).

2. Sistem Navigasi

Sistem navigasi berfungsi, jelas, mudah diakses, konsisten, terstruktur

3. Graphic Design (Desain Visual)

Tampilannya nyaman dan menarik hari

4. Contents

Isi website harus menarik, update dan sesuai dengan tema website tersebut.

5. Compatibility

Harus kompatibel dengan perangkat pengakses (browser/ peramban) yang digunakan oleh

pengguna.

6. Loading Time

Waktu tampil dan respon dari website harus cepat

7. Functionality

Dapat berfungsi sesuai tujuan dari website tersebut (teknologi)

8. Accesibility

Harus dapat diakses oleh semua kalangan (anak-anak, remaja, orang tua, orang cacat)

9. Interactivity

User bisa melakukan feedback atau dapat berinteraksi

Kriteria Website Yang Baik

1. Rekayasa dan Pemodelan Sistem/Informasi Pada tahap ini dimulai dengan membangun syarat dari semua elemen

sistem dan mengalokasikan beberapa subset kebutuhan software tersebut. Pandangan sistem ini penting ketika software harus berhubungan denganelemen-elemen lain seperti software, manusia, dan database. Rekayasadan analisis sistem menyangkut pengumpulan kebutuhan pada tingkatsistem dengan sejumlah kecil analisis serta desain tingkat puncak.

2. Planning (Perencanaan) Pada tahap ini yaitu untuk menentukan tujuan dari software yang akan

dibuat, melakukan analisis kebutuhan dna pengumpulan data yang diperlukan. Proses pengumpulan kebutuhan diintensifkan dan difokuskan, khususnya pada kebuthan software. Untuk memahamai sifat program yang dibangun, analis harus memahami domain informasi, tingkah laku, unjukkerja, dan interface yang diperlukan.

3. Designing (Desain) Desain software sebenarnya merupakan proses multi langkah yang

berfokus pada empat atribut yang berbeda, yaitu struktur data, arsitektursoftware, representasi interface, dan detil (algoritma) procedural. Jadipada tahap ini proses mendesain harus berdasarkan kebutuhan sehinggasesuai dengan yang diharapkan sebelum memulai pengkodean.

Tahapan Dalam Membangun Website

4. Scripting (Pemograman)

Desain harus diterjemahkan ke dalam bentuk mesin yang bisa dibaca. Dalam tahap ini adanya pembuatan kode. Jika desain dilakukan secaralengkap, pembuatan kode dapat diselesaikan secara mekanis.

5. Testing (Pengujian)

Proses pengujian berfokus pada logika internal software untuk memastikanbahwa semua pernyataan sudah diuji, dan pada fungsi eksternal yaitumengarahkan pengujian untuk menemukan kesalahan-kesalahan danmemastikan bahwa dengan input yang terbatas akan didapatkan hasilactual yang sesuai dengan yang dibutuhkan.

6. Maintenance (Pemeliharaan)

Software mungkin akan mengalami perubahan setelah diserahkan kepadapelanggan. Perubahan bisa terjadi karena kesalahan-kesalahan tertentu, karena software harus diubah untuk mengakomodasikan perubahan-perubahan di dalam lingkungan eksternalnya, atau karena pelangganperlu melakukan pengembangan fungsional atau unjuk kerja

Website harus selalu update, harus punya komitmen untukselalu mengisi content yang menarik pada situs

Segera perbaiki kekurangan-kekurangan pada situs Anda jikahal tersebut dilaporkan oleh pengunjung situs Anda. Sptkeluhan user tentang lamanya feedback atau loading website, link yang rusak, gambar atau video yang tidak ada, dst.

Promosikan melalui media chating, media social atau forum-forum spt : Facebook, BBM, Kaskus, Twitter, Youtube, Yahoo! Messenger, MSN Messenger, IRC, dll

Daftarkan di Search Engine spt : Google atau yahoo

Selalu memantau perkembangan situs melalui statistik yang disediakan oleh jasa hosting yang anda gunakan.

Mempelajari perilaku pengunjung situs Anda dari statistik inidan juga bisa memantau apa yang mereka cari dan apayang mereka inginkan dari situs Anda.

Langkah-langkah pemeliharaan website

Semua teks menggunakan huruf kapital (hurup besar)

Menggunakan komposisi warna yang membuat mata tidak nyaman

Ukuran teks yang amat kecil atau terlalu besar, terutama huruf miring dan jenis huruf yang tidak terbaca jelas.

Link yang tidak terhubung atau rusak

Animasi dan iklan yang tanpa berhenti dan cenderung mengganggukenyamanan akses.

Video dengan ukuran file yang besar

Navigasi yang tidak jelas seperti tombol padahal bukan tombol

Melalaikan tag ALT untuk gambar

Tidak menandakan ukuran gambar

Tidak terdapat halaman home

Tidak ada tombol untuk menuju lokasi sebelumnya atau sesudahnya

Hal-hal yang perlu dihindari dalam

membangun sebuah web

Tidak mengetahui sasaran untuk pengguna situs

Memiliki platform teknologi yang tidak memadai

Tidak memberikan kenyamanan (User Interface Standard)

Tampil dengan interface yang tidak menarik

Isi yang ketinggalan jaman atau tidak akurat

Isinya tidak berbobot

Halaman yang diakses lambat

Susah untuk dipelihara dan dimaintain

Tingkat keamanan yang lemah

Permasalahan dalam pembuatan website

Selesai

Ada pertanyaan ???

1. Bentuk kelompok maksimal 3 orang

2. Tentukan satu buat website media sosial, e-commerce, portal berita, e-learning

3. Buatkan sebuah resume atau riview yang berkaitan dengan:1. Gambaran fungsi website beserta fitur-fitur yang disajikan

2. Layout dan disain

3. Isi yang disuguhkan ke pengguna

4. Navigasi atau sususan menu

5. Update Informasi

6. Target pengguna

7. Rangking di search engine (google)

Home Work

1. Sebutkan 5 website portal berita atau informasi

2. Sebutkan 5 website e-learning (belajar elektronik)

3. Sebutkan 5 website media social

4. Sebutkan 5 website e-commerce

5. Bandingkan 2 buah website yang menurut kamu masukkriteria bagus dan jelek dan sebutkan 5 alasannya

Latihan