Pages

Showing posts with label Web Design dan Animasi. Show all posts
Showing posts with label Web Design dan Animasi. Show all posts

Friday, October 5, 2012

Strategi mengembangkan usaha online tanpa modal banyak


Menampilkan bisnis di Internet
Kami menyingkirkan waktu, kesulitan, dan biaya untuk memperoleh situs web sehingga Anda dapat fokus terhadap perkembangan bisnis Anda.

Berikut ini yang akan Anda dapatkan:
  • Situs web gratis yang mudah diperbarui dan diganti sesuai dengan keinginan Anda
  • Alamat web .co.id gratis selama satu tahun.*
  • Tips dan pelatihan yang berkelanjutan
  • Kredit promosi AdWords dengan dukungan telepon gratis dari para pakar kami**

PERHATIAN:

Saat ini kami memberikan 2 pilihan sebagai berikut:
Pilihan 1: Jika Anda ingin mendapatkan nama domain .co.id, Anda wajib menyertakan KTP dan SIUP/TDP/Akte Notaris
Pilihan 2: Anda bisa mendapatkan nama domain .web.id dengan hanya menyertakan KTP atau SIM atau Passport.

Sebelum Anda memulai menbuat Website sendiri dan registrasi nama domain, pastikan Anda siap dengan dokumen yang dibutuhkan.
*Pelajari lebih lanjut tentang kami dan baca syarat & ketentuan kami
**Syaratan dan Ketentuan penawaran AdWords dapat ditemukan di sini.

Sudah punya situs web? Bantu situs Anda ditemukan di Internet.
Gunakan koneksi Internet cepat untuk website bisnis Anda, klik di sini.

Tuesday, October 2, 2012

Printing table headers on every page

Tables that expand over one page when printed can be a litle confusing, especially when lots of columns are involved, because column headers are not displayed on every page. One may have to flip back to the first page to make sense of the data. Not to mention the need for better looking reports given out to magement or clients. It’s possible though to print table headers on every page, and we’ll see how to do that with a little bit of CSS.

Our base table, unedited

We’ll demonstrate the use of this functionality by using a simple table that extends over many pages. First, let’s see the table in the old-fashioned way that we are all familiar with:

<table border="1" cellpadding="2" cellspacing="0">
    <tr>
        <th>ID</th>
        <th>First Name</th>
        <th>Last Name</th>
    </tr>
    <cfoutput>
        <cfloop from="1" to="50" index="i">
            <tr>
                <td>#i#</td>
                <td>First Name #i#</td>
                <td>Last Name #i#</td>
            </tr>
        </cfloop>
    </cfoutput>
</table>
 

Although the loop code is written in Coldfusion code, that is of no significance here. You can perform your loop in any language you like. The main point to note is the result you get when you try to print this long table. Here’s what the second page looks like when printed in IE 6.0:
It’s easy to see the problems:
  1. No headers on subsequent pages.
  2. The table borders may break as well.

Adding page headers to the table

So, we set out to fix those two issues. There are three things that we need to do to get this to work:
  1. Wrap the table headers that we want to display on every page in a thead tag.
  2. Wrap the data content of our table in a tbody tag.
  3. Add CSS properties for those two extra tags.

 
<style type="text/css" media="print,screen" >

 
th {

 
    font-family:Arial;

 
    color:black;

 
    background-color:lightgrey;

 
}

 
thead {

 
    display:table-header-group;

 
}

 
tbody {

 
    display:table-row-group;

 
}

 
</style>

 
 

 
<table border="1" cellpadding="2" cellspacing="0">

 
    <thead>

 
        <tr>

 
            <th>ID</th>

 
            <th>First Name</th>

 
            <th>Last Name</th>

 
        </tr>

 
    </thead>

 
    <tbody>

 
        <cfoutput>

 
            <cfloop from="1" to="50" index="i">

 
                <tr>

 
                    <td>#i#</td>

 
                    <td>First Name #i#</td>

 
                    <td>Last Name #i#</td>

 
                </tr>

 
            </cfloop>

 
        </cfoutput>

 
    </tbody>

 
</table>





The CSS properties are declared for both media and screen. I also added a little bit of formatting for the th tag to make the table headers stand out a little better. Now, let’s see the results of printing page two in IE 6.0:
Much better now. We can actually see the table headers even if we are on page two.
You should be aware that there are browser inconsistencies with this. This was tested with IE 6.0, which needs the CSS declarations for this to work. However, it looks like Mozilla based browsers, like Firefox 1.0+, behave much more predictably and do not require the style sheet rule. No matter what though, you still need the thead and tbody declared. Footers (tfoot) should in theory work the same way, but they don’t.

Improving the table print display

Are we done here? Well, there is still one minor issue that we can deal with. Using the method above, let’s take a look at the bottom of page one while printing:
We can see from the screenshot above that the table lines extend a little below the last data row. This is happening because the last row did not exactly match the length of the page and we still have some printable space below it. If there was more printable space and our data per row expanded over more than one line, then it would show part of the row on this page and part on the next.
However, if left and right borders are not necessary in your table, we can perform a little trick that will take care of this. Let’s make two changes to our code:
  1. Set our table’s border to null.
  2. Add a border at the bottom of each data row.

 

   

     

       

         
<style type="text/css" media="print,screen" >

         
table td {

         
 border-bottom:1px solid gray;

         
}

         
...

         
</style>

         
 

         
<table border="0" cellpadding="2" cellspacing="0">

         
...

       

     

   

 

Looking at the printed table now, the results are obvious:
The screenshot shows pages 1-2. The bottom of page one now shows no evidence that there is any printable area below the last line, and page two still shows up as expected.
Please note that (even though it’s not shown here), we can still have a browser break up a row onto more than one page. Your immediate reaction might be to add this CSS rule to the tr tag to avoid this:
1
tr {page-break-inside: avoid;}
However, at the moment this seems to be honored only by Opera 7.5+.
Using these simple techniques one can go about creating nicer looking and better functional reports. Of course, you can take the table display up a few notches as you see fit, by adding things like alternate row colors, improved header styles, colors, etc. The possibilities there are endless and so I leave that up the reader. The base however to do all this was shown here.

