You are on page 1of 6

Seminar Nasional Inovasi dan Teknologi (SNIT) 2012

PERANCANGAN DAN IMPLEMENTASI WEBSITE ELECTRONIC


NEWS (E-NEWS) UNTUK PEMANFAATAN TEKNOLOGI INFORMASI
DAN KOMUNIKASI

Ruhul Amin
Program Studi Manajemen Informatika
Akademik Manajemen Informatika dan Komputer Bina Sarana Informatika (AMIK BSI)
Jl. Cut Mutia No.88, Bekasi
ruhulamin40@gmail.com

Abstraksi - Website Electronic News (E-News) dibuat menggunakan bahasa pemograman berbasis web yaitu
PHP versi 5.2.4, MySQL versi 5.0.45 sebagai DBMSnya dan Apache 2.0 untuk webservernya. Website E-News
merupakan aplikasi yang dibuat untuk memudahkan seseorang didalam menyebarkan berita atau informasi
dengan cepat dan dapat juga digunakan untuk memenuhi kebutuhan penggunanya. Website E-News menyajikan
informasi dalam bentuk teks, gambar, suara dan animasi. Aplikasi website E-News merupakan aplikasi client-
server yang menggunakan media internet. Website E-News memiliki fasilitas untuk menangani manajemen
berita dan agenda kegiatan, mulai dari penambahan berita, perubahan berita dan penghapusan berita. Dengan
adanya website ini diharapkan dapat membantu masyarakat umum untuk memperoleh berita terkini sesuai
dengan kategori berita yang telah disediakan.

Kata kunci : Website, E-News, Client-Server.

1. PENDAHULUAN dibuktikan dengan adanya situs-situs E-News atau


Perkembangan teknologi informasi pada saat ini situs lain yang bergerak dalam kegiatan penyebaran
berkembang semakin pesat. Hal ini disebabkan berita dan informasi secara aktual seperti
kebutuhan masyarakat akan informasi yang berguna www.detik.com, www.jawapos.co.id,
semakin tinggi dan cepat. Masyarakat sekarang www.kompas.com dan lain sebagainya.
membutuhkan informasi untuk menambah
wawasannya, untuk pertukaran informasi dan juga 2. TINJAUAN PUSTAKA
untuk bersosialisasi. Dengan berkembangnya 2.1 Pengertian Website
teknologi informasi, pengkasesan data dan informasi Website adalah kumpulan dari halaman-halaman
yang tersedia diharapkan dapat berlangsung dengan situs, yang terangkum dalam domain dan
cepat, efisien dan akurat. Internet merupakan salah subdomain, yang tempatnya berada didalam World
satu media yang banyak digunakan oleh masyarakat Wide Web (WWW) di internet. Halaman-halaman
untuk pengaksesan data dan informasi. dari website akan bisa diakses melalui sebuah URL
Penggunaan teknologi internet pada saat ini telah yang biasa disebut dengan Homepage. URL akan
membuat jarak antara masyarakat satu dengan yang mengatur halaman-halaman situs untuk menjadi
lainnya semakin dekat untuk berbagai kegiatan sebuah hirarki. Semua publikasi dari website-
manusia. Dimulai dari kegiatan komunikasi, bisnis, website tersebut dapat membentuk sebuah jaringan
pertukaran informasi dan kegiatan lainnya. Hal ini informasi yang sangat besar. Website menyajikan
terbukti dengan banyaknya situs-situs (website) yang layanan yang berpusat pada user (pengguna) dimana
disesuaikan dengan kebutuhan dan kegiatan pengguna akan dimudahkan untuk untuk
masyarakat, seperti website E-News, E-learning, menggunakan berbagai pelayanan yang ada.
E-commerce, E-Social, E-Goverment dan situs-situs Pengguna dapat dengan mudah untuk memasukkan
lainnya. Dengan berkembangnya teknologi data atau mengambil data dari sistem. Pengguna
informasi dan komunikasi ini berpengaruh pada nantinya diharapkan berpartisipasi dalam situs dan
dunia jurnalistik. Berawal dari media yang biasa pengelola situs berfungsi sebagai fasilitator saja.
digunakan media cetak atau media eletronik seperti
majalah, koran, radio, televisi dan sebagainya. Pada 2.2 Tahapan Pembuatan Website
saat ini tentunya harus mengikuti perkembangan Tahapan membangun Website, sesuai dengan model
teknologi yang ada, dengan cara memberikan atau Waterfall, yaitu :
menyebarkan informasi menggunakan teknologi 1. Planning
internet agar penyebaran informasinya banyak Yaitu membuat rancangan awal sebuah website.
dibaca dan diakses oleh masyarakat. Hal ini 2. Designing

