Memperhatikan konsep “Above the Fold” dalam membuat desain web.

Apa maksud dari “Above the Fold“?
kalau diartika sari halah… diartikan langsung mungkin dalam bahasa indonesia akan menjadi “Diatas Lipatan” arhg! nggak cool! Let just keep it that way… “Above the fold”
Istilah ini berarti penempatan materi-materi menarik atau materi-materi penting dibagian atas sebuah desain web saat ditampilkan di web browser (tanpa harus melakukan mouse scrooling).

Seberapa tinggi “Above the fold“?
Berhubung beragamnya resolusi monitor pengguna internet maka dapat dipastikan hal ini bersifat relatif. Tetapi menurut browser statistik bahwa pengguna internet sekarang ini kebanyakan (hampir 54%) memakai resolusi 1024×768 pixel. Jadi marilah kemari hey…hey… halah! kita jadikan hal tersebut sebagai acuan untuk menentukan tinggi “Above the fold“.

Hal lain yang perlu diperhatikan adalah jenis browser yang digunakan oleh pengguna Internet juga mempengaruhi ukuran ini. maksudnya jenis? pria atau wanita? otakmu kelamin tok! hahahaha maksudnya jenis apakah Microsoft Internet Explorer atau Firefox atau browser merk lain. Kita ambil contoh dua browser terpopuler tadi saja, perhatikan gambar berikut :
firefox with no toolbar above the fold
Firefox 1.5.x.x tanpa toolbar.

above the fold firefox with toolbar
Firefox 1.5.x.x dengan Google toolbar.

Apa belum punya firefox? HAREEE GENEEE… gih download dulu hihihihi


above the fold ie 6 with no toolbar
Internet Explorer 6.0 tanpa toolbar.

above the fold ie 6 with Yahoo! oolbar
Internet Explorer 6.0 dengan Yahoo! toolbar.

Kemungkinan lain yang mengakibatkan besarnya “Above the fold” akan berkurang adalah kebiasaan user/pengguna browser yang menambahkan toolbar lain selain toolbar Yahoo atau Google. Katakanlah di warnet biasanya browser sudah dalam keadaan semrawut dengan toolbar-toolbar yang nggak penting yang diinstall langsung/asal klik ketika user ngebokep lihat yang bogel bugil di internet hihihihi, atau faktor lain bagi yang nggak nge-bokep biasanya ada tambahan developer toolbar, alexa toolbar, digg toolbar atau toolbar-toolbar lain yang bermanfaat dengan kebutuhan pengguna browser.

Menjadikan 4 kemungkinan dari 2 browser terpopuler diatas sebagai acuan adalah cara terbaik.

Bagaimana melakukan pengecekan atau preview apakah design sudah “Above the fold”? saat proses design menggunakan :

1. Macromedia Firework
Di Macromedia Firework dengan hanya menekan F12 pada keyboard maka design akan ditampilkan langsung di web browser default pada komputer dan kita akan bisa melihat apakah sudah “Above the fold”.

2. Adobe Photoshop
Pilih File > Save for Web, kemudian pilih browser dari menu pilihan browser yang berada di bawah window Save for Web.

Materi apa saja yang harus ditampilkan di area “Above the fold”?
Hal ini sangat tergantung dari website apa yang kita desain. OK, kita ambil contoh sebuah website e-commerce.

1. Perhatikan penggunaan banner.
Usahakan didalam banner menampilkan sebuah images yang secara visual menginformasikan “barang” apa yang dijual di website tersebut. Katakanlah lingerie…ohhh… I love Lingerie e-commerce website hihihi selalu inspiring hahaha. Jadi kita pasanglah gambar simpanse yang memakai lingerie kedodoran, kemudian menambahkan Typografi dengan quote yang menarik seperti “Salah Ukuran Membuat Si Dia Ngedrop” atau “Mencukurnya Terlebih Dahulu Akan Sangat Membantu” dan ditutup dengan pernyataan “Kami Mengerti Ukuran Anda” hahaha.
Mengenai tinggi banner please use your considerations, “But sir my considerations is fcuk’up!” “OK than,please your opportunity to check-up to the nearest mental institutions” hahaha.