Wednesday, December 12, 2007

Image Slicing mempercepat loading website?

Desain web dan kecepatan akses website terkadang menjadi dua hal yang kontradiktif. Web yang sarat dengan image berukuran besar tentu tampilannya akan lebih lambat daripada web yang hanya mengandung unsur text singkat. Padahal menurut survey yang dilakukan oleh Zona research (April, 1999) menyatakan bahwa 80% pengunjung akan menutup browser (atau memindahkan Address/URL ?) bila halaman Web yang ia buka tidak tampil dalam 7-8 detik.

Untuk mengakalinya biasanya webmaster biasanya men-slice image (image slicing) menjadi dimensi yang lebih kecil. Pada artikel ini akan dijelaskan tentang apa itu image slicing.

Kemampuan Paralel Request Browser
Browser memiliki kemampuan untuk me-request pada web server secara paralel agar loading website lebih cepat dan kemungkinan kegagalan satu transaksi data akan digantikan secara cepat oleh transaksi yang lain.
Secara default Internet Explorer memiliki 4 paralel request. Sedangkan pada Firefox dan Opera kemampuan paralel download dapat di atur secara mudah tanpa mengkutak - katik registry.
Kemampuan request paralel inilah yang dimanfaatkan oleh para webmaster dengan men-slice image yang ditampilkan di web. Dengan maksud secara bersamaan browser akan berusaha mendownload beberapa image yang berbeda sekaligus sehingga loading halaman website menjadi lebih cepat. Sedangkan apabila image tersebut di tampilkan sebagai image tunggal maka hanya satu transaksi data yang terjadi.

Jangan terlalu banyak
Ada kalanya teknik image slicing ini malah memperlambat proses loading sebuah halaman web. Hal ini dikarenakan image di slice dalam jumlah yang terlalu banyak sehingga dalam satu waktu browser diharuskan mendownload banyak gambar sekaligus. Hal ini menyebabkan kelambatan loading image karena semakin banyak image tersebut di slice, maka browser akan membutuhkan waktu yang lebih lama karena proses negosiasi untuk mendownload banyak file akan lebih lama daripada mendownload sedikit file saja.

Merancang Navigasi Website

Navigasi pada sebuah website yang tertampil pada menu dan links adalah petunjuk bagi pengunjung terhadap halaman - halaman yang terdapat dalam website. Pengunjung akan semakin mudah menemukan halaman - halaman dalam website Anda jika menu - menu dan link yang ada tampil secara terstruktur. Sudah pasti pengunjung akan kesal apabila tidak mendapatkan halaman website yang ia cari gara - gara navigasi yang ruwet.

Rencanakan dengan Baik
Hal yang mutlak dilakukan sebelum mulai membuat sebuah web tentunya adalah pembuatan konsep dari website itu sendiri. Konsep tersebut akan memuat navigasi dasar dalam bentuk “tree view” (bercabang dan beranting) dari mulai konten yang bersifat umum hingga konten yang bersifat mendetail. Inilah garis besar navigasi dari situs yang akan dibuat.

Dimana Navigasi diletakkan
Seperti telah dikemukakan di atas, bahwa navigasi akan membawa pengunjung dari hal - hal yang bersifat umum hingga hal - hal yang bersifat mendetail. Halaman utama (index) tentu saja akan memuat menu - menu pokok yang bersifat umum. Percabangan dari menu - menu inti tersebut dapat di letakkan pada halaman - halaman cabang dari index.
Alternatif lain, Anda dapat menggunakan javascript untuk menampilkan menu dan sub-menu sekaligus.

Konsisten
Sebisa mungkin jangan merubah letak menu pada setiap halaman web sehingga pengunjung lebih mudah menemukan menu - menu tersebut. Misalnya menu utama berada di atas, setelah itu pada halaman - halaman yang terdapat dalam menu utama dapat ditampilkan sub-menu di sebelah kiri atau kanan halaman.

Spotty!
Buatlah menu dengan menonjol sehingga pengunjung mudah mengenalinya. Hal ini tentu saja harus di gabungkan dengan unsur estetika sehingga menu - menu tersebut dapat sejalan dengan konsep desain web yang dibuat.

Singkat & Deskriptif
Kata - kata yang terdapat dalam menu harus mampu memberikan petunjuk yang jelas dan singkat tentang halaman website di bawah menu tersebut. Gunakan istilah - istilah yang lazim, singkat, dan mudah dipahami.

Berikan Petunjuk pada Pengunjung
Akan lebih baik jika pada halaman website memuat strukur singkat halaman web yang sedang di tampilkan. Misal : Tentang Kami >> Visi & Misi >>

Berikan Link ke Halaman Utama
Jangan lupa untuk memberikan link ke halaman utama atau link ke halaman dalam “parent topic”. Ini akan memudahkan pengunjung jika situs Anda di bangun dalam struktur menu dan submenu yang cukup kompleks.

Sitemap
Buatlah sitemap yang linknya berada di setiap halaman web. Ini akan semakin memudahkan dan mempersingkat proses pencarian halaman - halaman website oleh pengunjung.

Jika pengujung merasa nyaman dalam mengunjungi website Anda, maka akan semakin baik pula content website dapat diterima oleh pengunjung.

Padding Untuk Tampilan Eksklusif

Padding atau space kosong cukup besar pengaruhnya untuk sebuah layout desain web. Ruang kosong mampu memberikan penonjolan pada content di dalam ruang kosong tersebut. Dalam ilmu komunikasi visual, istilah ruang kosong yang dinamakan whitespace adalah ruang dimana pembaca dapat mengistirahatkan indera visual sejenak atau “bernafas lega” dan melihat content di dalam whitespace secara lebih terkonsentrasi.