Proceedings SNIT 2012: Hal. A-233


Seminar Nasional Inovasi dan Teknologi (SNIT) 2012

Yaitu menentukan bentuk desain serta elemen- untuk mengatur style elemen dalam halaman web.
elemen yang terdapat di dalam website, layout Pada website E-News digunakan mengatur header,
(tata letak) content website, kombinasi warna, content dan footer dari website.
dan bentuk huruf (tipografi) yang sesuai dengan
karakteristik website. 2.7 MySQL
3. Coding Merupakan DBMS (database management system)
Yaitu tahapan membangun website yang didukung oleh bahasa operasional SQL
menggunakan pemrograman web dari sisi client (Structured Query Language). SQL adalah bahasa
side scripting dan server side scripting. standar yang digunakan untuk mengakses basisdata
4. Testing relational. MySQL dapat digunakan oleh beberapa
Yaitu tahapan untuk memastikan agar website user dalam waktu bersamaan tanpa mengalami
sudah benar-benar layak untuk ditampilkan masalah atau konflik dan tidak harus menunggu
kepada publik. yang lain untuk mengakses database. MySQL
5. Promotion didistribusikan oleh pembuatnya secara open source
Yaitu tahapan mengenalkan website kepada sehigga dapat digunakan secara bebas baik individu
pengguna. maupun kelompok. MySQL juga dapat berjalan
6. Maintenance stabil pada berbagai sistem operasi seperti Windows,
Yaitu tahapan pemeliharaan website, tahap ini Linux dan Macintosh. MySQL yang digunakan
memastikan bahwa website dapat berjalan untuk pembuatan Website E-News yaitu MySQL
dengan baik setiap harinya, termasuk dari sisi versi 5.0.45.
keamanannya.
2.8 E-News
2.3 Web Server Adalah kependekan dari Electronic News yang
Merupakan sebuah perangkat lunak dalam server berarti berita atau iformasi yang dikemas secara
yang berfungsi menerima (request) berupa halaman menarik dan disampaikan melalui media eletronik
web melalui HTTP atau HTTPS dari klien yang secara online. Berita atau informasi ditampilkan oleh
dikenal dengan browser web dan mengirimkan komputer yang terhubung dengan internet,
kembali (response) hasilnya dalam bentuk halaman- ditampilkan oleh browser yang terhubung dengan
halaman web juga kepada klien. Web server yang sebuah server. Pada website E-News ini nantinya
digunakan pada website E-News yaitu Apache 2.0. penguna bisa mengirim berita atau informasi yang
akan disebarkan kepada pengguna lain dengan
2.4 PHP catatan sudah terdaftar sebagai pengguna pada
PHP merupakan bahasa pemrograman web yang website E-News ini. Pengguna bisa mengirim berita
berbentuk script yang dijalankan dan diproses di dengan kategori hiburan, teknologi, ekonomi, olah
dalam server. Oleh karena hal tersebut PHP dikenal raga dan politik.
sebagai server-side programming. PHP juga
merupakan bahasa pemrograman multiplatform, bisa 2.9 Domain dan Hosting
dijalankan dilingkungan Windows, Linux dan Domain adalah nama unik yang diberikan untuk
Macintosh. Pada saat ini PHP sangat populer karena mnegindetifikasi nama server komputer seperti web
merupakan perangkat lunak gratis. Untuk server atau email server di internet. Domain
menggunakannya tidak perlu bayar atau beli. PHP memberikan kemudahan pengguna di internet untuk
yang digunakan untuk pembuatan Website E-news melakukan akses ke server dan mengingat server
yaitu PHP Versi 5.2.4. yang dikunjungi dibandingkan harus mengenal
deretan nomor atau yang dikenal IP (Internet
2.5 XHTML Protocol).
XHTML adalah bahasa client side scripting yang Hosting adalah space dalam server yang digunakan
digunakan untuk menampilkan informasi yang pada sebagai penempatan data dan file yang telah dibuat.
halaman web, karena XHTML menampilkan Dalam analogi sederhana domain adalah nomor
informasi dalam bentuk hypertex dan juga kartu selular, sedangkan hosting adalah perangkat
mendukung sekumpulan perintah yag dapat telepon selularnya.
digunakan untuk mengantur tampilan informasi di
web.
3. METODE PENELITIAN
Teknik pengumpulan data sangat penting untuk
2.6 CSS
dapat digunakan dalam menganalisa, mendesign,
CSS kepanjangan dari Cascade Style Sheet
atau mengembangkan suatu perencanaan
digunakan penulis untuk mengatur style elemen
membangun web. Penulis tidak hanya menggunakan
yang ada dalam halaman web, mulai dari
satu teknik pengumpulan data tetapi menggunakan
memformat text dan juga mendesain layout. Tujuan
beberapa teknik pengumpulan data, karena teknik
dari penggunaan CSS adalah untuk memperoleh
pengumpulan data juga mempunyai kekurangan dan
suatu konsisten style pada elemen tertentu. Dengan
kelebihannya masing-masing. Beberapa teknik
menggunakan CSS akan membuat lebih mudah

