Contoh Kajian Teori Pembuatan Website SMK N 1 Singkil Utara

BAB II

KAJIAN TEORI

2.1     Sistem Informasi

Sistem adalah kumpulan elemen-elemen yang saling berkaitan dan bertanggung jawab memproses masukan(input) sehingga mengahasilkan keluaran(output). Suatu sistem adalah suatu jaringan kerja dari prosedur-prosedur yang salaing berhubungan, berkumpul bersama-sama untuk melakukan suatu kegiatan atau untuk menyelesaikan suatu sasaran yang tertentu. (Sucipto, S.Kom, 2010: 1-2).

Informasi berarti data yang telah dibentuk dalalm suatu format yang mempunyai arti dan berguna bagi manusia. Sebaliknya data merupakan sekumpulan baris fakta yang mewakili peristiwa yang terjadi pada organisasi atau lingkungan fisik sebelum diolah dalam suatu format yang dapat dipahami dan digunakan orang. Sistem informasi juga bermanfaat untuk lingkungan eksternal. ((Sucipto, S.Kom, 2010: 222-223).

2.2         Website

 

Website merupakan kumpulan halaman web yang saling terhubung dan file-filenya saling terkait. Web terdiri dari page atau halaman, dan kumpulan halaman yang dinamanakan homepage. Homepage berada dibawahnya. Biasanya setiap halaman di bawah homepage disebut child page, yang berisi hyperlink ke halaman lain dalam web. (Gregorius, 2000).

Website awalnya merupakan suatu layanan sajian informasi yang menggunakan konsep hyperlink, yang memudahkan surfer atau pengguna internet melakukan penelusuran informasi di internet. Informasi yang disajikan dengan web menggunakan konsep multimedia, informasi dapat disajikan dengan menggunakan banyak media, seperti teks, gambar, animasi, suara atau film.

Sebelum membuat website sekolah, tugas penting sebagai seorang pengembang web adalah ide dan gagasan tentang point apa saja yang akan ditampilkan dalam sebuah halaman website tersebut. Dengan demikian, seorang pengembang web juga perlu berkonsultasi dengan pihak sekolah agar segala sesuatu yang menjadi tujuan website sekolah dapat terpenuhi. Pihak sekolah umumnya mempercayakan sepenuhnya kepada pengembang website. Jika demikian maka sebagai seorang pengembang website harus benar-benar membuktikan keterampilannya dalam membuat website secara profesional agar pihak sekolah tidak kecewa dengan karya yang telah dibuat.

Untuk menjadi seorang pengembang website sekolah yang profesional tidaklah mudah karena harus memadukan antara bahasa pemograman dengan nilai seni yang terdapat dalam setiap halaman website. Keduanya harus dimiliki, jika salah satu saja maka belum bisa disebut sebagai seorang pengembang website sekolah profesional. Meskipun pintar bahasa PHP dalam membuat website, tapi jika tidak didukung oleh jiwa seni maka hasilnya kurang maksimal. Begitu pula sebaliknya, jika hanya pandai membuat tampilan halaman website tapi tidak didukung oleh pengetahuan tentang bahasa pemograman web maka hal itu akan sia-sia saja.

Sebagai seorang pengembang website pemula, tidak perlu berkecil hati jika ingin menjadi seorang pengembang website profesional. Yang terpenting adalah adanya kemauan untuk terus belajar dan belajar lagi agar wawasan tentang pengembangan website terus bertambah. Ada beberapa hal yang perlu diketahui oleh para pengembang website pemula ketika pertama kali ingin membangun sebuah website dari awal. Agar Website yang dibuat tampak profesional perlu memahami beberapa konsep dasar dalam mengolah website, mulai dari tool yang digunakan, format gambar yang sesuai, hingga pemilihan warna teks dan latar belakang sebuah halaman website.

Website juga harus menarik kepada setiap pengunjungnya. Website yang sering dikunjungi orang merupakan nilai tambah bagi seorang pengembang website. Banyaknya pengunjung yang datang dapat dijadikan tolak ukur keberhasilan seseorang dalam merancang dan mengembangkan sebuah website profesional. Ada beberapa unsure yang mempengaruhi keberhasilan tersebut, diantaranya mudah digunakan, tampilan menarik, perpaduan warna sangat tepat , navigasi mudah dipahami dan digunakan, isi artikel sangat berguna, dan masih banyak lagi unsur lain. Semua itu bergantung pada respon pengunjung / pengguna terhadap website sekolah yang kita buat. Saat ini website sudah menjadi salah satu bagian dari identitas sebuah institusi, sama pentingnya dengan alamat perusahaan. Website dapat dijadikan “guide” bagi pelanggan untuk mengetahui lebih jauh tentang profil sebuah institusi secara online.

Ada beberapa kelebihan dan manfaat website sehingga banyak orang membutuhkan kehadirannya,diantaranya :

  • Memiliki alamat secara online
  • Jangakauan tanpa batas sehingga dapat diakses oleh pengguna di seluruh dunia daam waktu yang tak terbatas.
  • Dapat berfungsi sebagai identitas pribadi /. Perusahaan tentang profil diri agar dapat diketahui oleh para customer dalam menjalankan bisnis sehingga komunikasi dapat berjalan dengan mulus.
  • Situs personal dapat berfungsi sebagai juru bicara untuk menuangkan ide, gagasan, kritik, saran, berbagi ilmu, dan suara hati lainnya yang ingin dituangkan kedalam situs melalui tulisan. Pada akhirnya menjadi “image branding” terhadap orang yang bersangkutan. Hal ini sudah dilakukan oleh banyak orang yang, dan ini terbukti banyaknya orang “selebritis IT” hanya karena tulilsan yang yang ada di situs pribadinya.
  • Menjadi cermin pribadi maupun citra perusahaan apabila fitur yang disediakan cukup interaktif dan dinamis.

Website yang dibuat oleh seorang pengembang website harus benar-benar mencerminkan identitas suatu institusi, jangan sampai bertolak belakang antara isi dengan bentuk dan tata letak situs itu sendiri. Ada beberapa hal yang harus diperhatikan, salah satunya adalah tentang kategori situs itu sendiri.

 

  1. PHP

 

PHP adalah kependekan dari PHP Hypertext Preprocessor, bahasa interpreter yang mempunyai kemiripan dengan bahasa C dan Perl yang mempunyai kesederhanaan dalam perintah, yang digunakan untuk pembuatan aplikasi web.

PHP/FI merupakan nama awal dari PHP (Personal Home Page/Form Interface). Dibuat pertama kali oleh Rasmus Lerdoff. PHP awalnya merupakan program CGI yang dikhususkan untuk menerima input melalui form yang ditampilkan dalam browser web. Dengan menggunakan PHP maka maintenance suatu situs web menjadi lebih mudah. Proses update dapat dilakukan dengan menggunakan aplikasi yang dibuat dengan menggunakan script PHP.

PHP merupakan script untuk pemrograman script web server-side, script yang membuat dokumen HTML secara on the fly, dokumen HTML yang dihasilkan dari suatu aplikasi bukan dokumen HTML yang dibuat dengan menggunakan editor teks atau editor HTML.

  1. Sintaks Dasar PHP

 

Script PHP disisipkan langsung dalam tubuh file HTML yang ditandai dengan tag pembuka dan penutup. Sebagaimana diketahui, HTML (HyperText Markup
Language) adalah bahasa standar untuk membuat halaman-halaman web. Ada dua pasang tag PHP yang dapat digunakan yaitu <?php…> dan <script language=”php”>…</script>. Kode-kode
PHP ditulis diantara tag pembuka dan penutup
seperti dalam contoh-contoh berikut:

HTML

<?php

Kode PHP di sini;?>

HTML

Dan

HTML

<script language=”php”>

kode PHP di sini;

</script>

HTML

  1. Script PHP

 

Script PHP diawali dengan tag (<?) dan diakhiri dengan tag (?>). Setiap baris perintah / statement harus diakhiri dengan menggunakan tanda titik koma (;). Umumnya setiap statement dituliskan dalam satu baris. Script PHPmerupakan script yang digunakan untuk menghasilkan halaman-halaman web. Cara penulisannnya dibedakan menjadi embedded dan non embedded script. (PHP dan MySQL, Didik Dwi Prastyo, 2003, h : 4-5)

  1. Konsep Kerja PHP

     

Konsep kerja PHP diawali dengan permintaan suatu halaman web oleh browser. Berdasarkan URL (Uniform Resource
Locator) atau dikenal dengan sebuah alamat internet, browser mendapatkan alamat dari web server, browser kemudian mengidentifikasi halaman yang dikehendaki dan menyampaikan segala informasi yang dibutuhkan oleh web server. Selanjutnya web
server akan mencarikan berkas yang diminta dan mengirimkan isinya ke mesin PHP dan mesin inilah yang memproses dan memberikan hasilnya (berupa kode HTML) ke web server. Kemudian web server menyampaikan ke klien.

 

  1. MySQL

     

            MySQL merupakan sebuah basis data yang mengandung satu atau beberapa kolom. Tabel terdiri atas sejumlah basis dan setiap baris mengandung satu atau beberapa kolom. Didalam PHP telah menyediakan fungsi untuk koneksi ke basis data dengan sejumlah fungsi untuk pengaturan baik menghubungkan maupun memutuskan koneksi server database MySQL sebagai sarana untuk mengumpulkan informasi.(Yeni Kustiyahningsih, Devie Rosa Anamisa, 2010: 145-146).

            Database adalah sistem penyimpanan beragam jenis data dalam sebuah entitas yang besar untuk diolah sedemikian rupa agar mudah dipergunakan lagi. Data yang disimpan bisa sangat variatif (angka, teks, gambar, suara, dan jenis data multi-media lainnya). Basis data merupakan kumpulan dari data yang saling berhubungan satu dengan yang lainnya, tersimpan di perangkat keras computer dan digunakan perangkat lunak untuk memanipulasinya. Database merupakan salah satu komponen yang penting dalam sistem informasi,karena merupakan basis dalam menyediakan informasi bagi para pemakai. (Sucipto, 2012: 137).

    MySQL adalah sistem manajemen basis data relasi yang bersifat terbuka atau open source. Sistem manajemen basisdata ini adalah hasil pemikiran dari Michael “Monty” Widenius, David Axmark, dan Allan Larson pada tahun 1995. Tujuan awal ditulisnya program MySQL adalah untuk mengembangkan aplikasi web. MySQL menggunakan bahasa standar SQL (Structure Query Language) sebagai bahasa interaktif dalam mengelola data. Perintah SQL sering juga disebut Query. MySQL menawarkan berbagai keunggulan dibandingkan database server lain. Berikut ini adalah beberapa keunggulan MySQL :

  • Mampu menangani jutaan user dalam waktu yang bersamaan.
  • Mampu menampung lebih dari 50.000.000 record.
  • Sangat cepat mengeksekusi perintah.
  • Memiliki user privilege system yang mudah dan efisien.

  1. Dreamweaver

     

        Dreamweaver adalah suatu bentuk program editor web yang dibuat oleh macromedia. Dengan program ini seorang programmer web dapat dengan mudah membuat dan mendesain webnya.Dreamweaver adalah editor yang komplit yang dapat digunakan untuk membuat animasi sederhana yang berbentuk layer. Dengan adanya program ini akan memudahkan mengetik script-script format HTML, PHP, ASP maupun bentuk program yang lainnya.

            Dreamweaver ini banyak digunakan oleh para pengembang web karena fitur-fiturnya yang menarik dan kemudahan untuk menggunakannya. Versi terakhir Adobe Dreamweaver adalah Adobe Dreamweaver CS5. Macromedia Dreamweaver berubah menjadi Adobe Dreamweaver karena Macromedia di akuisisi oleh Adobe System sehingga seluruh produk yang dibuat oleh Macromedia kini diawali dengan kata Adobe.

    Aplikasi Dreamweaver CS5 secara default menyediakan beberapa shortcut untuk menjalankan perintah yang ada. Namun jumlah shortcut ini masih terbatas. Aplikasi Dreamweaver CS5 terhubung dengan browser Firefox dan browser Internet Explorer agar bisa menampilkan preview desain melalui salah satu browser tersebut. (Jubilee Enterprise, 2010: 2-4)

    Berikut beberapa kelebihan dan kekurangan Adobe Dreamweaver

        Kelebihan :

    1. Kemampuannya membuat halaman web yang terlihat konsisten.

        Adobe Dreamweaver sudah terinstall beberapa template yang elegan dan menarik. Tentunya ini memudahkan anda yang ingin belajar membuat sebuah web namun anda belum mampu membuat design web sendiri. Jika anda ingin membuat lebih dari 10 halaman web dengan didasarkan design template tertentu maka web anda akan memiliki gaya halaman web yang sama dan terlihat konsisten dari halaman perhalaman.

    2. Kemudahan dan efisiensi dalam penggunaan

        Program ini tidak hanya dirancang untuk anda yang sudah mahir dan mengerti bahasa pemrograma. Bagi anda yang belum mengerti bahasa pemrograman, anda bisa membuat halaman web dengan hanya cara mengklik atau drag and drop menggunakan mouse serta anda juga bisa melihat halaman html-nya selama proses desain berlangsung. Atau yang lebih dikenal dengan sebutan WYSIWYG (What You See Is What You Get)

        Selain itu dreamweaver memiliki kemampuan memperlihatkan 3 proses yang berbeda, yaitu :

  • Code View : Berfungsi untuk hanya menampilkan script html saja.
  • Desain View : Berfungsi menampilkan kode-kode html yang anda tulis menjadi sebuah design/template yang nantinya akan ditampilkan di browser.
  • Split View : Berfungsi menampilkan gabungan antara Code View dan Desain View pada saat bersamaan.Jadi anda bisa langsung melihat perubahan pada saat anda mengubah htmlnya.

3. Mudah untuk mengupload melalui FTP

    Dreamweaver sudah dilengkapi dengan fitur FTP jadi setelah anda selesai membangun sebuah web, anda bisa langsung menguploadnya melalui FTP . FTP (singkatan dari File Transfer Protocol) adalah sebuah protokol Internet yang berjalan di dalam lapisan aplikasi yang merupakan standar untuk pentransferan berkas (file) komputer antar mesin-mesin dalam sebuah internetwork.

4. Dapat dikustom

    Dreamweaver dapat disesuaikan dengan kebutuhan yang anda perlukan. Menu, tab, perintah, font dan warna semua kode dapat disesuaikan dengan preferensi pribadi. Hal ini dapat secara efektif memudahkan proses desain web. Selain itu dreamweaver didukung banyak plug-in yang membantu anda dalam proses desain.

    Kekurangan :

    Harga Software yang Cukup Mahal. Mungkin salah satu kekurangan dari Dreamweaver ini adalah dari segi harga. Dreamweaver CS5 dibandrol oleh Adobe sekitar $399. Harga yang mungkin terjangkau oleh kalangan tertentu saja.

  1. Adobe Photoshop

     

            Photoshop adalah software yang digunakan untuk memodifikasi gambar atau foto secara profesional baik meliputi modifikasi obyek yang sederhana maupun yang sulit sekalipun. Photoshop merupakan salah satu software yang berguna untuk mengolah gambar berbasis bitmap, yang mempunyai tool dan efek yang lengkap sehingga dapat menghasilkan gambar atau foto yang berkwalitas tinggi (jika ingin lebih jauh mengetahui tentang gambar berbasis bitmap silakan download dokumennya di sini).

            Kelengkapan fitur yang ada di dalam Photoshop inilah yang akhirnya membuat software ini banyak digunakan oleh desainer grafis profesional. Dan mungkin juga sampai saat ini masih belum ada software desain grafis lain yang bisa menyamai kelengkapan fitur dalam Photoshop.

    Lembar Kerja Photoshop CS2

        Jika anda pendatang baru yang ingin belajar dan menekuni bidang grafis dan akan menggunakan Photoshop, maka sebaiknya anda lebih familiar dengan lembar kerja yang disuguhkan Adobe photoshop cs2.

        Lembar kerja Photoshop dilengkapi dengan beberapa komponen sebagai berikut :

    1. Title Bar

  • Restore : digunakan untuk mengembalikan ukuran jendela aplikasi ke bentuk semula (sebelum dirubah ukurannya).
  • Move : digunakan untuk memindah jendela aplikasi.
  • Size : digunakan untuk merubah ukuran jendela aplikasi.
  • Minimize : digunakan untuk merubah ukuran jendela aplikasi menjadi ukuran terkecil yang diletakkan dibaris taskbar.
  • Maximize : digunakan untuk merubah ukuran jendela aplikasi menjadi satu layar penuh.
  • Close : digunakan untuk menutup jendela aplikasi yang sedang aktif.

2. Menu Bar

    Yaitu sederetan menu yang dipersiapkan untuk membantu dalam proses pembuatan/ pada saat melakukan editing pada gambar. Dari masing-masing menu pada menu bar diberikan nama yang berlainan untuk membedakan fungsi dan kegunaan secara spesifik pada menu tersebut.

3. Options Bar

    Options bar adlah pilihan tombol yang ditampilkan untuk melengkapi pilihan pada toolbox, jika pada computer yang anda gunakan belum diaktifkan, lakukan langkah berikut untuk mengaktifkan Option Bar : Klik menu Window => Option atau dengan tombol Alt+W,n maka pada bagian bawah menu bar akan tampil sebuah tombol options.

4. Toolbox

    Saat pertama anda menjalankan Photoshop, toolbox akan diletakkan dibagian sebelah kiri layar. Toolbox adalah tombol yang digunakan untuk membuat dan melakukan editing gambar. Untuk memilih toolbox dengan cara melakukan klik pada tombol yang anda kehendaki, bagian yang dilengkapi dengan anak panah dibagian kanan bawah pada tombol, tanda tersebut menunjukkan tombol tersebut masih menyimpan tombol lain yang tersembunyi.

    Masing-masing tombol dalam toolbox mempunyai nama, untuk menampilkan nama toolbox yaitu dengan cara menempatkan pointer mouse di atas tombol tersebut, maka akan tampil tool tip yang menampilkan nama tombol dan perintah shortcut yang berguna untuk menggunakan tombol tersebut secara cepat.

4. Palettes

    Palettes membantu anda untuk melakukan monitoring dan memperbaiki gambar. Dalam keadaan default palette akan ditempatkan secara bersamaan dalam satu groups.

  1. Macromedia Flash

     

        Adobe Flas merupakan program yang digunakan untuk membuat seuah objek bergerak atau animasi. Program ini dapat dimanfaatkan untuk beberapa keperluan seperti pembuatan prensentasi, animasi kartun, dan tampilan interaktif, serta digunakan sebagai program pendukung pembuatan desain web. (Andi, 2010:01).

        Dengan menggunakan Macromedia Flash, saat membuat animasi, seperti perpindahan (move), perubahan ukuran (scale), perubahan bentuk (transform), perputaran (rotate), kita cukup membuat frame awal dan akhirnya saja tanpa harus membuat frame diantara atau ditengahnya, karena perangkat lunak ini secara otomatis akan meng-generate-nya. Kelebihan lainnya adalah gambar ataupun animasi yang dihasilkan dari perangkat lunak ini adalah berupa vektor, sehingga gambar yang dihasilkan sangat halus bahkan saat diperbesar (zoom) sekalipun.

        Sebelum tahun 2005, Flash dirilis oleh macromedia Flash 1.0 diluncurkan pada tahun 1996 setelah Macromedia membeli program animasi vektor bernama FutureSplash. Versi terakhir yang diluncurkan di pasaran dengan menggunakan nama ‘Macromedia’ adalah adalah Macromedia Flash 8. dan pada tanggal 3 Desember 2005 Adobe Systems mengakuisisi Macromedia dan seluruh produknya, sehingga nama Macromedia Flash berubah menjadi Adobe Flash.

    2.8     XAMPP

        Perangkat lunak bebas, yang mendukung banyak system operasi, merupakan kompilasi dari beberapa program. Fungsinya adalah sebagai server yang berdiri sendiri (localhost), yang terdiri atas program Apache, HTTP server, MySQL database, dan penerjemah bahasa yang ditulis dengan bahasa pemograman PHP dan Perl. Nama XAMPP merupakan singkatan dari X (empat sisitem operasi apapun), A (Apache), M (MySQL), P (PHP), P (Perl). Program ini tersedia dalam GNU General Public License dan bebas, merupakan web server yang mudah digunakan yang dapat melayani tampilan halaman web yang dinamis. Untuk mendapatkannya dapat mendownload langsung dari web resminya.


     

Leave a comment