Sebuah analogi yang paling mirip adalah ketika kita berada di ruangan yang penuh sesak dengan barang. Kita akan merasa terhimpit, sesak, dan tidak nyaman. Akan sangat berbeda rasanya jika barang - barang tersebut tersusun dengan rapi, tidak terlalu sesak, dan seolah - olah kita masih dapat bernafas dengan lega di dalamnya.

Padding yang dalam dunia komunikasi visual dinamakan whitespace fungsinya adalah untuk memfokuskan mata pembaca pada tulisan yang berada di dalam space tersebut. Penggunaannya tentu saja untuk text ataupun grafis yang ingin ditonjolkan kepada pembaca.

Kesimpulannya, pemberian padding atau ruang kosong tidak akan menyiakan space, akan tetapi justru mampu membuat website tampil secara eksklusif dan pesan yang ingin disampaikan dapat tertampil dengan lebih menonjol.

PNG vs GIF

Artikel ini, mengajak anda menjelajahi dua pilihan utama dari format
gambar yang dapat dipakai dalam Web untuk menggambarkan graphic sederhana
berupa skema atau logo.

GIF
Graphics Interchange Format (GIF) dikembangkan pada tahun 1980 dan semakin
meluas penggunaanya.
Format GIF adalah format yang mengompress/memperkecil ukuran filenya
menggunakan algoritma yang disebut LZW
Nilai lebih dari GIf adalah dukungannya yang sangat luas dan muncul sebagai pilihan default untuk gambar sederhana pada web
Dibandingkan dengan yang lain(seperti PNG) GIF secara teknis tidak
begitu unggul,tetapi selama setahun ini berada di Web, mendukung
muncul dan berkembangnya PNG,ini tentu saja menjadi pilihan yang aman hingga saat ini.

Salah satu persoalan yang menyatakan disekeliling format GIF adalah
algorima LZW yang paten dilindungi USA oleh perusahan Unisys.
Perusahaan Unisys LZW berakhir diUSA 20 juni 2003. Hak paten LZW berakhir di
Kanada, Prancis, Italia, Jerman, Inggris dan Jepang.

PNG
(Portable Network Graphics) dikembangkan pada tahun 1995 dan menjadi rekomendasi W3C pada tahun 1996, dan telah berkembang pada hampir semua Web browser hingga tahun 1998.

PNG(Portable Network Graphics), sebuah file format untuk lossless,ptohotable,
yang diperkecil storage imagenya.PNG menyediakan patent-free
pengganti GIF dan juga dapat mengganti banyak menggunakan TIFF. mendukung Indexed-color,
grayscale,truecolor,plus optional alpha channel.

Untuk Web, PNG mempunyai tiga kelebihan dari pada GIF:
alpha channels (variable transparency)
cross-platfrom gamma correction (control untuk ketajaman/brightnes gambar)
dan color correction two-dimension interlancing( metode untuk progresif display).
PNG juga mengompres lebih baik dari GIF tiap2 case (5% sampai 25% pada type case)

PNG vs GIF

Artikel ini, mengajak anda menjelajahi dua pilihan utama dari format
gambar yang dapat dipakai dalam Web untuk menggambarkan graphic sederhana
berupa skema atau logo.

GIF
Graphics Interchange Format (GIF) dikembangkan pada tahun 1980 dan semakin
meluas penggunaanya.
Format GIF adalah format yang mengompress/memperkecil ukuran filenya
menggunakan algoritma yang disebut LZW
Nilai lebih dari GIf adalah dukungannya yang sangat luas dan muncul sebagai pilihan default untuk gambar sederhana pada web
Dibandingkan dengan yang lain(seperti PNG) GIF secara teknis tidak
begitu unggul,tetapi selama setahun ini berada di Web, mendukung
muncul dan berkembangnya PNG,ini tentu saja menjadi pilihan yang aman hingga saat ini.

Salah satu persoalan yang menyatakan disekeliling format GIF adalah
algorima LZW yang paten dilindungi USA oleh perusahan Unisys.
Perusahaan Unisys LZW berakhir diUSA 20 juni 2003. Hak paten LZW berakhir di
Kanada, Prancis, Italia, Jerman, Inggris dan Jepang.

PNG
(Portable Network Graphics) dikembangkan pada tahun 1995 dan menjadi rekomendasi W3C pada tahun 1996, dan telah berkembang pada hampir semua Web browser hingga tahun 1998.

PNG(Portable Network Graphics), sebuah file format untuk lossless,ptohotable,
yang diperkecil storage imagenya.PNG menyediakan patent-free
pengganti GIF dan juga dapat mengganti banyak menggunakan TIFF. mendukung Indexed-color,
grayscale,truecolor,plus optional alpha channel.

Untuk Web, PNG mempunyai tiga kelebihan dari pada GIF:
alpha channels (variable transparency)
cross-platfrom gamma correction (control untuk ketajaman/brightnes gambar)
dan color correction two-dimension interlancing( metode untuk progresif display).
PNG juga mengompres lebih baik dari GIF tiap2 case (5% sampai 25% pada type case)

Memilih Warna pada Website

Warna merupakan pertimbangan emosional, karena variasi warna dapat menyebabkan
emosi yang berbeda pada tiap orang. Kita semua tahu bahwa hijau adalah
simbol uang (mata duitan), tapi apakah kita tahu juga bahwa hijau merupakan simbol
ketamakan, iri hati, dan kecemburuan? Pilihan warna akan mendapat efek langsung dari pengunjung tentang persepsi perusahaan atau produk kita tawarkan. Ini menjadi rumit dengan adanya fakta bahwa penggunaan warna pada web sekarang tak terbatas: perkembangan teknologi membolehkan kita membuat jutaan kombinasi warna.
Jadi bagaimana dengan pilihan kita? Artikel ini akan membantu mempermudah memahami dasar-dasar dari pemilihan warna.