2. Tampilkan menu-menu penting.
Memutuskan memakai side-menu dengan menampilkan menu category lengkap dengan sub-category sangatlah bijaksana. Sehingga pengunjung langsung dapat melihat category product yang ditawarkan. Tampilkan juga info penting lain seperti ‘how to order“, “payment info“, “contact” dan lain-lain.

3. Tampilkan product terbaru (latest product) atau featured products.
Hal ini juga bisa membuat pengunjung untuk tetap melanjutkan browsingnya di dalam website karena mereka mendapatkan informasi tentang produk terbaru. Apalagi dengan quote-quote promo, discount, sales dan lain-lain.

Tiga materi tersebut akan mendukung tujuan dibuatnya website tersebut yaitu “mulai menjual“. Jadi mari teriakan bersama-sama dengan tangan terkepal “KEEP IT ABOVE THE FOLD” (*LSM banget…)

Micosoft Web Design Software.

Microsoft Expresseion Web ; mereka mengklaim software ini adalah software yang tepat untuk membuat sebuah aplikasi berbasis web yang modern dan akan menghasilkan kualitas yang superior.

Tertarik? Silahkan download trialnya disini. Mau full versionnya? Beli saja DS600 or DS800 server disini.

Oh ya sebelum mencoba download trialnya mohon diperhatikan sebelum menginstallnya anda harus :
– Install Microsoft .NET Framework 2.0 (see below) before installing Expression Web.
– Uninstall all Microsoft Office 2007 beta programs before installing Expression Web Trial.
– Dapatkan product key-nya untuk bisa menjalankan trial-nya.

Berikut dua website yang dibuat menggunakan software ini
www.personifydesign.com
www.thirteen23.com

The expression blog

Lupa Password Mambo atau Joomla Administration Console?

Ketika kita lupa password login ke mambo administration console di backend login mambo tidak disediakan fasilitas Retrieve Lost Password. Terus panik dong! keluar ruangan sebentar terus berteriak arrggg tidaaaa mamaaa passwordnya apa?! Masalah terpecahkan? tentu tidak! Ikuti sedikit panduan singkat bagaimana mengganti password mambo/joomla anda dari phpmyadmin. Jangan bilang anda juga lupa password cpanelnya!Kalau begitu adanya tutorial ini tidak berguna… coba pakai kekuatan doa hahaha 😛
mambo administrator backend login lost password

Masuklah ke phpmyadmin pages, kemudian explore database terkait carilah Table mos_users pada mambo kalau di Joomla cari jos_users , pilih table tersebut.

mambo joomla lost password database

Kemudian click Browse.

.mambo lost password browse table mos_users

Kemudian pilih icon bergambar pencil untuk mengedit fields pada table user.

edit fields mos_users

Pada Field password anda bisa lihat kode terenkripsi acak yang nggak jelas seperti campuran karakter angka dan huruf seperti misalnya 6019kb5f3452ae6fdrd0c04d1e0e2231d Ow tenang jangan panik lagi, tadi khan udah! 😛 Sekarang hapus karakter acak itu isi dengan password yang baru. Kemudian pada fields Function anda bisa temukan pilihan drop-down pilihlah MD5.

mambo administrator console password retriver md5

Kemudian simpan atau Save perubahan yang anda buat dengan click tombol Go yang terdapat dibagaian bawah halaman.

save changes mambo password

Aha! sekarang anda bisa login menggunakan password anda yang baru. Apa usernamenya lupa? Itu lihat di gambar 4 usernamenya kelihatan.

WordPress Flash Tag Cloud

{flashtagcloud}

Barusan nyoba download dan install ternyata lumayan gampang dan jadi. Nggak kepikiran mau pasang di sidebar soalnya kayaknya tidak Search Engine Friendly gituloh secara pake flash ini. Cuma buat lucu-lucuan aja. Color Themenya juga bisa diganti menyenangkan™.