Proceedings SNIT 2012: Hal. A-234


Seminar Nasional Inovasi dan Teknologi (SNIT) 2012

pengumpulan data yang digunakan penulis adalah 4. PERANCANGAN DAN IMPLEMENTASI


sebagai berikut :
Pada bagian perancangan akan dibahas tentang
1. Pengamatan Lapangan (Observasi )
perancangan website ini mulai dari perancangan
Kegiatan ini dimaksudkan untuk mencari dan
database, struktur navigasi, perancangan tampilan
mengumpulkan data yang langsung dari
(story board) rancangan input dan output.
sumbernya dengan melakukan pengamatan
secara langsung yang sekaligus merupakan
4.1 Perancangan database
bahan masukan untuk membangun website.
Langkah awal sebelum melakukan pemrograman
Melakukan pengamatan dengan cara mengamati
adalah merancang atau mendesain database.
website-website yangsudah ada seperti
Metodenya bisa menggunakan normalisasi atau
www.detik.com, www.jawapos.co.id,
E-RD (Entity Relationship Diagram). Tetapi
www.kompas.com
perancangan database penulis menggunakan metode
2. Wawancara (Interview)
E-RD, dimana hanya menentukan objek-objek apa
Dalam pengumpulan data, penulis melakukan
saja yang nantinya terlibat dalam sistem. Pada kasus
wawancara secara langsung kepada pihak-pihak
ini objek yang terlibat adalah user (reporter/penulis
yang membutuhkan atau yang yang
berita), agenda, berita dan kategori dari berita yang
menggunakan website E-News.
akan ditampilkan. Dapat dilihat pada gambar 4.1.
3. Studi Pustaka (Literatur Study)
Langkah berikutnya mengimplementasikannya di
Penulis merangkum berbagai sumber bacaan
database MySQL, penulis menggunakan bantuan
dari bahan-bahan pustaka yang ada
dbdesigner untuk implemetasi ke MySQL. Seperti
hubungannya dengan masalah yang akan
ditunjukan pada gambar 4.2.
dibahas. Hal ini penulis lakukan sebagai bahan
pelengkap untuk membangun website E-News.

dibaca
Id_berita gambar
blokir password userame

jam judul

Nama_lengkap

USER Mengirim BERITA


No_telp 1 M Isi_berita

1 M hari

level
tanggal

Mengisi Mempunyai

Tgl_posting
sumber M 1

tempat AGENDA KATEGORI Nama_kategori


Tgl_selesai

Isi_agenda

tema Id_agenda Tgl_mulai Id_kategori

Gambar 4.1. Gambar ER-D untuk perancangan database

Gambar 4.2. Gambar relasi antar tabel yang terbentuk

Proceedings SNIT 2012: Hal. A-235


Seminar Nasional Inovasi dan Teknologi (SNIT) 2012

Leftcontent Rightcontent
4.2 Struktur Navigasi
Struktur navigasi website digunakan untuk
menggambarkan isi dari dari seluruh halaman web
dan menggambarkan bagaimana hubungan antara isi-
isi dalam website tersebut. Struktur navigasi dari
website berbentuk struktur navigasi hirarki. Melalui
struktur navigasi website ini, terlihat bagaimana isi
dan susunan dari sebuah website secara keseluruhan,
Clearer
struktur sama fungsinya dengan flowchart , yaitu
Footer
memberikan petunjuk kepada user sehingga user
Gambar 4.5. Gambar rancangan layout serta identitas
mempunyai pedoman didalam menggunakan website masing-masing area
ini.
Home
4.3.2 Tampilan Website E-News
a. Halaman awal pengunjung
Ekonomi

Hiburan

Index Olahraga

Politik

Ekonomi

Agenda

Berita sebelumnya

Gambar 4.3. Struktur Navigasi pengunjung Website


E-News
Gambar 4.6. Gambar halaman utama Website E-News
Home

b. Halaman detail berita


Manajemen User

Manajemen Modul

Index Kategori

Berita

Agenda

Banner

Logout

Gambar 4.4. Struktur Navigasi Pengguna atau User

4.3 Perancangan Input dan Output Website