Ini penting untuk dimengerti bahwa setiap warna ditentukan positif dan negatif dari
emosi yang menghubungkannya dgn itu, mungkin bisa disebut dengan ‘makna warna’. Maksudnya adalah bahwa warna akan mempengaruhi emosional customer bagi perusahan, merek atau produk yang ditawarkan. Jadi ketika memilih skema warna untuk website, atau tipe media lain, anda perlu yakin dengan pemberian warna pada perusahaan atau produk dengan warna-warna yang mengajak audiens untuk selalu memilih web perusahaan atau produk kita
Mari beristirahat sejenak dan melihat ruang makan, kulkas,atau lemari kaca dapur
yang berisi produk yang kita beli dari toko sembako. Warna apa yang kebanyakan kita
lihat? Kebanyakan, dari yang terlihat adalah merah, dan banyak yang lain diantaranya.
Hanya sekilas terlihat dilemari kaca, sekarang apakah kita tahu apa yang terlihat di
dalamnya itu,produk yang penuh dng warna merah.Chef Boyardee,Kellogg’s,Lipton,Carnation, Ragu, aunt Jemima,Betty Crocker,Orville Redenbacher’s, Heinz, Pam, semua merek ini menggunakan label merah. Mengapa? Merah Adalah suatu warna” panas”, dan sangat emosional juga. Didalam studi, merah benar-benar mempunyai suatu phisik mempengaruhi orang-orang, meningkan jantung dan menyebabkan tekanan darah untuk naik, menarik perhatian kita, tindakan keributan.
dan suatu warna yang sangat kuat untuk produk pembungkus.

Semua warna yang pas/cocok dimasukkan ke dalam tiga kategori; sejuk, hangat
dan netral. Sedangkan kita bisa memilih semua warna yang kita suka dari kategori
yang sama,itu mungkin sering mencapai efek yang lebih sangat kuat dengan memperkenalkan warna dari satu di antara kelompok yang lain. Mari kita liat pandangan/persepsi sekarang bagaimana warna-warna bekerja bersama dan masing2 warna berarti bagi yang melihatnya.

Warna-warna sejuk
Biru, Hijau, Ungu, Pirus dan Perak adalah warna-warna sejuk.
Warna-warna sejuk cenderung berpengaruh memberikan perasaan tenang bagi yang melihatnya.
Meskipun digunakan sendiri, warna-warna ini bisa mempunyai rasa dingin atau impersonal, oleh sebab itu memilih warna-warna sejuk, mungkin bijaksana untuk menambahkan warna dari kelompok lain untuk menghindari ini.

Berikut beberapa makna dari beberapa warna sejuk:
Biru
Positif: keheningan, mencintai, kesetiaan, keamanan, percaya, intelligence
Negatif: kedinginan, ketakutan, kejantanan

Hijau
Positif: uang, pertumbuhan, kesuburan, kesegaran, healing
Negatif: iri hati, kecemburuan, kesalahan, kekacauan

Ungu
-Ungu adalah kombinasi biru dan merah, oleh sebab itu ditemukan baik kategori-kategori
hangat maupun sejuk
Positif: raja, kaum ningrat, spirituality, kemewahan, ambition
Negatif: misteri, kemasgulan

Pirus
Positif: rohani, sembuh, perlindungan, sophisticated
Negatif: cemburu, kewanitaan

Perak
Positif: glamor, tinggi, anggun, sleek
Negatif: pengkhayal, tidak tulus

Warna Hangat
Merah, merah muda, kuning, orange, warna ungu, dan emas adalah warna hangat.
Warna hangat cenderung mempunyai suatu efek kegairahan bagi yang melihatnya.
Bagaimanapun ketika warna ini digunakan sendiri dapat menstimulasi,
membangitkan emosi kekerasan/kehebatan dan kemarahan. Ketika memilih nada hangat,
menambahkan warna dari kelompok yang lain akan membantu ke arah menyeimbangkan ini.

Berikut beberapa makna dari beberapa warna hangat:

Merah
positif: cinta, energi, kuasa, kekuatan, penderitaan, panas
negatif: kemarahan, bahaya, peringatan, ketidaksabaran

Merah muda
positif: sehat, bahagia, feminin, rasa kasihan, manis, suka melucu
negatif: kelemahan, kewanitaan, ketidak dewasaan

Kuning
positif: terang/cerdas, energi, matahari, kreativitas, akal, bahagia
negatif: penakut, tidak bertanggungjawab, tidak stabil

Orange
positif: keberanian, kepercayaan, kehangatan/keramahan, keakraban, sukses
negatif: ketidak-tahuan, melempem, keunggulan

Ungu
- Warna ungu ditemukan di dalam kedua-duanya warna dingin dan hangat
positif: royalti, kebangsawanan, kerohanian, kemewahan, ambisi
negatif: kegaiban, kemurungan

Emas
positif: kekayaan, kemakmuran, berharga, tradisional
negatif: ketamakan, pemimpi

Warna Netral
Coklat, berwarna coklat, gading, kelabu, putih dan hitam adalah warna netral.
Warna netral adalah suatu pemilihan agung untuk bergaul dengan suatu palet(lukis)
hangat atau dingin. warna-warna itu adalah yang baik untuk latar belakang dalam
suatu disain, dan juga cenderung untuk berbicara lebih pelan, penggunaan dari yang lain
lebih menaklukkan warna. Tambahkan hitam untuk menciptakan suatu yang lebih gelap
” keteduhan” tentang suatu warna utama, sedang putih ditambahkan untuk menciptakan
suatu tongkang/geretan ” warna”.

Berikut beberapa makna dari beberapa warna netral:

Hitam
positif: perlindungan, dramatis, serius, bergaya/anggun, formalitas
negatif: kerahasiaan, kematian, kejahatan/ malapetaka, kegaiban

Kelabu
positif: keamanan, keandalan, kecerdasan/inteligen, padat, konservatif
negatif: muram, sedih, konservatif

