7 Tip Rekabentuk Web Yang Ideal
July 31, 2009 | Comments | Grafik & Website
Semasa melayari FaceBook tadi aku telah menemui satu artikel yang sangat bagus khususnya jika kamu terlibat dalam kerja membina laman website. Salah seorang pereka laman web yang aku minati hasil kerjanya adalah webmaster Softhands Creative Studio iaitu saudara Mohd Nuur Fahmy Bin Massailan. Idea & konsep design dia ni memang best & unik..ada sentuhan yang bagi aku memang hebat. Bro Fahmy ni juga full-time IM yang telah berjaya menjana pendapatan yang lumayan di interet..kalau kamu mengikuti perkembangan perniagaan internet di Malaysia, nickname code7 memang tidak asing lagi.
Baiklah di bawah ni adalah artikel daripada bro Fahmy yang aku maksudkan & kerana ianya sangat bagus maka aku kongsikan di blog ini khususnya jika kamu tidak pernah membaca artikel ini.
—————————————————————————————————————————-
Di sini saya akan listkan beberapa ciri-ciri web design yg ideal sebagai satu panduan bagi mereka yang baru berjinak-jinak di dalam dunia web development utk menghasilkan karya web yang terbaik :
1. Loading faster
Web design yg mudah loading merupakan salah satu faktor utama pengunjung suka surfing. Contohnya google & yahoo.. layout designnya simple saja dan mmg sebegitu krn ia hanya mementingkan maklumat/info yg cpt dan mudah dilayari.
2. Appropriate Colour, Theme & Concept design
Sstgh web yg bagus ada tema dia… ada penggunaan color yg seimbang dan concept yang tepat. Contohnya web berkaitan education ada imej/grafik berkenaan education, buku, pelajar dan bukan mengenai kereta kebal atau jet pejuang. Colour dia seimbang, kebanyakan tone colour ada maksudnya tersendiri… warna silver, putih & color cerah lebih nampak corporate.. manakala black dan colour gelap lebih sesuai utk web personal… Concept design pula terpulang pada anda nak wat corporate, personal atau season template mcm tahun baru, world cup etc… Kalo perlu audio & motion graphic kita guna flash.. buat sehabis baik mungkin dan berikan option utk skip.. Sbb sstgh user maybe ada prob connection dan tak mahu lambat tgk flash animation.. Sbb itu bila ada concept dan berjaya memanipulasikannya adalah satu kejayaan yg ideal..
3. Less is more
Inilah prinsip saya praktikkan dlm web design… lebih simple graphic lebih banyak cantik.. kita tak perlu menyerabutkan kepala dgn teori2 ilham design yang terlalu banyak. Cukup dgn penggunaan colour dan concept yg betul ia sudah memadai… Tak semua user suka graphic kita, sbb itu biar nampak minimum tapi modern. Jgn terlalu obses graphic sehingga menyerabutkan design anda. Kreativiti perlu disertai dgn strategi content management. Barulah org nampak tersusun, sistematik & tidak serabut.
4. Compatible with all web browser & screen resolution
Ini satu cabaran wat webmaster.. tak seme web design kita support browser dan screen resolution. Kenkadang byk ‘jawa’script , dhtml, css dll tak disupport oleh browser lain. Wat masa ni dunia masih popular dgn Internet Explorer & Mozilla Firefox. Kita cuba buat web kita compatible dgn 2 browser ini. Jgn bagi nampak cacat dgn kedua-dua browser ini, ia mmg cukup mencabar jika kita mmg jenis suka guna css, dhtml, jawascript krn ada byk pro & cons dalam browser yg berlainan. Dan satu lagi ialah screen resolution. Kita perlu pastikan web design kita support 800×600 dan 1024×768.. kalo lebih dari itu lagi bagus… Sbbnya ia nampak stable & reasonable bila dalam screen yg berlainan, susunan graphic table tak lari, imej tak senget atau cacat dalam reso yg berlainan.. Ia juga satu cabaran buat kita bina web yang bebetul ideal dgn byk browser & resolution.
5. Navigasi button yg tersusun & elakkan typing error
Masa design web pastikan konsep navigation button anda telah disusunkemas mengikut keperluan page… Contoh konsep navigation button ada 3 jenis bagi saya yg boleh diikuti…
a. Link text biasa : Mcm di Softhands Community menu nya link text di kanan dan kiri web
b. Link image : Mcm di PIDS 2003-2004 ada navigation button image.
c. hierarchy menu : Mcm di RahsiaEbiz ada turunan link button guna js & xhtml di bahagian top menu
Konsep navigation button ni penting sekiranya anda ada byk link page yg perlu dicombine dalam satu website.. Buat ia jelas dan tak mengelirukan. Kemudian elakkan typing error krn ia akan menyusahkan user….
6. Optimize Graphic & HTML anda.
Ni taktik yg saya slalu buat bagi nak melajukan web anda walau ada kandungan graphic berat dan html yg banyak… Pertamanya optimize dgn graphic optimizer yg ada di dalam photoshop bagi format jpeg atau GIF.. jpeg lebih sesuai utk pic/photo yang kompleks, gif pula utk imej yg simple ada 2/3 colour utama, logo dan lelain yang tidak kompleks… Dalam photoshop ada fungsi Save For Web (Alt+Ctrl+Shift+S) kite leh optimize mengikut kualiti rendah, sederhana atau tinggi… biasanya saya buat sederhana/rendah bila imej tu kurang penting. Dgn ini ia kecil size dan cpt loading.
HTML Optimizer pula boleh dicompresskan coding html jadi satu line atau beberapa kecil krn ia buang tag yg tak diperlukan. Anda boleh guna Absolute HTML Compressor utk optimizekan HTML tag anda. contoh web yang saya telah optimizekan tag html dia ialah di YPEIM .. sila lihat source code dia utk lihat kelainan…. terlalu compress dan padat …. mmg mana2 web client saya suka compress HTML,biar ia kecil dan bley load faster…
7. Keep learning….
ada byk lagi tips… tapi saya maybe tak dapat senaraikan semuanya, but boleh teruskan pembelajaran dan pertanyaan jika ada… bagi yg nak tahu tips2 design bley download free ebook ttg tutorial web design di sini…. 100 Do’s and Don’ts in Web Design
—————————————————————————————————————————-
Artikel ini disediakan oleh webmaster Softhands Creative Studio iaitu saudara Mohd Nuur Fahmy Bin Massailan yang telah berpengalaman selama 9 tahun di dalam arena web development dan kini sedang melebarkan perniagaannya di internet melalui Portal RahsiaEbiz & EbookJutawan serta yang terbaru network marketing business di JomBuatDuit.Net. Lebih daripada 100 karya web dihasilkan oleh beliau sepanjang bergelumang dalam arena web ini serta sudah mempunyai produk sendiri yang berkualiti untuk manfaat & faedah rakyat Malaysia.
p/s: Jangan lupa dapatkan 5 jenis ebook percuma karya beliau di web rahsiaebiz yang telah banyak kali didownload sejak ia dilancarkan.
—————————————————————————————————————————-
Terima Kasih Kerana Membaca & Salam Suksess!
Zolkie Baki aka abgzol
Follow Me on Twitter: http://twitter.com/abgzol
Add Me on Facebook: http://www.facebook.com/abgzol
Popularity: 75% [?]

















