SARINGAN PLAINTEKS UNTUK HTML Hery Prastia1, Jurusan Sistem Informasi Sekolah Tinggi Teknik Harapan Medan Jl. HM Jhoni No 70 Medan, Indonesia 1
[email protected], Abstrak Berkat perkembangan teknologi yang begitu pesat memungkinkan manusia dapat membuat sebuah halaman web yang menampilkan berbagai informasi didalam sebuah penjelajahan web internet dan pemformatan plainteks sederhana yang ditulis dalam berkas format ASCII sehingga menjadi halaman web dengan perintah – perintah HTML, sedangkan plainteks adalah suatu informasi dimana tidak menggunakan proses formatting teks yang khusus, seperti warna tulisan tidak beraneka ragam dan biasanya bentuk – bentuk tulisanya adalah default. Filter adalah rangkaian yang dirancang untuk melewatkan suatu frekuensi tertentu dengan memperlemah semua isyarat dilluar frekuensi tersebut. Dalam penerapan filter disini, filter yang digunakan untuk menyaring dokumen HTML, biasanya terdapat banyak sekali tag – tag sehingga pesan atau plainteks dalam dokumen HTML sukar dibaca, untuk membaca dokumen tersebut maka tag tersebut perlu dihapus secara manual satu persatu sehingga hanya tertinggal plainteks saja. Kata Kunci: Saringan, Html, Menghapus tag – tag Html. Abstract Thanks to the rapid development of technology that allow human to create a web page that displays a variety of information on the an internet web browser and simple plaintext that is written in file ASCII format so that it becomes a web pages with HTML commands. While the plaintext is an information and does not use special text formatting process, such as the text color is not diverse and are usually forms of writting is the default. Filter is a circuit designed to pass a certain frequency to weaken all signals outside the frequency in the application of filters here, filters are used to filter HTML document usually there are many tags that message or plaintext int the HTML document is hard to read, to read the document then the tags needs to be removed manually one by one so that left only plaintext. Key word: Filter, Html, Removed Html Tags.
1. Pendahuluan HyperText Markup Language (HTML) adalah sebuah bahasa yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuah penjelajahan web internet dan pemformatan hiperteks sederhana yang ditulis dalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegrasi. 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. HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web. Plain text adalah suatu text yang memberikan suatu informasi dan tidak menggunakan proses formatting text yang khusus, misalkan seperti warna penulisannya tidak beraneka ragam. HTML saat ini merupakan standar Internet yang mendefinisikan dan dikendalikan penggunaannya oleh Word Wide Web
Consortium (W3C). HTML dokumen tersebut mirip dengan dokumen tulisan biasa, hanya dalam dokumen ini sebuah tulisan bisa memuat instruksi yang ditandai dengan kode atau lebih dikenal dengan tag tertentu. Sebagai contoh jika ingin membuat tulisan ditampilkan menjadi tebal seperti : TAMPIL TEBAL, maka penulisannya dilakukan dengan cara :
TAMPIL TEBAL . Tanda
digunakan untuk mengaktifkan instruksi cetak tebal, diikuti oleh penulisan yang ingin ditebalkan, dan diakhiri dengan tanda untuk menonaktifkan cetak tebal tersebut. HTML lebih menekankan pada penggambaran komponen-komponen struktur dan format di dalam halaman web daripada menentukan penampilannya. Sedangkan penjelajahan web digunakan untuk menginterpretasikan susunan halaman ke gaya built-in penjelajah web digunakan
Biltek Vol. 4, No. 031 Tahun 2015 – Sekolah Tinggi Teknik Harapan
1
menggunakan jenis tulisan, tab, warna, garis, dan perataan text yang dikehendaki ke komputer yang menampilkan halaman web. Salah satu hal terpenting tentang eksistensi HTML adalah tersedianya Lingua Francia ( bahasa komunikasi ) antar computer dengan kemampuan berbeda. Di dalam dokumen HTML biasanya terdapat banyak sekali tag-tag sehingga pesan atau plainteks dalam dokumen HTML sukar dibaca, untuk membaca dokumen tersebut maka tag tersebut perlu dihapus secara manual satu persatu sehingga hanya tertinggal plainteks saja dan tentunya proses ini akan memakan waktu yang cukup lama jika didalam dokumen HTML terdapat banyak sekali tag yang harus dihapus, untuk itu diperlukan suatu saringan plainteks yang dapat memisahkan tag-tag yang ada dengan plainteks sehingga proses pembacaan plainteks lebih cepat. Berdasarkan latar belakang di atas maka penulis mencoba merancang suatu sistem dengan judul “Saringan Plainteks Untuk Html” sebagai syarat kelulusan Program S1 Sistem Informasi di STT Harapan. 2. Metode Penelitian Dalam penelitian ini tidak lepas dari tahapan yang akan dilakukan. Tahapan-tahapan dalam penelitian ini adalah sebagai berikut : 1.
2.
Metode Pengumpulan Data. Penelitian yang dilakukan berdasarkan data yang diperoleh dari teori buku-buku penunjang yang berhubungan dengan permasalahan sistem yang akan dikembangkan. Serta mengunjungi situssitus online di internet untuk menambah referensi yang dibutuhkan. Metode Pengolahan Data. a. Desain Sistem. Pada tahap ini dilakukan analisis desain dan perancangan system yang akan dilakukan :
b.
1) Pemodelan dan perancangan sistem, Pemodelan sistem menggunakan UML, Perancangan sistem diberikan berupa tampilan-tampilan program. Dalam hal ini penulis menggunakan bahasa pemrograman Visual Studio 2010. 2) Perancangan antar muka, Perancangan antar muka dilakukan guna membuat aplikasi yang user friendly sehingga mudah dioperasikan oleh pengguna. Pembuatan Sistem.
Pada tahap ini dilakukan pembuatan sistem informasi berdasarkan hasil desain sistem yang telah dibuat. c.
Uji coba dan Evaluasi. Aplikasi yang telah selesai ini nantinya juga akan diuji coba dan dilakukan evaluasi guna mengetahui kelayakan sistem dan sejauh mana sistem tersebut mampu diimplementasikan.
d. Penyusunan laporan Tugas Akhir. Pada tahap terakhir ini disusun buku sebagai dokumentasi dari pelaksanaan Tugas Akhir. Dokumentasi ini juga dibuat sehingga bagi orang lain yang ingin mengembangkan sistem tersebut bias mempelajari dari dokumentasi tersebut. 3. Hasil dan Pembahasan 3.1 Analisa Sistem Pada tahapan ini pembahasan difokuskan pada perancangan sistem yang dibangun, beberapa fase perancangan dibahas disini. Dalam sistem saringan plaintext pada file html, fungsi aplikasi yang akan dibuat adalah untuk menghasilkan plaintext dari sebuah file html. Dengan menghapus secara otomatis tag-tag script hmtl sehingga dihasilkan plaintext. 3.2 Perancangan Sistem Tahap perancangan sistem ialah menjelaskan tentang perancangan yang dibangun untuk mengetahui apa sajakelebihan dan kekurangan yang ada pada aplikasi. Karena perancangan dari aplikasi ini lebih di titik beratkan padaplaintext HTML.Dalam menjabarkan beberapa proses dari sistem, penulis akan menggambarkan dengan menggunakan beberapa diagram dari proses yang telah selesai dirancang, yaitu sebagai berikut. 3.3
Use Case Diagram Use case diagram berfungsi untuk menggambarkan kegiatan aktor atau pengguna aplikasi . Adapun use case diagram aplikasi yang dirancang dapat dilihat pada gambar 3.1 berikut :
Biltek Vol. 4, No. 031 Tahun 2015 – Sekolah Tinggi Teknik Harapan
2
Gambar 4.1 Tampilan Form Splash 4.1.2 Tampilan Form Utama
Gambar 3.1 Use Case Diagram Sesuai dengan gambar 3.1 diatas maka sistem baru yang dirancang dapat dijelaskan sebagai berikut: 1.
2.
3.
Tampilan form Menu Utama pada aplikasi saringan plaintext terdapat beberapa button, seperti pada gambar 4.2. berikut.
Setelah menjalankan aplikasi, pengguna dapat melakukan browse file, setelah file diinputkan kemudian pengguna dapat melakukan proses. Setelah melakukan proses akan menampilkan output plaintext, untuk output plaintext pengguna dapat menyimpan dan reset field. Selain itu terdapat form about dan form help, untuk pengguna melihat bantuan penggunaan ataupun sekilas mengenai aplikasi. Gambar 4.2 Tampilan Form Utama
3.4
Implementasi
Pada tahap ini adalah tahapan dimana kita dapat membuktikan terhadap sistem yang dirancang sudah sesuai dengan perancangan. Tahap implementasi sistem ini dapat membutuhkan beberapa faktor untuk mendukung kinerja sistem antara lain: 1. Perangkat Keras ( Hardware ) Beberapa perangkat keras yang dibutuhkan dalam perancangan adalah perangkat komputer sekelas dengan Pentium 4, Monitor, Keyboard dan Mouse 2. Perangkat Lunak ( Software ) Perangkat lunak yang digunakan dalam perancangan adalah system operasi Windows 7 (seven), Microsoft Visual Studio 2010. 3. Perangkat Manusia ( Brainware ) Kebutuhan perangkat manusia sering diistilahkan dengan manusia, yang berfungsi untuk menjalankan aplikasi, dengan pengetahuan penggunaan aplikasi berbasis komputerisasi 4.1.1 Tampilan Form Plash
Pada form menu utama (main) terdapat beberapa button yang memiliki fungsi yang berbeda, yakni : a. Browse, berfungsi untuk mencari file yang berextension html atau htm. b. Process, berfungsi menjalankan aplikasi yang telah memiliki file yang untuk disaring plaintext. c. Save, berfungsi untuk menyimpan hasil output yang telah disaring. d. Reset, berfungsi untuk mengembalikan ataupun membersihkan hasil dari file yang telah disaring. e. About, berfungsi memberikan penjelasan tentang tujuan dari perancangan aplikasi. f. Help, berfungsi untuk memberikan penjelasan tentang menggunakan aplikasi tersebut. g.
Close, berfungsi untuk menutup jalannya aplikasierikut halaman menu utama pada halaman Pengunjung, disini Pengunjung dapat melihat berita.
4.1.3
Tampilan Form Browse
Pada Tampilan form ini menampilkan penyimpanan html dari proses penyaringan plaintext, seperti pada gambar 4.2. berikut.
Tampilan form splash merupakan tampilan pertama muncul saat memulai aplikasi, dapat dilihat seperti gambar 4.1. berikut.
Biltek Vol. 4, No. 031 Tahun 2015 – Sekolah Tinggi Teknik Harapan
3
Gambar 4.4 Tampilan Form Browse 4.1.4
Tampilan Form Process
Pada Tampilan form ini menampilkan hasil dari proses penyaringan plaintext, seperti pada gambar 4.3. berikut.
Gambar 4.9 Tampilan Form About 4.1.7
Tampilan Form Help
Tampilan form Help ini terdapat panduan terhadap penjelasan tentang panduan untuk menjalankan aplikasi, seperti pada gambar 4.5 berikut.
Gambar 4.6 Tampilan Form Process Gambar 4.10 Tampilan Form Help 4.1.5
Tampilan Form Save
Pada tampilan form ini menjelaskan bahwa cara untuk menyimpan file dari hasil html dalam saringan plainteks untuk html, kemudian file akan berubah menjadi notepad, seperti pada gambar 4.4 berikut.
1. Kesimpulan Adapun kesimpulan dari perancangan aplikasi yang telah penulis rangkum sebagai berikut: 1.
2.
3.
Dengan adanya aplikasi ini, maka bagi pihak yang membutuhkan dapat lebih muda melakukan proses penyaringan plaintext. Dalam perancangan aplikasi ini dapat membaca file berektensi html dan htm tanpa harus terkoneksi jaringan internet. Perancangan aplikasi yang telah diselesaikan menggunakan bahasa pemograman VB.Net 2010.
Daftar Pustaka:
Gambar 4.8 Tampilan Form Save 4.1.6
Tampilan Form About
Pada tampilan form ini terdapat penjelasan tujuan dalam pembuatan program saringan plainteks untuk html, seperti pada gambar 4.5. berikut.
Hasanah, Uswatun. 2013. Perancangan Sistem Informasi Penjualan On Line Pada Toko Kreatif Suncom Pacitan. Indonesian Jurnal On Networking and Security. Medan : 12 Mei 2014. Hermawan, Julius. 2004. Analisis – Desain dan Pemrograman Berorientasi Objek Dengan UML dan Visual Basic.NET. Yogyakarta : Penerbit Andi. Kurniawan, Erick. 2011. Cepat Mahir Visual Basic 2010. Yogyakarta : Penerbit Andi.
Biltek Vol. 4, No. 031 Tahun 2015 – Sekolah Tinggi Teknik Harapan
4
Lipursari, Anastasia. 2013. Peran Sistem Informasi Manajemen (SIM) Dalam Pengambilan Keputusan. Jurnal STIE Semarang : 3 April 2014 Munawar. 2005. Pemodelan Visual dengan UML. Yogyakarta : Penerbit Graha Ilmu. Puspitasari, Ratih. 2010. Analisa dan Perancangan Aplikasi Bantu Perbaikan Signal to Noise Ratio (SNR) Dengan Metode Flat-Top Sampling. Medan : diakses 12 Mei 2014. Sari, Agustina Mela. 2013. Perancangan Sistem Informasi Penjualan Pupuk Pada Toko Sri Rejeki. 5 Maret 2014. Zakiyudin, Ais. 2012. Sistem Informasi Manajemen Edisi 2. Jakarta : Penerbit Mitra Wacana Media.
Biltek Vol. 4, No. 031 Tahun 2015 – Sekolah Tinggi Teknik Harapan
5