Cokelat
positif: ramah, bumi, keluar rumah, umur panjang, konservatif
negatif: dogmatis, konservatif

Tan ( wol halus yang masih putih)
positif: ketergantungan, fleksibel, keriting, konservatif
negatif: tumpul, membosankan, konservatif

Gading
positif: ketenangan, kenyamanan, kebersihan/kesucian, hangat
negatif: lemah, tidak stabil

Putih
positif: kebaikan, keadaan tak bersalah, kemurnian, segar, gampang, bersih
negatif: musim dingin, dingin, jauh

Kita mungkin bertanya-tanya, ” Apa yang merupakan kebenaran mewarnai kombinasi
untuk bisnis website?” Selagi tidak ada kemutlakan “kebenaran” untuk mewarnai
website, kamu perlu memahami target pendengar, dan mempertimbangkan tanggapan mereka tentang warna, yang tidak dimilik. Jika gol akhir adalah untuk memilih produk atau perusahaan, kemudian palet warna harus ditetapkan. Ada keseluruhan faktor
yang menandai apa yang pengunjung suka atau tidak suka.

Faktor dasar target pengunjung untuk dipertimbangkan adalah perbedaan umur/zaman,
perbedaan kelas, perbedaan jenis kelamin dan keseluruhan kecenderungan warna.
(Dilist)
Perbedaan umur/zaman adalah suatu faktor pokok yang tidak boleh diabaikan.
Jika anak remaja dan anak-anak adalah target pengunjung, kemudian mereka menyukai
terang, warna dasar, warna primer merah, biru, kuning dan hijau.
Bagaimanapun, berbeda dengan orang dewasa, lebih tua, mereka akan menyukai
warna yang lebih gelap, sama dengan mewarnai dari kelompok warna-warna
yang netral.

Perbedaan kelas adalah faktor pokok yang lain di dalam memilih warna.
Riset Amerika Serikat telah menunjukkan kelas pekerja menyukai warna
seperti biru, merah, hijau, dan lain lain .
yang lebih terdidik cenderung untuk menyukai yang lebih mengaburkan
warna seperti taupe, warna biru langit, celadon, ikan salem, dll.

Perbedaan jenis kelamin adalah suatu faktor nyata didalam memilih warna.
laki-laki cenderung untuk menyukai warna cool seperti hijau dan biru, di mana wanita
menyukai warna lebih hangat, merah dan orange. Jika kita mempunyai pendengar/pemerhati keduanya para laki-laki dan perempuan, yang akan mempertimbangkan pencampuran beberapa warna dari palet cool dan hangat kepada keduanya laki-laki dan perempuan dapat bertanya pada mereka.

Yang terakhir tapi bukan tidak penting adalah kecenderungan warna. Menurut definisi,
suatu kecenderungan berarti “tren”. Memilih warna yang populer boleh2 saja
untuk beberapa bentuk websites dan produk, tetapi jika kita ingin menyajikan
umur yang panjang dan stabilitas web, kemudian warna populer tidak memungkinkan jadi yang terbaik untuk web kita. Sebagai gantinya, kita boleh mempertimbangkan warna yang lebih tradisional yang berdiri dari waktu ke waktu.

Memilih warna lebih kepada mengambil apa yang dirasa baik oleh kita, adalah menimbulkan suatu tanggapan lain dari yang melihat web kita. Dengan mengetahui target
dan efek yang berbeda dari warna yang ditimbulkan, kita memperoleh suatu kemampuan
lebih besar untuk menentukan apa yang menjadi warna terbaik untuk menarik pengunjung.

Satu catatan terakhir tentang warna. Pengunjung web biasanya menggunakan monitor berbeda, browsers berbeda , dan sistem operasi berbeda. Itu hampir mustahil untuk memastikan bahwa warna yang kita buat akan sama pada tiap-tiap komputer seperti halnya sedang dicetak.
Jangan hanya terkait dengan perbedaan pada komputer yang berbeda, tetapi bagaimana kita mencoba menjadikan konsisten. Bagaimana kita menciptakan suatu palet warna untuk perusahaan,identitas merek, atau warna produk, konsistensi adalah kunci. Gunakanlah warna yang sama pada seluruh usaha pemasaran untuk menciptakan keakraban dengan produk atau perusahaan. Konsistensi akan membantu menarik pengunjung.

Tips untuk Web Design

Apakah para pengembang web memahami berapa lama orang akan mengunjungi websitenya?
Apakah kita adalah internet newbie atau pemasar berpengalaman, kita perlu memahami hal terbaik tentang website, disain menjadi bagian yang menyangkut sukses kenyamanan.

Berikut tips untuk kesuksesan sebuah web:

1. Navigasi
Kita pernah bahas bagian ini pada artikel merancang navigasi website

Ketika orang datang ke website kita mereka pada umumnya mencari sesuatu yang khusus.Misal resep untuk diet rendah, sehat dan mencarinya serta menyiapkannya kurang dari beberapa menit atau apa yang merupakan bisnis terbaik untuk dimulai secara online.
Apapun yang pengunjung inginkan, kita harus mempunyai jawaban untuk itu. Maka tanyakan pada diri kita,kenapa orang-orang datang ke website kita? Ketika kita mengetahuinya kemudian kita harus membuatnya gampang untuk mereka temukan apa yang mereka cari.

2. Grafis
Jika kita menjalankan suatu site profesional, dan tidak menggunakan grafis/gambar2 yang menyenangkan, maka jangan harap orang akan mau berlama-lama di website kita. Orang datang keweb
kita untuk mencari informasi. Tidak untuk klik suatu iklan atau mengasah otak saja.

