Rabu, 25 Maret 2015

PHP MySQL Database - Tutorial Membuat Website Toko Buku Sederhana

Hari ini capung akan belajar pemrograman PHP dengan menggunakan database MYSQL. Sebelumnya saya sudah pernah menjelaskan dan belajar tentang kode-kode PHP, sekarang kita menggunakan database untuk menyimpan data-data yang ingin disimpan. Berikut sedikit penjelasan tentang PHP dan MYSQL.


Dengan PHP, Kamu dapat terhubung dan memanipulasi database.

MySQL adalah sistem database yang paling populer digunakan dengan PHP.

Apa itu MySQL?
  • MySQL adalah sistem database yang digunakan di web
  • MySQL adalah sistem database yang berjalan pada server
  • MySQL sangat ideal untuk aplikasi kecil dan besar
  • MySQL sangat cepat, handal, dan mudah digunakan
  • MySQL menggunakan SQL standar
  • MySQL mengkompilasi pada sejumlah platform
  • MySQL bebas untuk men-download dan digunakan
  • MySQL dikembangkan, didistribusikan, dan didukung oleh Oracle Corporation
  • MySQL dinamai putri pendiri ini Monty Widenius: My

Download MySQL Database


Jika Anda tidak memiliki sebuah server PHP dengan database MySQL, Anda dapat men-download secara gratis di sini: http://www.mysql.com

Fakta Tentang MySQL database


MySQL adalah sistem database standar de-facto untuk situs web dengan volume besar dari kedua data dan pengguna akhir seperti Facebook, Twitter, dan Wikipedia.

Satu hal besar mengenai MySQL adalah bahwa hal itu dapat diperkecil untuk mendukung aplikasi database tertanam.

Lihatlah http://www.mysql.com/customers/ untuk gambaran perusahaan menggunakan MySQL.


PHP dengan Dreamweaver 8

Untuk membuat website dengan PHP kita memerlukan Software Macromedia Dreamweaver, dalam pembuatan program ini saya menggunakan Dreamweaver 8, berikut link download berikut:
Download Number Key

PHP Connect to MySQL


Untuk menjalankan database MySQl kamu perlu menginstal XAMPP, Pelajari cara menginstal XAMPP klik disini. Kemudin klik Start di Apache dan MySQL.



Tutorial Membuat Website Toko Buku

Aplikasi sederhana ini terdiri dari 3 alur sederhana, yaitu daftar buku, form order dan proses order. Pada alur pertama menampilkan halaman berisikan sejumlah daftar buku yang diambil dari tabel buku yang tersimpan di database. Pada form order, menampilkan form yang berisikan informasi belanja buku dari pengunjung. Dan proses order merupakan alur terakhir yang di dalamnya memproses informasi dari form order yang dimasukkan oleh pengunjung.




Buat Tabel di Database MySQL

Nama database: bookstore

Tabel books: berisikan daftar buku

FieldTipeDeskripsiKeterangan
book_idintID BukuPrimary Key & AUTO_INCREMENT
book_namevarchar(10)Nama Buku-
book_pricedecimal(10,2)Harga Buku-

Tabel orders: berisikan order / pembelian yang dilakukan oleh pengunjung

FieldTipeDeskripsiKeterangan
order_idintID OrderPrimary Key & AUTO_INCREMENT
order_namevarchar(10)Nama Pembeli-
order_addresstextAlamat Pembeli-
book_idintID BukuForeign Key dari tabel books
order_amountdecimal(10,2)Jumlah Pembelian-

Pastikan phpMyAdmin telah terinstal, dan buka di peramban web dengan alamat http://localhost/phpmyadmin. Lalu pada halaman "Home" phpMyAdmin klik tab "Databases", dan masukkan "bookstore" (tanpa tanda kutip) pada bagian "Create new database".
Database dengan nama "bookstore" akan disimpan di MySQL. Pilih database "bookstore" yang telah dibuat sebelumnya, lalu pada bagian "Create table on database bookstore", masukkan nama tabel yang ingin dibuat, tabel pertama yang dibuat adalah "books" dan masukkan banyaknya kolom / field pada tabel tersebut.

Setelah mendefinisikan nama tabel beserta banyaknya field, langkah selanjutnya adalah mengatur struktur tabel. Di bagian ini, kita menentukan tipe data pada setiap field, menentukan "Storage engine", dan pengaturan lainnya. Untuk tipe field, silahkan lihat pada tabel struktur database di atas. Lakukan langkah yang sama pada pembuatan tabel "orders".

Isikan beberapa data contoh pada tabel "books". Caranya dengan memilih tabel "books", lalu klik tab "Insert". Masukkan beberapa data di dalamnya.

Mengelola File-file yang Dibutuhkan

File-file aplikasi terdiri dari file PHP, CSS dan gambar yang dibutuhkan untuk tampilan. Berikut struktur file aplikasi:
Folder imagesberisikan gambar-gambar yang dibutuhkan untuk tampilan
list.phpfile PHP yang berisikan script untuk menampilkan daftar buku
order.phpfile PHP yang berisikan script untuk menampilkan Form Order
order_process.phpfile PHP yang berisikan script yang memproses data-data dari Form Order
style.cssfile CSS yang digunakan untuk merapihkan tampilan

Buat file-file serta folder yang dibutuhkan di lokasi dokumen web server agar dapat dieksekusi oleh web server. Untuk file-file gambar, silahkan unduh di sini

Alur 1 - Membuat Daftar Buku

