Membuat Website dengan Teknik CSS
Secara umum, sebuah halaman web terdiri dari beberapa blok. Blok ini dikenal dengan division yang disimbolkan dengan kode tag <div> dan </div>. Mengapa kita harus membagi halaman menjadi beberapa blok, hal ini supaya halaman dapat ditata dengan rapi dan menarik..Teknik desain halaman web dengan menggunakan tag <div> dan </div> disebut teknik CSS.
Beberapa desainer masih menggunakan teknik tabel (tag <table> dan </table>) untuk menata halaman web, namun cara ini tidak direkomendasikan oleh standar web internasional mengingat teknik ini boros halaman kode yang akan mengakibatkan halaman semakin lama dimuat, selain itu teknik ini sulit di-index oleh mesin pencari google. Menggunakan teknik CSS akan menampilkan halaman web yang lebih menarik dan lebih mudah disusun dengan rapi..
Bagaimana Memulainya..??
Pertama buka dulu program Notepad dari Start-Program-Accessories-Notepad dan mulai dengan ini (well, saya selalu menggunakan rumus seperti ini kalo membuat website):
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Website Dermawansyah</title> <meta name="description" content="Webpage ini menjelaskan bagaimana membuat website dari dasar"/> <meta name="keywords" content="website, css, membuat website" /> <meta name="robots" content="index,follow" /> <style type="text/css" media="all">@import "my_css.css";</style> </head>
<body>
</body>
</html>
Keterangan:
Simpan file tersebut dengan nama index.html. Pastikan file of type terpilih adalah all files.
tag meta adalah sesuatu yang boleh dikatakan wajib digunakan untuk “memperkenalkan” websitemu, diletakkan di dalam pasangan tag <head> dan </head>
Di dalam tag “description” masukkanlah penjelasan mengenai websitemu, jangan terlalu panjang, yang penting jelas.
Keywords adalah kata kunci yang digunakan yang dapat membantu google meng-index websitemu.
Kemudian ada juga tag ini:
<meta name="robots" content="index,follow" />
Apabila orang mengklik title web kita di google, maka akan diarahkan ke file bernama index.
Dan tag ini:
<style type="text/css" media="all">@import "my_css.css";</style>
Apabila kita memiliki file CSS, silakan masukan kode seperti itu untuk memuatnya. File CSS berisi penataan halaman web agar tampi menarik. Kita dapat mengatur letak, ukuran dan warna elemen-elemen web di dalam sebuah file CSS.
Mulai menggunakan tag <div>
Masukkan tag-tag ini di antara blok <body></body>:
<body>
<div id=”header”>
</div>
<div id=”main”>
</div>
<div id=”footer”>
</div>
</body>
Membuat File CSS
Ketikkan di Notepad:
body
{
background-color: #000000;
font-family: Arial, Helvetica, Verdana, Sans-serif;
font-size: 14px;
color: #666666;
}
#header
{
background-color:#ffffff;
height: 120px;
}
#main
{
background-color:#303030;
line-height: 25px;
}
#footer
{
background-color:#505050;
}
Simpan file dengan nama my_css.css. File ini bersama dengan index.html diletakkan di dalam sebuah folder. Kemudian bukalah browsermu, hasilnya seperti ini:
Selamat mencoba dan semoga sukses ya..
Script Login VB Net (2005/2008)
Biasanya kalo kita mengakses sebuah program database, kita akan dipertanyakan password untuk memasuki program tersebut. Berikut ini cara membuatnya ^_^.
1. Buka program SQL Server, dan aktifkan database Northwind. Buat sebuah tabel baru ke dalam database tersebut, dengan nama tbl_user. Tabel ini mempunyai tiga kolom (field) yaitu ID, Nama dan Password. Isikan dua buah data berikut.
data1: user01, Rudy, Rudy01
data2: user02, Fenny, Fenny02
2. Buat sebuah aplikasi baru di VB dan tambahkan dua textbox bernama: txt_id dan txt_pwd dan dua buah button: bt_ok dan bt_btl. Di bagian atas kode (setelah private sub form..) ketikkan kode berikut.
dim koneksi as sqlclient.sqlconnection
dim co as sqlclient.sqlcommand
dim bd as bindingsource
3. Masukkan sebuah fungsi untuk membuka database.
sub koneksikan ()
koneksi=new sqlclient.sqlconnection
koneksi.connectionstring=”data source=.; initial catalog=customers; integrated security=true”
koneksi.open
end sub
4. Klik ganda bt_ok, dan isikan kode berikut
koneksikan
co=new sqlclient.sqlcommand
co.connection=koneksi
co.commandtext=”Select * from tbl_user where ID='” & me.txt_id.text & “‘” & “and password = ‘” & me.txt_pwd.text & “‘”
co.commandtype=commandtype.text
bd.datasource=co.executereader
if bd.count > 0 then
msgbox “OK, login berhasil, dan silakan masuk..”
else
msgbox “Maaf, password salah..”
endif
koneksi.close
5. Klik ganda bt_btl, dan masukkan kode berikut..
unload me
6. Save project dan jalankan program. Semoga sukses ya..
Koneksi Visual Basic 2008 dengan SQL Server dan Access
Kita akan menggunakan database bawaan dari SQL Server, yaitu Northwind dan tabel yang digunakan adalah tabel Customers. Contoh koneksi visual basic 2008 (dan juga vb 2005) dengan SQL Server adalah sebagai berikut..
1. Buat satu aplikasi baru di vb 2008, dengan menambahkan sebuah datagridview untuk menampilkan data.
2. Masuk ke jendela code. Di dalam kode, ketikkan kode berikut.
dim koneksi as sqlclient.sqlconnection
dim co as sqlclient.sqlcommand
dim bd as bindingsource
3. Klik ganda form tersebut, akan muncul kode “form_load”. Apabila kita ketikkan kode di dalamnya, kode tersebut akan dijalankan sewaktu form ini di-buka. Di dalamnya ketikkan kode berikut..
==================================================================
koneksi=new sqlclient.sqlconnection
co=new sqlclient.sqlcommand
bd=new bindingsource
koneksi.connectionstring=”data source=.; initial catalog=customers; integrated security=true”
koneksi.open
co.connection=koneksi
co.commandtext=”Select * from customers”
co.commandtype=commandtype.text
bd.datasource=co.executereader
me.datagridvieww1=bd
koneksi.close
===================================================================
Keterangan: datasource=diisi dengan nama server, kalo program satu PC dengan database SQL Server, maka diisi dengan tanda titik yang artinya server LOCAL. Km harus sesuaikan dengan nama server di mana database disimpan..
4. Save project kita dan coba jalankan.. Apabila berhasil, ketika form dijalankan, datagridview akan memuat data pada tabel customers. Semoga sukses dan jangan lupa komentarnya ya bro n sis..
Koneksi dengan Access
Koneksi dengan Access pada dasarnya sama tekniknya dengan SQL Server.
Contoh:
dim cn as oledb.oledbconnection
cn.connectionstring=”Provider=Microsoft.Jet.OLEDB.4.0; Datasource=minimarket.mdb”
dim co as oledb.oledbcommand
dim bd as bindingsource
sub tampil_data ()
cn=new oledb.oledbconnection
‘satu baris kode di bawah ini adalah cara singkat penulisan command
co=new oledb.oledbcommand (“Select * from Customers”, cn)
bd=new bindingsource
bd.datasource=co.executereader
datagridview1.datasource=bd
cn.close
end sub
Selamat Mencoba ^_^ Moga Berhasil
-
Recent
-
Links
-
Archives
- June 2010 (1)
- February 2010 (7)
-
Categories
-
RSS
Entries RSS
Comments RSS