Membuat website menjadi lingkungan menyenangkan bagi pengunjung untuk menikmatinya. Memikirkan seperti kita pergi ke mall. Kita ingin masuk suatugudang/ toko yang bersih, yang dipersiapkan, mempunyai layanan baik pada pelanggan dan produk yang sedang dicari. Website kita perlu mencerminkan hal ini. Jika ada apa yang kita harapkan didalamnya
seperti pengalaman berbelanja, pengunjung akan menikmati apa yang sedang mereka cari diwebsite kita.

3. Warna
Ya, bagian ini juga sudah kita bahas di artikel sebelumnya. (link)
Warna adalah pilihan perorangan, tetapi studi menunjukkan warna itu mempunyai suatu pengaruh pada emosi publik.
Jika kita mempunyai suatu lokasi investasi keuangan,
Pilih warna konservatif. Atau jika kita menjual materi pantai, maka pilihlah warna yang lembut.

4. About Us
Orang pada umumnya ingin mengetahui hal-hal dasar sebelum mereka berbisnis dengan kita. Siapa kita, bagaimana cara mereka mendapatkan suatu pegangan dari kita, apa produk kita atau garansi jaminan, kapan mereka akan mendapatkan produk, dan lain lain. Kita harus menjawab
pertanyaan ini untuk menciptakan kepercayaan antara kita dan pelanggan potensial.

5.Sitemap
Anggaplah kita mempunyai banyak sumber daya dan halaman atau produk.
Sitemap membantu pengunjung untuk temukan apa yang sedang mereka cari dengan cepat tanpa harus menggeledah keseluruhan situs.
Hal ini sangat bermanfaat untuk website yang berskala besar, karena membantu pencarian untuk mengetahui apa yang ada disekitar dengan cepat.

6. Loading yang cepat
Tidak ada yang lebih buruk dibanding loading halaman website yang lambat. Kita dapat mengoptimalkan grafik untuk website. Orang benci untuk menunggu. Kamu dapat memeriksa halaman dan waktu beban halaman tergolong pada Alexa.Com.
Lambatnya halaman sama artinya bagi kematian suatu bisnis online.

7. Shopping Cart
Jika kita sedang menjual jasa atau materi,kita memerlukan suatu yang dapat diorganisir baik dan dapat dipercaya.kita lihat beberapa websites
mempunyai suatu banyak produk mendaftar dan email untuk pemesanan.
Apakah suatu mimpi buruk! Ya, shoping cart menuntut kita untuk pembayaran, tetapi itu sangat berharga untuk menangani transaksi. Ada banyak shoping cart yang tersedia dan kita akan riset berdasar pada kebutuhan bisnis.

8.Templates atau Disain Asli
Orang-Orang sering berpikir untuk mempunyai suatu website yang dirancang akan berharga ribuan. Sehingga mereka memilih templates dan menyusun lokasi.
Tidak ada salahnya dengan pendekatan ini kecuali dapat menceritakan
perbedaan antara apa yang panggil “canned” site dan apa yang
diciptakan sejak awal. Selagi kita tidak berpikir suatu website yang
menggunakan templates akan mengurangi pengunjung, kita berpikir mungkin
tidak menarik.

9.Customer service
Ok, maka dari itu bagaimana layanan pelanggan suatu website didisain?
well, layanan pelanggan harus tertulis dilokasi kita. Dari tips,laporan gratis,jaminan, untuk mempercepat dan berbelanja/shop. Orang ingin mengetahui banyak tentang apa yang kita bicarakan dan dikirimi
barang-barang yang mereka ingin.Berilah sedikit dan dijaminan kita akan mendapatkan sepuluh kali lipatnya.

Web Developer, Web Designer dan Webmaster

Kebanyakan orang selalu berpedapat bahwa web designer, web developer dan webmaster adalah sama. Apakah benar? Dibawah ini akan kita ulas perbedaan antara ketiganya. Dimana letak perbedaan yang sebenarnya?

Web Developer
Web developer adalah seseorang yang menciptakan aplikasi berbasis web dengan menggunakan bahasa pemrograman. Pada dasarnya, web developer membuat berbagai hal “terjadi” pada sebuah website. Peran web developer adalah sebagai penghubung dari semua sumber daya yang akan digunakan pada sebuah website, mulai dari pemanggilan database, membuat halaman website yang dinamis, hingga mengatur cara pengunjung untuk berinteraksi dengan elemen-elemen dari website tersebut.

Seorang web developer yang handal akan terbiasa dengan bahasa pemrograman, baik itu di sisi server ( server-side scripting ) maupun disisi client ( client-side scripting ). Dan jangan lupa dengan aspek database yang akan digunakan. Berikut adalah bagian aplikasi yang harus dipahami oleh seorang web developer.
• Client-side: JavaScript
• Server side: ASP, ASP.NET, Java, Perl, PHP, Python, Ruby, dsb.
• Databases: MySQL, Oracle, dsb.

Aspek tampilan menjadi sisi yang agak “terpinggirkan” oleh web developer. Pada umumnya setelah scripting dari aplikasi web telah selesai dibuat, web developer akan menyerahkan pekerjaannya kepada web designer untuk menciptakan tampilan yang baik.

Web Designer
Web designer adalah seseorang yang bekerja dengan unsur-unsur visual pada suatu halaman web. Dia adalah orang yang membuat wajah halaman web tampak begitu “cantik”. Para web design mengintegrasikan komponen seperti gambar, file flash, atau multimedia ke dalam halaman web untuk menambah pengalaman visual user, atau untuk melengkapi content page.

Pemahaman tentang Client-side scripting, HTML, CSS, cara memanipulasi image dan animasi merupakan beberapa hal yang dikuasai oleh web designer.
Berikut adalah bagian hal yang harus dipahami oleh seorang web designer:
• Client-side scripting: JavaScript
• Server-Side scripting: PHP, ASP, dsb.
• Cascading Style Sheets
• HTML
• Manipulasi image : Adobe Photosop, GIMP, Corel Draw, dsb.
• Animasi, biasanya berupa flash.