Semua skrip yang digunakan untuk menampilkan data buku disimpan pada file list.php. Dua langkah dalam menampilkan daftar buku, pertama mengambil data yang tersimpan di dalam database, selanjutnya menampilkan dalam bentuk HTML.
Berikut pengkodean untuk mengambil data daftar buku yang tersimpan dalam database:
mysql_connect('localhost', 'root', '');
mysql_select_db('bookstore');
$result = mysql_query("SELECT * FROM books");
Pada baris pertama, fungsi mysql_connect() melakukan koneksi ke MySQL dan dilanjutkan dengan baris berikutnya memilih database 'bookstore' dengan menggunakan fungsi mysql_select_db(). Ketika koneksi ke MySQL dan memilih database berhasil, dengan menggunakan perintah "SELECT" untuk mengambil data dari tabel "books" dan hasil dari query yang dilakukan fungsi mysql_query() dimasukkan ke dalam variabel $result.
Selanjutnya, data yang diambil dari kode di atas kemudian ditampilkan dalam bentuk HTML. Berikut kode untuk menampilkan data daftar buku:
echo "<h1>Books List</h1>";
echo "<ul>";
while($data = mysql_fetch_array($result)) {
    echo "<li>$data[book_name] : Rp. $data[book_price]</li>";
}
echo "</ul>";
Fungsi echo digunakan untuk menampilkan keluaran dalam bentuk HTML. Struktur kendali perulangan while digunakan untuk melakukan perulangan dari data-data yang berhasil diperoleh dari query sebelumnya. Fungsi mysql_fetch_array() digunakan untuk mengambil data dari variabel $result yang dikembalikan dalam bentuk array.
Secara utuh, skrip file list.php adalah sebagai berikut:
list.php
<html>
<head>
    <title>Book Store</title>
    <link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<?php
// koneksi ke database
mysql_connect('localhost', 'root', '');
// pilih database
mysql_select_db('bookstore');
// melakukan query 
$result = mysql_query("SELECT * FROM books");
 
// menampilkan ke browser
echo "<h1>Books List</h1>";
echo "<ul>";
// mengambil data
while($data = mysql_fetch_array($result)) {
    echo "<li>$data[book_name] : Rp. $data[book_price]</li>";
}
echo "</ul>";
?>
<a href="order.php">[order]</a>
</body>
<html>

Alur 2 - Membuat Form Order

Pada bagian ini sebenarnya hanya menampilkan bentuk form order yang terdiri dari sintak HTML. Hanya saja, option di dalam tag select membutuhkan data-data dari tabel books, dan memerlukan perintah PHP untuk melakukan pengambilan tersebut. Form order disimpan dengan nama file order.php
Berikut kode form order:
<form method="post" action="order_process.php">
    <p>
        Nama: <br /> 
        <input type="text" name="nama">
    </p>
    <p>
        Alamat: <br />
        <textarea name="alamat"></textarea>
    </p>
    <p>
        Buku: <br />
        <select name="buku">
            <?php 
            // mengambil data dari tabel books
            ?>
        </select>
    </p>
    <p>
        Jumlah: <br />
        <input type="text" name="jumlah" size="5">
    </p>    
    <p>
        <input type="submit" value="Beli" class="button">
    </p>    
</form>
Pada bagian pemilihan buku, sintak pengambilan datanya ditambahkan menjadi sebagai berikut:
<p>
    Buku: <br />
    <select name="buku">
    <?php
    mysql_connect('localhost', 'root', '');
    mysql_select_db('bookstore');
    $result = mysql_query("SELECT * FROM books");
    while($data = mysql_fetch_array($result)) {
        echo "<option value='$data[book_id]'>$data[book_name] : Rp. $data[book_price]</option>";
    }
    ?>
    </select>
</p>
Secara lengkap kode form order sebagai berikut:
order.php
<html>
<head>
    <title>Book Store</title>
    <link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<h1>Order</h1>
<form method="post" action="order_process.php">
    <p>
        Nama: <br /> 
        <input type="text" name="nama">
    </p>
    <p>
        Alamat: <br />
        <textarea name="alamat"></textarea>
    </p>
    <p>
        Buku: <br />
        <select name="buku">
        <?php
        // koneksi ke database
        mysql_connect('localhost', 'root', '');
        // pilih database
        mysql_select_db('bookstore');
        // melakukan query 
        $result = mysql_query("SELECT * FROM books");
        while($data = mysql_fetch_array($result)) {
            echo "<option value='$data[book_id]'>$data[book_name] : Rp. $data[book_price]</option>";
        }
        ?>
        </select>
    </p>
    <p>
        Jumlah: <br />
        <input type="text" name="jumlah" size="5">
    </p>    
    <p>
        <input type="submit" value="Beli" class="button">
    </p>    
</form>
</body>
<html>

Alur 3 - Membuat Proses Order