4.3.1 Merancang Tampilan Layout
Pada bagian ini adalah mengatur tata letak atau letak
dari desain website E-news menggunakan layout CSS
dan XHTML.
Wrapper

Header

Proceedings SNIT 2012: Hal. A-236


Seminar Nasional Inovasi dan Teknologi (SNIT) 2012

Gambar 4.7. Gambar halaman detail berita Website E-


News

c. Halaman login pengguna

Gambar 4.10. Gambar halaman manajemen modul Website


E-News
Gambar 4.8. Gambar halaman login pengguna/user

g. Halaman manajemen kategori berita


d. Halaman awal penguna

Gambar 4.10. Gambar halaman manajemen kategori berita


Website E-News

h. Halaman manajemen Berita

Gambar 4.9. Gambar halaman awal pengguna Website E-


News

e. Halaman Manajemen User

Gambar 4.11. Gambar halaman manajemen berita Website


E-News

i. Halaman manajemen Agenda

Gambar 4.10. Gambar halaman manajemen user Website


E-News
f. Halaman Manajemen Modul

Gambar 4.12. Gambar halaman manajemen agenda


Website E-News

Proceedings SNIT 2012: Hal. A-237


Seminar Nasional Inovasi dan Teknologi (SNIT) 2012

j. Halaman namajemen banner di pihak klien atau orang yang ditunjuk untuk
mengelola website untuk kedepannya nanti. Tugas
rutinnya adalah mengelola content website dan user
yang terlibat dalam website.

5. PENUTUP
5.1 Kesimpulan

Gambar 4.13. Gambar halaman manajmen banner Website a. Dengan menggunakan database, akan
E-News memudahkan dalam pemrosesan data dan
mengurangi pemberkasan. Selain itu juga
lebih terjaminnya keamanan (security)
sehinggan tidak terjadi kerusakan atau
redudansi.
k. Halaman logout b. Website E-News memberikan kemudahan
kepada para penggunanya dalam
menambah, merubah dan menghapus berita
dan informasi yang akan disajikan kepada
pengunjung website E-News.
c. Dengan adanya Website E-News informasi
Gambar 4.14. Gambar halaman logout Website E-News dan berita terkini dapat disajikan dengan
mudah dan cepat kepada masyarakat melalui
media internet.
4.4 Arsitektur Web Server

5.2 Saran
a. Website E-News memerlukan sekuritas yang tinggi
untuk melindungi data-datanya. Perlu adanya
sistem keamanan bagi para penggunanya
b. Pengguna diharapkan selalu menambah informasi
dan berita terkini sesuai dengan kategori yang
telah disediakan agar Website E-News banyak
diakses oleh pengunjung.

6. DAFTAR REFERENSI
Gambar 4.15. Gambar arsitektur web server [1] Lukamanul Hakim, Jalan Pintas Menjadi Master
PHP, Lokomedia, 2009.
4.5 Promosi Web (Promotion)
[2] Abdul Kadir Dasar Pemorograman Web
Mengenalkan atau mempromosikan website
Menggunakan PHP, ANDI, 2003.
merupakan suatu keharusan. Website tidak akan
[3] Emerson Sagala, Making Of Sport News
dikenal jika tidak dipromosikan. Promosi yang paling
Website Using PHP dan MySQL, Gunadarma
efektif adalah melalui media internet, tertutama
University Library :
dengan cara mendaftarkannya ke search engine
http://library.gunadarma.ac.id.
seperti Yahoo dan Google. Selaitu itu juga bisa
[4] Zakaria Akhmad, Perancangan Sistem Informasi
menggunakan cara pertukaran banner (afiliasi)
Akademik Berbasis Web Pada Sekolah
dengan website lain juga bisa menjadi ajang promosi
Menengah Pertama (SMPN) 10 Bekasi, STMIK
yang menarik. Cara lain juga bisa memberikan
Bina Insani Bekasi.
komentar-komentar pada suatu artikel yang biasanya
[5] Lukmanul Hakim, Uus Musalini, Buku Sakti
terdapat pada blog.
Menjadi Programmer Sejati PHP, Solusi Media,
4.6 Pemeliharaan Web (Maintenance) Jakarta.
Tahap terakhir adalah maintenance atau
pemeliharaan website. Tahapan ini memastikan
bahwa website dapat berjalan dengan baik setiap
harinya, termasuk dari segi keamanannya. Biasanya
ada kesepakatan terlebih dahulu antara web
developer dengan klien mengenai maintenance,
misalnya selama satu tahun apabila ada fitur yang
error atau terjadi kerusakan pada website, maka akan
diperbaiki oleh web developer. Adapun maintenance

Proceedings SNIT 2012: Hal. A-238