Web designer biasanya bekerja dalam tim untuk memastikan sebuah tampilan website dapat membuat aplikasi web bekerja dengan baik. Keterampilan tambahan berupa komunikasi, tentu akan menjadi sangat berguna bagi para web designer.

Sisi lain yang juga harus dipahami oleh web designer adalah usability / kegunaaan, standar W3C untuk HTML dan CSS dan kompabilitas tampilan pada browser yang berbeda.

Webmaster
Webmaster merupakan gabungan dari keduanya, bahkan webmaster juga bertugas untuk memelihara aplikasi web yang digunakan. Sebagai catatan tambahan, webmaster mungkin juga bertanggung jawab untuk optimisasi mesin pencari ( SEO ), mengisi content pada website, hingga ‘memasarkan’ website tersebut.

Dalam kelompok kerja yang lebih besar, webmaster akan lebih banyak menjadi manager dari sebuah web-based project, mengatur pekerjaan web developer dan web designer, hingga melakukan pengujian terhadap usability dari aplikasi web yang dibuat.

Bagi seorang web developer, kemampuan logis sangat dibutuhkan untuk mengatur alur aplikasi web yang dibuat. Sedangkan web designer membutuhkan kemampuan artistik dan kreatifitas. Dan bagi seorang webmaster, tentu akan membutuhkan kemampuan logis, artistik serta pengalaman yang memadai dibidangnya.

Langkah Langkah Membuat Hompage

Bermacam macam langkah yang digunakan oleh para web designer dalam membuat suatu homepage tetapi pada garis besarnya langkah langkah yang diambil adalah sebagai berikut :

1. Membuat Sketsa Desain :
Dalam mendesain suatu homepage langkah pertama yang dilakukan adalah membuat sketsa disain pada kertas, hal ini dilakukan untuk memberi gambaran bagaimana homepage kita nanti setelah selesai dan bagaimana cara mengatur letak letaknya. tetapi untuk kebanyakan orang langkah ini biasanya dilewati dan langgsung meloncat ke langkah kedua.

2. Membuat Layout Desain :
Setelah sketsa sudah jadi, kita menggunakan software seperti Adobe Photoshop, Adobe Illustrator, Macromedia Fireworks dan Macromedia Freehand untuk memperhalus sketsa desain dan juga menambahkan efek efek pada sketsa tersebut. Setelah layout desain homepage sudah jadi. File gambar tersebut dipecah menjadi potongan kecil-kecil untuk mengoptimize waktu download.Karena file gambar biasanya berukuran besar sehingga akan memerlukan waktu lama untuk membuka untuk membuka halaman web yang memakai gambar tersebut. Untuk melakukan hal tersebut kita dapat menggunakan software Adobe Image Ready. Software ini dapat langsung memotong gambar yang besar tadi dan otomatis juga menjadikannya ke dalam format html. Langkah ini bisa saja dilewatkan bila ukuran gambar kita tidak terlalu besar.

3. Membuat Animasi :
Animasi diperlukan untuk menghidupkan homepage kita agar menarik pengunjung. Macromedia Flash dan Gif Construction Set dapat dipakai untuk melakukan hal tersebut.

4. Membuat HTML :
Setelah itu kita merapikan layout desain kita seperti menempatkan beberapa tombol dan gambar, menambah text, mengedit script HTML, membuat layout form ke dalam format HTML. Untuk itu kita perlu software HTML Editor seperti Macromedia Dreamweaver, Microsoft Frontpage dan Allaire Homesite.

5. Programming dan Script :
Untuk website e-commerce, iklan baris, lelang, database, membuat guestbook, counter dan forum diskusi. selain itu script ini juga dapat digunakan untuk mempercantik halaman web kita antara lain membuat animasi text , membuat animasi pada background dan lain lain. File HTML kita perlu programming untuk melakukan aktivitas semacam itu. Programming dan script ini bisa dibuat dengan menggunakan ASP, Borland Delphy, CGI, PHP, Visual Basic dan yang terkenal saat ini adalah dengan menggunakan java script.

6. Upload HTML :
Setelah file kita telah menjadi html beserta gambar dan scriptnya. Kita perlu meng-upload file kita ke suatu tempat ( hosting ), agar semua orang di dunia dapat mengakses halaman html kita. Biasanya Macromedia Dreamweaver dengan fasilitas site FTP dan Microsoft Frontpage dengan Publishnya telah menyediakan fasilitas upload ini. Atau dapat menggunakan software seperti WS-FTP, Cute FTP, Bullet FTP. Yang perlu menjadi catatan di sini adalah jika kita menggunakan microsoft frontpage kita harus memilih hosting yang mendukung frontpage ini karena tidak semua hosting mendukung frontpage, terutama hosting gratis.

7. memilih hosting :
Untuk homepage pribadi atau yang sekedar ingin coba-coba biasanya setelah file html sudah jadi dapat hosting di tempat-tempat gratis, memakai guestbook dan counter gratis dan menambah macam-macam accesories dalam mempercantik homepage pribadi tersebut. Contohnya yaa seperti homepage saya ini. Lihat tutorial Fasilitas gratis pendukung homepage.

Software-Software yang dipakai

Desain :ntuk mb desain suatu homepage biasanya para web designer dimulai dengan software ini sebagai tampilan sementara atau dalam membuat layout homepage.

1. Adobe Photoshop : Desain berbasis titik ( bitmap )

2. Adobe Image Ready : Memotong gambar-gambar ke dalam format html

3. Adobe Illustrator : Desain berbasis vector

4. CorelDraw : Desain berbasis vector

5. Macromedia Freehand : Desain berbasis vector

Efek Desain :al ini dakukan untuk menghidupkan desain yang telah kita rancang. Seperti menambah efek cahaya, textur dan manipulasi teks.

1. Macromedia Firework : Efek teks

2. Painter : Memberikan efek lukisan

3. Ulead Photo Impact : Efek frame dan merancangan icon yang cantik.