Seperti yang telah didefinisikan melalui attribut "action" yang ada di tag "form" untuk order di atas, file php yang digunakan adalah order_process.php. Begitu pula dengan metode pengiriman yang didefinisikan dari attribut "method" pada tag "form", metode post digunakan sebagai pengirimannya, dan PHP mengambil data dengan menggunakan variabel global $_POST untuk mengambil data tersebut.
Berikut kode pengambilan data dengan $_POST:
$nama = $_POST['nama'];
$alamat = $_POST['alamat'];
$buku = $_POST['buku'];
$jumlah = $_POST['jumlah'];
Setiap order yang dilakukan oleh pengunjung disimpan ke dalam tabel "orders", berikut adalah sintak untuk memasukkan data ke dalam tabel orders:
mysql_connect('localhost', 'root', '');
mysql_select_db('bookstore');
mysql_query("INSERT INTO orders (order_name, order_address, book_id, order_amount) 
             VALUES ('$nama', '$alamat', '$buku', '$jumlah')");
Cara memasukkan data hampir sama dengan pengambilan data pada kode-kode sebelumnya, yaitu melakukan koneksi ke MySQL dan memilih database, hanya saja perintah SQL yang digunakan adalah "INSERT" pada fungsi mysql_query().
Langkah terakhir adalah menampilkan konfirmasi order dengan menggunakan fungsi echo. Tetapi, sebelum menampilkan konfirmasi order, perlu diperhatikan bahwa variabel $buku yang dikirim berisikan ID Buku, maka untuk memperoleh informasi nama buku dan harganya dibutuhkan pengambilan data dari tabel books sebelum diolah menjadi tampilan konfirmasi order. Berikut sintaknya:
// mengambil data dari tabel books
$result = mysql_query("SELECT * FROM books WHERE book_id = '$buku'");
$data = mysql_fetch_array($result);
$total = $jumlah * $data['book_price'];
// menampilkan konfirmasi order
echo "<h2>Terima kasih !!</h2>";
echo "<p>Anda telah berhasil melakukan pembelian, berikut data pembelian Anda:</p>";
echo "<p>Nama : $nama</p>";
echo "<p>Alamat : $alamat</p>";
echo "<p>Buku : $data[book_name]</p>";
echo "<p>Harga : $jumlah x $data[book_price] = $total</p>";
Kode lengkap memproses order sebagai berikut:
order_process.php
<html>
<head>
    <title>Book Store</title>
    <link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<?php
// mengambil data yang telah di submit
$nama = $_POST['nama'];
$alamat = $_POST['alamat'];
$buku = $_POST['buku'];
$jumlah = $_POST['jumlah'];
 
// koneksi ke database
mysql_connect('localhost', 'root', '');
// pilih database
mysql_select_db('bookstore');
// memasukkan data ke dalam tabel orders
mysql_query("INSERT INTO orders (order_name, order_address, book_id, order_amount) 
             VALUES ('$nama', '$alamat', '$buku', '$jumlah')");
 
// mengambil data dari tabel books
$result = mysql_query("SELECT * FROM books WHERE book_id = '$buku'");
$data = mysql_fetch_array($result);
$total = $jumlah * $data['book_price'];
// menampilkan konfirmasi order
echo "<h2>Terima kasih !!</h2>";
echo "<p>Anda telah berhasil melakukan pembelian, berikut data pembelian Anda:</p>";
echo "<p>Nama : $nama</p>";
echo "<p>Alamat : $alamat</p>";
echo "<p>Buku : $data[book_name]</p>";
echo "<p>Harga : $jumlah x $data[book_price] = $total</p>";
?>
</body>
<html>

Merapihkan Halaman Web

Langkah terakhir adalah merapihkan tampilan web dengan CSS. File yang berisikan kode-kode CSS disimpan dengan nama file style.css. Berikut adalah isi dari kode CSS:
style.css
body {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 9pt;
}
 
h1 {
    font-size: 11pt;
    padding-left: 20px;
    background: url(images/cart.png) no-repeat;
}
 
h2 {
    font-size: 11pt;
    padding-left: 0px;
}
 
ul li {
    padding-bottom: 3px;
    list-style-image: url(images/list.png);
}
 
input { 
    font-size: 9pt; 
    background-color: #F5F5F5; 
    border: 1px solid #666666; 
}
 
textarea { 
    font-size: 9pt; 
    background-color: #F5F5F5; 
    border: 1px solid #666666; 
}
 
input.button
{
    font-family : Helvetica, Arial, sans-serif;
    font-size   : 11px;
    font-weight : bold;
    color       : black;
    background-color    : #dddddd;
    border      : 1px solid black;
}

Setelah selesai semua kode telah dibuat maka kamu bisa menjalankan web toko buku sederhana buatan kamu sendiri.








Sumber: w3schools.com dan saung-foss.web.id

XAMPP Tutorial

Cara Menggunakan XAMPP untuk menjalankan Web Server Sendiri.

XAMPP singkatan dari Cross-Platform (X), Apache (A), MySQL (M), PHP (P) dan Perl (P).

Distribusi Apache ringan yang membuatnya sangat mudah bagi pengembang untuk membuat server web lokal untuk tujuan pengujian. Semua yang Anda butuhkan untuk membuat sebuah web server - server aplikasi (Apache), database (MySQL), dan bahasa scripting (PHP) - termasuk dalam file diekstrak sederhana. XAMPP juga cross-platform, yang berarti bekerja sama dengan baik di Linux, Mac dan Windows. Karena sebagian besar penyebaran web server yang sebenarnya menggunakan komponen yang sama seperti XAMPP, itu membuat transisi dari server tes lokal ke server online sangat mudah. Pengembangan web menggunakan XAMPP terutama pemula sangat mudah menjalankannya.

Apa yang Termasuk dalam XAMPP?

XAMPP memiliki empat komponen utama. Ini adalah:
  1. Apache: Apache adalah server aplikasi web yang sebenarnya yang memproses dan memberikan konten web ke komputer. Apache adalah web server yang paling populer online, powering hampir 54% dari semua situs web.

  2. MySQL: Setiap aplikasi web, bagaimanapun sederhana atau rumit, memerlukan database untuk menyimpan data yang dikumpulkan. MySQL yang open source adalah sistem manajemen database yang paling populer di dunia. Segala sesuatu dari situs hobi ke platform profesional seperti WordPress. 

  3. PHP: PHP adalah singkatan dari Hypertext Preprocessor. Ini adalah server-side scripting bahasa yang digunakan beberapa situs yang paling populer di dunia, termasuk WordPress dan Facebook. Ini adalah open source, relatif mudah untuk belajar, dan bekerja sempurna dengan MySQL menjadikannya pilihan populer bagi para pengembang web.

  4. Perl: Perl adalah tingkat tinggi, bahasa pemrograman dinamis yang digunakan secara luas dalam pemrograman jaringan, sistem admin, dll Meskipun kurang populer untuk tujuan pengembangan web, Perl memiliki banyak aplikasi niche.

Versi berbeda dari XAMPP mungkin memiliki komponen tambahan seperti phpMyAdmin, OpenSSL, dan lain-lain untuk membuat server web penuh.


Bagaimana Cara Menginstal XAMPP?

[Catatan: Untuk tujuan tutorial XAMPP ini, kami akan menganggap bahwa Anda menggunakan PC Windows, meskipun petunjuk ini bekerja sama dengan baik untuk komputer Mac. Pengguna Linux, bagaimanapun, harus mengacu pada panduan instalasi XAMPP Linux resmi.]

Download XAMPP untuk homepage Windows pada ApacheFriends.org. Di sini, Anda akan menemukan beberapa versi XAMPP.


Download XAMPP

Men-download XAMPP
XAMPP tersedia dalam tiga format file:
  1. EXE - File Self-eksekusi; termudah untuk menginstal.

  2. .7z - File 7zip. Disukai oleh puritan, meskipun memerlukan bekerja dengan file bat lebih rumit untuk menginstal.

  3. ZIP - Compressed file zip. Seperti .7z, menginstal melalui file ZIP jauh lebih sulit daripada menggunakan EXE
EXE adalah yang paling mudah untuk menginstal, kita akan menggunakan format file ini untuk tutorial ini.

Anda dapat men-download installer XAMPP dari Sourceforge sini (102MB).


Instalasi XAMPP

Ikuti langkah-langkah untuk menginstal XAMPP:

Langkah 1: Nonaktifkan anti-virus Anda karena dapat menyebabkan beberapa komponen XAMPP tidak mau terinstal.

Langkah 2: Mulai proses instalasi dengan mengklik dua kali pada installer XAMPP. Klik 'Next' setelah splash screen.


Langkah 3: Di sini, Anda dapat memilih komponen yang ingin Anda instal. Pilih pilihan default dan klik 'Next'.


Langkah 4:. Pilih folder yang ingin menginstal XAMPP di folder ini akan menampung semua file aplikasi web Anda, jadi pastikan untuk memilih drive yang memiliki banyak ruang.


Langkah 5: Layar berikutnya adalah promo untuk BitNami, sebuah toko aplikasi untuk perangkat lunak server. Hapus kotak centang 'Learn more about BitNami for XAMPP', kecuali jika Anda benar-benar menerima mail promo!


Langkah 6: Setup sekarang siap untuk menginstal XAMPP. Klik Next dan tunggu installer untuk membongkar dan memasang komponen yang dipilih. Ini mungkin memakan waktu beberapa menit. Anda mungkin diminta untuk menyetujui akses Firewall untuk komponen tertentu (seperti Apache) selama proses instalasi.

Langkah 7: Instalasi sekarang lengkap! Pilih Kotak centang 'Do you want to start the Control Panel now?' untuk membuka panel kontrol XAMPP.


Memahami XAMPP Control Panel

Berikut ini adalah gambaran singkat dari Control Panel. Untuk saat ini, Anda hanya perlu tahu bagaimana untuk memulai dan menghentikan server Apache.


Testing Instalasi XAMPP Anda

Ikuti langkah-langkah untuk menguji instalasi XAMPP Anda dengan menampilkan web server Apache dan membuat file PHP sederhana.

Langkah 1: Di panel kontrol XAMPP, klik 'Start' di bawah 'Actions' untuk modul Apache. Hal ini menginstruksikan XAMPP untuk memulai webserver Apache.

Langkah 2: Buka browser web Anda dan ketik: http://localhost atau 127.0.0.1

Langkah 3: Pilih bahasa Anda dari splash screen.


Langkah 4: Anda akan melihat layar berikut. Ini berarti Anda telah berhasil menginstal XAMPP di komputer Anda.


Langkah 5: Sekarang kita akan menguji apakah XAMPP telah terinstal PHP berhasil. Untuk melakukan hal ini, buka Notepad dan ketik berikut ke dalam dokumen baru:

<?php
   echo ‘Hello world';
?>

Simpan file ini sebagai 'test.php' di c:\ xampp \ htdocs \ (atau direktori dimana kamu menginstal XAMPP).

Langkah 6: ketikkan di browser web kamu 'http://localhost / test.php'. Kamu akan melihat tulisan "Hello World" :

Selamat! Anda sekarang telah berhasil menginstal XAMPP dan bahkan menulis program PHP pertama Anda. Anda sekarang dapat menggunakan webserver Apache lokal Anda untuk membuat dan menguji kompleks aplikasi PHP web, bermain dengan MySQL dan bahkan belajar bagaimana sebenarnya web server bekerja dengan Tomcat, FileZilla, OpenSSL, dan banyak lagi.  

Seperti biasa, saya akan senang mendengar pendapat dari Anda, dan opini tentang pengembangan web menggunakan XAMPP di komentar di bawah!




Sumber: blog.udemy.com

Selasa, 22 April 2014

Perjuangan Mimi 5 - Kerjasama

Mimi dan Yuka bersama di cafe kampus. Mereka berdua berdiskusi untuk mengerjakan program keuangan. Yuka menerangkan sistem keuangan yang akan dibuat program. Sesekali Mimi tidak mengerti istilah-istilah akuntansi yang di sebutkan Yuka. Disitulah yang Yuka malas menerangkannya lagi, jadi setiap kali mimi bertanya tentang istilah akuntansi yang disebutkan Yuka, Yuka geram melihat Mimi dan menyelentikan kupingnya Mimi.

Mimi : "Aduuhhh... Judes banget sih..."
Yuka : "Kemaren uda aku terangi apa itu Neraca, ini malah nanyak lagi HA!"
Mimi : "ya maaf aku kan pelupa"
Yuka : "uda kayak nenek-nenek aja"
Mimi : "aku juga gak tau kenapa aku suka pelupa, aku kadang lupa nama orang"
Yuka : "eh, jangan-jangan kamu juga lupa nama aku...!"
Mimi : "hehehe... tenang, uda aku catat nama kamu di catatan HP-ku, jadi sebelum bertemu dengan kamu aku lihat dulu nama kamu di catatan HP-ku"
Yuka : "is is... parah kamu, jangan-jangan nama sodara kandungmu pun gak ingat..?"
Mimi : "eits, gak separah itu juga, aku dan sodauraku kan sudah dari lahir tinggal bersama, pastinya ingatlah"
Yuka : "hahaha... kirain, ohya, aku perhatikan kamu sering sekali ke kampus berpakaian menggunakan jaket atau sweater, ini kan gak musim hujan, apa gak kepanasan?"
Mimi : "ah itu, gimana neranginnya ya... uda kebiasaan kali ya jadi gak merasa panas"
Yuka : "gak risih gitu?"
Mimi : "aku malah nyaman, aku suka berpakaian yang size-nya lebih besar dari badanku, aku risih klo bajuku ketat-ketat"
Yuka : "Ya... jangan terlalu ketat juga kali, sedang saja, kalau kamu itu terlalu kebesaran tau..."
Mimi : "Yaampun cewek ini suka sekali memperhatikan fashion"
Yuka : "HE... kamu cewek juga kale..."
Yuka mencubit pipinya Mimi saking geramnya.

***

Mimi mulai membuat program keuangan dengan mengetikkan kode-kode program komputer di laptopnya.
Gayanya Mimi kalau sedang mengerjakan pemrograman yaitu kaki kiri seperti menjahit, goyang terus kakinya dan mata fokus pada laptopnya, terkadangan mengerutkan keningnya dan terkadang tersenyum sendiri, aneh deh pokoknya. Yuka yang ada disampingnya pun memperhatikan tingkah Mimi yang aneh, dia lihat dari ujung kaki yang bergoyang, sampai tangan yang mengetik tanpa henti dan kadang mouse laptopnya gak pernah digunakan Mimi, kemudian dilihatnya ekspresi wajah Mimi dan sesekali melihat layar laptop Mimi, Yuka merengutkan keninggnya karena hanya melihat kode-kode pemrograman yang gak dimengertinya. Yuka bingung kenapa Mimi melihat kode-kode program itu ekspresinya bisa berubah dari kerut kening kemudian senyum kembali, begitu terus menerus.

Sudah satu bulan mereka mengerjakan program keuangan itu bersama-sama. Yuka pun sudah terbiasa dengan tingkah aneh Mimi dan Mimi sudah terbiasa dengan sikap Yuka yang kadang pura-pura lembut padahal galak.

Seperti biasa Mimi dan Yuka mengerjakan program akuntansi di Cafe kampus. Mimi mengerjakan program akuntansi yang sudah mau selesai di laptopnya. Dari belakang tempat duduk Mimi ada seseorang yang memperhatikan apa yang dikerjakan Mimi. Yuka melihatnya, kemudian menyenggol tangan Mimi untuk memberi tahu kalau ada orang dibelakang dia. Berbalik Mimi melihat siapa yang ada dibelakangnya. Ternyata seorang cowok yang pandangannya melihat laptop Mimi.

Cowok itu adalah Junga, Junga memegang mouse laptop Mimi, dan melihat-lihat tampilan program akuntansi Mimi. Posisi Mimi jadi terimpit oleh badan Junga yang dibelakang mimi, Mimi mencoba menghindar dari Junga. Junga kemudian tersenyum kecil seperti menganggap remeh saat melihat program akuntansi Mimi.
MImi : "HE... Apaan ini?! sembarangan melihat laptop orang!"
Junga : "Kamu yang buat program ini?"
Mimi : "IYA, Kenapa?!"
Junga : "program ini bisa aku bobol dengan waktu 5 menit"
Mimi terbengong mendengar kata-kata junga.Mimi menggempalkan tanganya dan melihat Junga dengan sinis.
Mimi : "jadi kamu mau bilang, kalau programku ini tidak bagus dan mudah di hack?"
Junga : "ya... bisa dibilang begitu"
Mimi : "HE, ngerjakan program ini susah, memang kamu bisa mengerjakan program seperti ini dengan lebih bagus?!"
Junga tidak menjawab pertanyaan Mimi, Junga malah berjalan pergi meninggalkan Mimi.

Mimi : "Aiss... MENYEBALKAN!!"
Yuka : "sabar Mimi... tapi Junga cool juga ya... sayang aku uda punya calon suami hehehe"
Mimi : "Ai, Yuka kok malah mengagumi cowok seperti itu sih, cool apanya? omong besar tuh orang"
Yuka : "Cowok itu namanya Junga, dia memang hacker yang jago, dia anak Teknik Informasi komputer, kamu  pernah lihat website kampus waktu tiga bulan yang lalu?"
 Mimi : "enggak, kenapa?"
Yuka : "website kampus dibuat halaman depannya gambar sinchan yang sedang bergoyang, dia dipanggil kepala Yayasan kampus karena dituduh kalau itu dia yang mengganti halaman depan website kampus, tapi Yayasan tidak ada bukti untuk tuduhan itu, jadi dia terbebaskan dari hukuman, semua orang sudah bisa menebak kalau itu kerjaan dia, dia itu hacker yang jago tanpa meninggalkan jejak, banyak lagi perbuatan dia yang mengganggu, ada juga tuh semua komputer yang berada di Lab. komputer tiba-tiba muncul gambar hantu yang seram, semua yang sedang belajar praktek komputer pada kaget, cuman dia yang tertawa, masih banyak keisengan yang dibuatnya"
Mimi : "Hmmm... mungkin dia hanya bisa menghancurkan program komputer tapi tidak bisa membangun program komputer, tapi... kalau dia tau kelemahan-kelemahan program kita, pasti dia tau juga bagaimana agar menutupi keleman-kelemahan program komputer agar tidak bisa di Hack"


Mimi mendapat ide yang bagus, tersenyum dia sendiri.
Yuka : "woy woy... membayangkan apa kamu? senyum-senyum sendiri"
Mimi : "hehehe... bagaimana kalau kita ajak dia bergabung untuk menyelesaikan program ini, jadi program kita itu tahan banting, tidak mudah bocor"
Mimi merangkul Yuka sambil mengerlingkan matanya. Yuka malah melepaskan tangan Mimi.
Yuka : "HA...kamu yakin?! dia itu suka iseng, suka tidur, pelit minta bantuannya harus pakai uang, tapi... Junga orangnya kren juga sih... okelah kalau gitu..."
Mimi : "Ais... cewek ini.."
Mimi menggelengkan kepalanya melihat Yuka.
Mimi : "inget calon suamimu... ohya, kamu mau nikah? kok sudah ada calon suami?"
Yuka : "iya, dua bulan lagi insyallah kami menikah"
Mimi : "wes... selamatlah kalau begitu"
Yuka : "iya makasih, doain ya..."
Mimi : "iya aku doain semoga semua urusan dilancarkan, amin"
Yuka : "amin"

***

Bersambung.....

Selasa, 15 April 2014

Panduan Memulai Pengoptimalan Mesin Telusur (SEO) Google

Dokumen ini pertama kali dimulai sebagai upaya untuk membantu tim dalam Google, tetapi kami pikir panduan ini akan sama bergunanya untuk webmaster yang masih baru terhadap topik pengoptimalan mesin telusur dan ingin meningkatkan interaksi pengguna dan mesin telusur dengan situs mereka. Walaupun panduan ini tidak memberi tahu rahasia apa pun yang akan secara otomatis meningkatkan peringkat situs Anda pada kueri di Google (maaf!), mengikuti praktik yang diuraikan di bawah akan memudahkan mesin telusur dalam merayapi, mengindeks, dan memahami konten Anda.

Optimasi mesin telusur sering kali mengenai modifikasi kecil pada bagian situs web Anda. Bila dilihat secara terpisah, perubahan ini mungkin tampak seperti perbaikan bertahap, tetapi saat digabungkan dengan pengoptimalan lainnya, mungkin ada dampak nyata pada pengalaman pengguna dan kinerja pada hasil penelusuran oganik situs Anda. Anda kemungkinan sudah akrab dengan kebanyakan topik pada panduan ini, karena topik tersebut merupakan bahan penting untuk semua laman web, tetapi Anda mungkin belum menggunakannya secara optimal.

Contoh dapat membantu penjelasan kita, jadi kami telah membuat situs web fiktif yang mengikuti keseluruhan panduan. Untuk setiap topik, kami menyajikan informasi yang cukup mengenai situs untuk mengilustrasikan poin yang dimaksud. Berikut beberapa informasi mengenai latar belakang situs yang akan kita gunakan

    Nama situs web/bisnis: "Uang Kuno Tino"

    Nama Domain: example.com

    Fokus: Penjualan uang kuno hanya secara online, panduan harga, artikel, dan konten berita

    Ukuran: Kecil, ~250 laman

Pengoptimalan mesin telusur hanya memengaruhi hasil penelusuran organik, bukan hasil berbayar atau "yang disponsori" seperti Google AdWords

1. Buat judul laman yang unik, akurat

  •      Tunjukkan judul laman menggunakan tag judul
Tag judul memberi tahu pengguna dan mesin telusur mengenai topik tertentu suatu laman. Tag <title> seharusnya ditempatkan di dalam tag <head> dari dokumen HTML (1). Idealnya, judul yang unik diperlukan untuk setiap laman pada situs Anda

<html>

<head>

<title>Uang Kuno Tino - Jual Beli, Harga, dan Informasi Uang Kuno Indonesia</title>

<meta name="description=" content="Uang Kuno Tino menyediakan uang kuno asli dan replika dengan harga terjangkau. Cocok untuk mahar/mas kawin uang kuno. Dapatkan informasi mengenai">

</head>

<body>

  • Konten judul laman ditampilkan di hasil penelusuran
Jika dokumen Anda muncul di laman hasil penelusuran, konten tag judul biasanya muncul pada baris pertama ( jika Anda tidak familier dengan bagian hasil penelusuran Google yang berbeda, mungkin Anda ingin melihat anatomi video hasil penelusuran oleh insinyur Google Matt Cutts, dan diagram dari laman hasil penelusuran Google yang bermanfaat ini.) Kata di judul ditebalkan jika muncul pada kueri penelusuran pengguna. Penebalan kata ini dapat membantu pengguna mengenali apakah suatu laman relevan dengan penelusuran mereka (2).

(2) Pengguna mengajukan kueri [uang kuno]. Laman beranda kita menampilkan hasil, disertakan dengan judul pada baris pertama (perhatikan bahwa istilah yang ditelusuri oleh pengguna muncul dalam huruf tebal)

Judul laman beranda Anda dapat menguraikan nama situs web/bisnis dan mencakup sebagian kecil informasi penting seperti lokasi fisik bisnis atau mungkin beberapa fokus atau penawaran utama (3).

2. Menggunakan meta tag "description"

Meta tag deskripsi laman memberikan Google dan mesin telusur lainnya ringkasan mengenai suatu laman (1). Meta tag deskripsi laman bisa berupa kalimat maupun dua paragraf atau paragraf pendek, sedangkan judul laman bisa berupa beberapa kata atau frasa. Alat Webmaster Google menyediakan konten berguna bagian analisis konten yang memberitahukan mengenai deskripsi meta tag apa pun yang terlalu pendek, panjang, atau terlalu banyak digandakan (informasi yang serupa juga ditampilkan untuk tag <title>) Seperti tag <title>, deskripsi meta tag diletakkan di antara tag <head> pada dokumen HTML Anda.

<html>

<head>

<title>Uang Kuno Tino - Jual Beli, Harga, dan Informasi Uang Kuno Indonesia</title>

<meta name="description=" content="Uang Kuno Tino menyediakan uang kuno asli dan replika dengan harga terjangkau. Cocok untuk mahar/mas kawin uang kuno. Dapatkan informasi mengenai">

</head>

<body>

Memiliki meta tag deskripsi yang berbeda untuk setiap laman membantu pengguna dan Google, khususnya dalam penelusuran yang dapat memunculkan beberapa laman dari domain Anda (misal: penelusuran menggunakan site: operator). Jika situs Anda memiliki ribuan atau bahkan jutaan laman, membuat sendiri meta tag deskripsi kemungkinan tidak bisa dilakukan. Dalam kasus ini, Anda dapat menghasilkan meta tag deskripsi secara otomatis berdasarkan konten tiap laman.

3. Tingkatkan struktur URL Anda


URL yang mudah dipahami akan menyampaikan informasi konten dengan mudah.

Membuat kategori dan nama file yang deskriptif untuk dokumen situs web tidak hanya membantu situs tetap terorganisir dengan lebih baik, tetapi juga dapat membawa perayapan mesin telusur yang lebih baik pada dokumen Anda. Hal ini juga akan membuat URL yang lebih mudah dan "lebih bersahabat" untuk mereka yang ingin membuat tautan ke konten Anda. Pengunjung mungkin akan kesulitan oleh URL yang sangat panjang dan tersembunyi yang berisi sedikit kata yang dapat dikenali.

Ingatlah bahwa URL pada dokumen ditampilkan sebagai bagian dari hasil penelusuran dalam Google, di bawah judul dan cuplikan dokumen. Seperti judul dan cuplikan, kata-kata dalam URL pada hasil penelusuran akan tampak tebal jika muncul dalam kueri pengguna.


Untuk belajar lebih banyak tentang struktur URL, kami merekomendasikan laman Pusat Bantuan Webmaster mengenai membuat URL yang bersahabat dengan Google.

4. Buatlah situs agar lebih mudah untuk dinavigasi


Navigasi situs web penting dalam membantu pengunjung menemukan konten yang mereka inginkan secara cepat.

Persiapkan dua petasitus: satu untuk pengguna, satu untuk mesin telusur.

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>http://www.example.com/</loc>
<changefreq>daily</changefreq>
<priority>0.8</priority>
</url>
<url>
<loc>http://www.example.com/berita/</loc>
</url>
<url>
<loc>http://www.example.com/berita/2010/</loc>
</url>
<url>
<loc>http://www.example.com/berita/2011/</loc>
</url>
<url>
<loc>http://www.example.com/berita/2012/</loc>
</url>
</urlset>

Contoh petasitus HTML dan Petasitus XML. Petasitus HTML dapat membantu pengguna menemukan konten yang mereka cari dengan mudah, dan Petasitus XML dapat membantu mesin telusur menemukan laman di situs Anda.













Sebuah petasitus (huruf kecil) adalah laman sederhana pada situs Anda yang menampilkan struktur situs web, dan biasanya berisi cantuman hierarki laman situs. Pengunjung bisa mengunjungi laman ini jika mereka memiliki masalah dalam menemukan laman pada situs Anda. Meskipun mesin telusur juga akan mengunjungi laman ini, dan mendapatkan cakupan perayapan yang baik dari laman situs Anda, sebenarnya laman ini ditujukan untuk pengunjung manusia.

5. Tawarkan konten dan layanan yang berkualitas.


Pikirkan tentang kata-kata yang mungkin ditelusuri oleh pengguna untuk menemukan sebagian konten Anda. Pengguna yang banyak tahu tentang topik tersebut mungkin menggunakan kata kunci yang berbeda dalam kueri penelusuran mereka dibanding seseorang yang baru melihat topik tersebut. Misalnya, penggemar uang kuno yang sudah lama mungkin menelusuri [uang kuno zaman belanda], sedangkan penggemar baru mungkin menggunakan kueri yang lebih umum seperti [uang kuno]. Dengan mengantisipasi perbedaan dalam perilaku penelusuran ini dan memperhitungkannya ketika menulis konten Anda (menggunakan perpaduan yang bagus antara frasa kata kunci) dapat menciptakan hasil yang positif. Google AdWords menyediakan Alat Kata Kunci yang membantu Anda menemukan variasi kata kunci baru dan melihat perkiraan volume penelusuran untuk tiap kata kunci (2). Perangkat Webmaster Google juga menyediakan kueri penelusuran teratas yang ditampakkan situs Anda dan kueri lain yang membawa pengguna terbanyak ke situs Anda.
Alat Kata Kunci Google AdWords dapat membantu Anda menemukan kata kunci yang relevan di situs Anda dan volume kata kunci tersebut

Pertimbangkan untuk membuat layanan yang baru dan berguna yang tidak ditawarkan situs lainnya. Anda juga dapat menuliskan karya riset orisinal, melaporkan berita yang menarik, atau meningkatkan basis pengguna yang unik . Situs lain mungkin kekurangan sumber daya atau tenaga ahli untuk melakukan hal ini.

6. Optimalkan penggunaan gambar Anda

Gambar mungkin terlihat seperti komponen langsung dari situs Anda, tapi penggunaannya dapat dioptimalkan. Semua gambar dapat memiliki nama file yang berbeda dan atribut "alt", yang seharusnya Anda manfaatkan. Atribut "alt" memungkinkan Anda menetapkan teks alternatif untuk gambar jika tidak dapat ditampilkan karena beberapa alasan

Gambar kami tidak ditampilkan kepada pengguna karena beberapa alasan, tapi
setidaknya teks alt dapat ditampilkan.

Alasan lainnya adalah jika Anda menggunakan gambar sebagai tautan, teks alt untuk gambar itu akan diperlakukan sama seperti teks tautan pada tautan teks. Namun, kami tidak menyarankan untuk menggunakan terlalu banyak gambar untuk tautan pada navigasi situs Anda jika menggunakan tautan teks sudah cukup. Terakhir, mengoptimalkan nama gambar dan teks alt membuatnya lebih mudah untuk proyek penelusuran gambar seperti Penelusuran Gambar Google untuk lebih memahami gambar Anda.

7. Menggunakan robots.txt dengan efektif

Batasi perayapan jika tidak diperlukan dengan robots.txt. File "robots.txt" memberi tahu mesin telusur apakah dapat mengakses kemudian merayapi bagian situs Anda (1). File ini, yang harus dinamai "robots.txt", ditempatkan di direktori akar situs Anda.

User-agent: *
Disallow: /gambar/
Disallow: /cari

Semua bot mesin telusur yang patuh (ditandai dengan simbol pengganti *) seharusnya tidak mengakses dan merayapi konten dengan /images/ atau URL apa pun yang jalurnya dimulai dengan /search

Anda mungkin tidak ingin laman tertentu dari situs Anda dirayapi karena laman tersebut mungkin tidak berguna bagi pengguna jika ditemukan sebagai bagian dari hasil mesin telusur. Jika Anda ingin mencegah mesin telusur merayapi laman Anda, Alat Webmaster Google memiliki pembuat robots.txt untuk membantu Anda membuat file ini. Perhatikan bahwa jika situs Anda menggunakan subdomain dan Anda ingin laman tertentu tidak dirayapi pada subdomain tertentu, Anda harus membuat file robots.txt terpisah untuk subdomain tersebut. Untuk informasi selengkapnya tentang robots.txt, sebaiknya Anda membaca panduan Pusat Bantuan Webmaster tentang menggunakan file robots.txt ini.


Terdapat beberapa cara lain untuk mencegah konten muncul di hasil penelusuran, seperti menambah "NONINDEX" ke tag meta robots Anda, menggunakan .htaccess pada direktori yang dilindungi kata sandi, dan menggunakan Alat Webmaster Google untuk menghapus konten yang telah dirayapi. Insinyur Google Matt Cutts menjelaskan satu per satu hal-hal yang perlu diperhatikan pada setiap metode pemblokiran URL dalam sebuah video yang membantu

8. Beri tahu Google tentang situs seluler

Jika situs web Anda tidak muncul dalam hasil penelusuran seluler Google meskipun menggunakan site: operator, mungkin situs Anda mengalami salah satu atau kedua masalah berikut:



(1) Contoh penelusuran untuk [uang kuno] di penelusuran desktop Google (di atas) dan penelusuran seluler (kiri). Hasil penelusuran seluler dibuat untuk perangkat seluler dan berbeda dari hasil desktop "standar".
  1. Googlebot mungkin tidak dapat menemukan situs Anda, Googlebot harus merayapi situs Anda sebelum situs dapat dicantumkan dalam indeks penelusuran kami. Jika situs baru saja Anda buat, kami mungkin belum mengetahuinya. Jika itu masalahnya, buat Petasitus Seluler dan kirimkan ke Google untuk memberi tahu tentang keberadaan situs kepada kami. Petasitus Seluler dapat dikirimkan menggunakan Alat Webmaster Google, sama seperti Petasitus standar.
  2. Googlebot mungkin tidak dapat mengakses situs Anda, Beberapa situs seluler menolak akses dari apa pun kecuali telepon seluler, yang membuat Googlebot tidak mungkin mengakses situs tersebut, dan karenanya, membuat situs tidak dapat ditelusuri. Perayap kami untuk situs seluler adalah "Googlebot-Mobile". Jika Anda ingin situs Anda dirayapi, izinkan User-agent apa pun, termasuk "Googlebot-Mobile", mengakses situs Anda (2). Anda seharusnya juga menyadari bahwa Google dapat mengubah informasi User-agent miliknya kapan pun tanpa pemberitahuan, sehingga Anda sebaiknya tidak memeriksa apakah User-agent benar-benar cocok dengan "Googlebot-Mobile" (User-agent yang sekarang). Alih-alih, periksa apakah bagian kepala User-agent berisi string "Googlebot- Mobile". Anda juga dapat menggunakan Pencarian DNS untuk memverifikasi Googlebot.
SetEnvIf User-Agent "Googlebot-Mobile" allow_ua
SetEnvIf User-Agent "Android" allow_ua
SetEnvIf User-Agent "BlackBerry" allow_ua
SetEnvIf User-Agent "iPhone" allow_ua
SetEnvIf User-Agent "NetFront" allow_ua
SetEnvIf User-Agent "Symbian OS" allow_ua
SetEnvIf User-Agent "Windows Phone" allow_ua
Order deny,allow
deny from all
allow from env=allow_ua
(2) Sebuah contoh situs seluler yang membatasi akses apa pun dari perangkat
non-seluler. Ingatlah untuk mengizinkan akses dari agen pengguna termasuk
“Googlebot-Mobile”.

Setelah Googlebot-Mobile merayapi URL Anda, kami kemudian akan memeriksa apakah tiap URL dapat dilihat di perangkat seluler. Laman yang kami putuskan sebagai tidak dapat dilihat di telepon seluler tidak akan dimasukkan dalam indeks situs seluler kami (meskipun laman tersebut mungkin dimasukkan dalam indeks web reguler). Penentuan ini didasarkan pada beragam faktor, salah satunya adalah deklarasi "DTD (Definisi Tipe Dokumen)". Periksa apakah deklarasi DTD URL ramah seluler Anda adalah format seluler yang sesuai, misalnya XHTML Mobile atau Compact HTML (3). Jika formatnya kompatibel, laman tersebut memenuhi syarat untuk indeks penelusuran seluler. Untuk informasi selengkapnya, lihat Pedoman Webmaster Seluler.

<!DOCTYPE html PUBLIC "-//WAPFOLUM//DTD XHTML Mobile 1.0//EN""http://www.wapfolum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml;
charset=Shift_JIS" />
(3) Sebuah contoh DTD untuk perangkat seluler.


9. Manfaatkan alat webmaster gratis


Mesin telusur besar, termasuk Google, menyediakan alat gratis untuk webmaster. Alat Webmaster Google membantu webmaster mengontrol dengan lebih baik bagaimana Google berinteraksi dengan situs web mereka dan mendapatkan informasi bermanfaat dari Google mengenai situs mereka.

Terakhir, Google menawarkan alat lain yang disebut Google Pengoptimal Situs Web yang memungkinkan Anda bereksperimen guna menemukan perubahan apa di dalam laman yang menghasilkan tingkat konversi terbaik dengan pengunjung. Hal ini, dikombinasikan dengan Google Analytics dan Alat Webmaster Google (lihat video kami tentang menggunakan "Google Trifecta"), merupakan cara hebat untuk mulai meningkatkan situs Anda.

Berikut link-link yang akan membantu Anda untuk meningkatkan situs Anda:

Forum Bantuan Webmaster Google
http://www.google.com/support/forum/p/webmasters/
Ada pertanyaan atau masukan tentang panduan kami? Beri tahu Google.

Blog Pusat Webmaster Google
http://googlewebmastercentral.blogspot.com/
Pos rutin oleh Karyawan Google tentang cara meningkatkan situs web Anda.

Pusat Bantuan Webmaster Google
http://www.google.com/support/webmasters/
Dilengkapi dengan dokumentasi mendalam tentang masalah yang terkait dengan webmaster.

Alat Webmaster Google
https://www.google.com/webmasters/tools/
Optimalkan bagaimana Google berinteraksi dengan situs web Anda.

Pedoman Webmaster Google
http://www.google.com/webmasters/guidelines.html
Pedoman desain, konten, teknis, dan kualitas dari Google.

Google Analytics
http://www.google.com/analytics/
Temukan asal pengunjung, apa yang mereka lihat, dan bandingkan perubahannya terhadap tolok ukur.

Google Pengoptimal Situs Web
http://www.google.com/websiteoptimizer/
Lakukan eksperimen pada laman untuk melihat apa yang akan bekerja dan apa yang tidak.

Kiat untuk Memilih SEO
http://www.google.com/support/webmasters/bin/answer.py?answer=35291
Jika tidak ingin melakukannya sendiri, kiat ini akan membantu Anda memilih perusahaan SEO.







Sumber: googleusercontent