4. Plugins Photoshop : Seperti Andromeda, Alien Skin, Eye Candy, Kai's Power Tool dan Xenofex juga sangat mendukung untuk memberi efek desain sewaktu anda mendesain layout homepage di Photoshop.

Animasi :Pnambahan animasi perlu untuk membuat homepage agar kelihatan menarik dan hidup.

1. 3D Studio Max : Untuk membuat objek dan animasi 3D.

2. Gif Construction Set : Membuat animasi file gif 3. Macromedia Flash : Menampilkan animasi berbasis vector yang berukuran kecil.

3. Microsoft Gif Animator : Membuat animasi file gif

4. Swift 3D : Merancang animasi 3D dengan format file FLASH.

5. Swish : Membuat berbagai macam efek text dengan format file FLASH.

6. Ulead Cool 3D : Membuat animasi efek text 3D.

Web Editor :enyukan keseluruhan gambar dan tata letak desain, animasi, mengisi halaman web dengan teks dan sedikit bahasa script.

1. Alaire Homesite :

2. Cold Fusion :

3. Microsoft Frontpage :

4. Macromedia Dreamweaver :

5. Net Object Fusion :

Programming :l inlakukan setelah sebagian besar desain homepage telah rampung. Programming bertugas sebagai akses database, form isian dan membuat web lebih interaktif. Contoh : Membuat guestbook, Form isian, Forum, Chattin Portal, Lelang dan Iklanbaris.

1. ASP ( Active Server Page ) :

2. Borland Delphy :

3. CGI ( Common Gateway Interface ) :

4. PHP :

5. Perl :

6. Javascript

Upload : html kita perlu di letakkan ( upload ) di suatu tempat ( hosting ) agar orang di seluruh dunia dapat melihat homepage kita.

1. Bullet FTP :

2. Cute FTP :

3. WS-FTP :

4. Macromedia Dreamweaver : dengan fasilitas Site FTP

5. Microsoft Frontpage : dengan fasilitas Publish

Sound Editor :omepage kita belum hidup tanpa musik. Untuk mengedit file midi atau wav, perlu alat khusus untuk itu.

1. Sound Forge : Mengedit dan menambah efek file yang berformat mp3 dan wav.

2. Cakewalk : Mengedit dan menambah efek untuk file yang berformat midi

Banyak sekali memang software untuk membuat suatu homepage dan kita tidak perlu mempelajari semua software tersebut di atas. Tapi untuk mempermudah, bagi pemula lebih baik dimulai terlebih dulu dengan mempelajari software Microsoft Frontpage atau Macromedia Dreamweaver agar lebih mengenal aturan-aturan membuat homepage dan mengenal bahasa html. Setelah itu baru Adobe Photoshop yang dipakai kebanyakan para desainer.


FASILITAS GRATIS PENDUKUNG HOMEPAGE

Berikut ini adalah fasilitas-fasilitas gratis yang bisa kita dapatkan dari internet untuk membuat homepage kita menjadi semakin powerfull. Tentunya hal yang kita dapatkan secara gratis akan diimbangi dengan sesuatu yang harus kita terima. Biasanya mereka menampilkan banner di homepage kita dan ini sebenarnya sangat menganggu, tapi tetap saja kita harus menerima bila ingin menggunakan fasilitas gratis tersebut.

Guesbook

Buku tamu di mana orang bisa mengisi identitas tentang dirinya, mengkritik dan memberi saran.

· Lpage

· Guestpage : Mudah di setup (using html tag) agar sesuai dengan tampilan design yang anda mau. Selain itu mereka menyediakan beberapa template guessbook yang ok kalo kita ngga mau cape2 setup.

· The Guestbook

Counter

Menghitung seberapa banyak pengunjung yang telah masuk ke homepage kita. Penyedia counter gratis antara lain :

· Dark Counter : menyediakan puluhan model counter sebagai pilihan.

· PageCount

· The Counter

Web Hosting

Tempat menyimpan file html, agar desain homepage kita dapat dilihat oleh pengunjung di seluruh dunia.

· Cybercity

· Freeservers

· Geocities

· Fortunecity

· Xoom

Email

Anda bisa mendapatkan fasilitas email gratis tanpa perlu mendaftarkan diri ke Internet Provider.

· Mailexite

· Netadress

· Geocities

· iName

· Mailcity

Direct URL

Bila url anda terlalu panjang, misalkan : http://www.geocities.com/area51/station/007 , maka dengan direct url ini nama url itu bisa di singkat dengan http://i.am/007.

· CyberName

· Free URL

· Easy to Remember

· Name Zero : fasilitas ini memberikan kita nama domain dot com

Chatting

Fasilitas ngobrol dapat di buat di homepage Anda sendiri.

· BraveNet Wev Services :Free guestbooks, message forums, form processors, greeting cards, hit counters, search engines and more!

Pooling

Bila Anda ingin tahu jawaban terbanyak dari para pengunjung tentang pilihan dari pertanyaan-pertanyaan Anda.

· BraveNet Wev Services : Free guestbooks, message forums, form processors, greeting cards, hit counters, search engines and more!

Web Promote

Mempromosikan homepage anda dengan sekali klik, maka homepage kita akan masuk ke beberapa situs search engine.

· Linksubmission

· Jayde

· Fast submit

· Selfpromotion

· Add-Me

· Submit It!

Mailing List

Membuat komunitas lewat email yang membicarakan hal-hal tertentu bersama orang lain.

· Egroups

· Listbot

· Onelist

Web Statistik

Melihat statistik homepage Anda. Dari mana saja pengunjung berasal, browser apa saja yang mereka pakai, hari apa saja homepage kita ramai dikunjungi orang.

· Web Statistic

Web Check

Mengetahui kecepatan loading dan spesifikasi tentang homepage anda.

· NetMechanic

· Web Site Garage

Lain-Lain

· BraveNet Wev Services : Free guestbooks, message forums, form processors, greeting cards, hit counters, search engines and more!