Mereka laman web tidaklah suatu perkara yang mudah, namun ianya cepat dan seronok dipelajari.  Artikel ini saya tidak mengajar anda bagaimana untuk membuat website kerana saya anggap anda sudah biasa dengannya.

Untuk merancang sesebuah laman web, anda perlu mengambil kira banyak perkara sebelum merancang membina sesebuah laman web. Di bawah ini saya berikan beberapa tips penting dan bermanfaat untuk merancang sebuah laman web yang berkesan dan berkualiti tinggi.

Seseorang web designer mestilah fokus kepada keperluan pengguna pada setiap masa iaitu:-

1. Kebolehan pengunaan (usability);
2. Kebolehaksesan (accesibility);
3. Pengalaman pengguna (user-experience);
4. Interaksi pengguna (user interaction).

Link Navigation Yang Hidup, Jelas & Mudah

Kedudukan link navigation dalam website anda memainkan peranan besar dalam memberikan pengalaman pengguna (user experience) kepada pelawat anda. Struktur navigasi anda harus rapi, konsisten dan mudah diakses untuk pengalaman pengguna yang optimum tanpa gangguan atau kepayahan. Ianya harus cukup fleksibel untuk menempatkan setiap jumlah link tambahan yang diperlukan.

Design dan Layout Yang Bersih & Konsisten

Sebuah layout yang bersih yang menggunakan banyak ruang putih meningkatkan penampilan halaman dan tulisan. Elakkan dari membuat caca-merba, segala apa ada dimasukkan tanpa mengira konsep warna yang tertentu.  Gunakan font yang dah tersedia ada pada semua komputer untuk mengelakkan laman anda nampak tidak konsisten.

Menggunakan Kod CSS

Laman web menggunakan CSS menawarkan kepelbagaian penggunaan seperti float dan tableless design (tidak menggunakan table). Ia juga dapat mengurangkan saiz fail selain dari memberikan kawalan yang lebih besar paparan laman web anda.

Optimalkan Load Time

Pastikan laman web anda dapat dibuka dengan cepat dan dapat diaksses dari internet berkelajuan rendah kerana ia adalah faktor accessibility yang kita bincangkan di atas. Anda perlu:

1. Kurangkan saiz dan bilangan imej, flash dan script.
2. Optimalkan HTML & kod script: Pastikan bahawa laman anda tidak mempunyai tag script yang tidak diingini atau tidak dipakai.
3. Mengurangkan CSS dan kod JS – membuang semua ruang kosong, dan komen yang tak digunakan dari CSS dan file javascript.

Pastikan Saiz dan Resolusi Web Boleh Berubah

Kepesatan teknologi konfigurasi komputer & monitor terus meningkat dan pelbagai, tidak mungkin untuk anda menguji laman anda dalam semua saiz skrin dan platform pengguna. Pastikan kod dan desgin anda scalable (boleh ubah). Dengan ini pengguna tidak perlu menggunakan horizontal scroll bar apabila menggunakan saiz screen yang lebih kecil.

Buatlah Cross Browser Compatible

Pastikan anda periksa website anda pada pelbagai  browser terutama sekali pada yang paling kerap digunakan oleh pengguna seperti Google Chrome, Internet Explorer, Mozilla Firefox, Opera dan Safari.

Saya harap dengan tips yang ringkas ini dapat membantu anda membina web yang lebih efektif. Selamat berjaya!

Selepas seminggu sibuk menyiapkan order dari customer untuk khidmat design saya, semalam secara tiba-tiba saya diberikan ilham untuk membuat WordPress theme free. Saya mengambil masa selama 1 malam bersengkang mata untuk menyiapkannya layout design theme ini sebelum dimasukkan ke proses coding XHTML dan CSS.

Progress sekarang 60% dan saya jangkakan ianya akan siap dalam jangkamasa 1-2 minggu lagi untuk dilancarkan. Theme ini masih belum diberikan nama jadi dikesempatan ini, saya ingin memberi laluan kepada anda untuk mencadangkan nama theme ini.

Sila cadangkan nama theme di ruang komen post ini dan nantikan kemunculan nama theme yang anda berikan. Bangga tak?

Dikesempatan ini juga, saya ingin membuat pengumuman mengenai servis untuk design minisite (design layout sahaja-tiada content). Dibahagian page service saya tiada quotation untuk minisite mahupun portfolio saya.

Berikan saya ruang masa untuk update portfolio dan quotation minisite dalam masa terdekat ini. Harga untuk sebuah minisite adalah seperti berikut:-

• Pembayaran melalui Maybank2u: RM 250.00
• Pembayaran melalui Paypal: USD 90.00

Sila ke Service Page Azman untuk order.

p/s: Pemilihan nama theme cadangan anda adalah berdasarkan pertimbangan saya dari segi kesesuaian konsep dan temanya.

Untuk membuka PANTONE Process Colour Library dari Adobe Illustrator anda, klik ke:

Window > Swatch Libraries > PANTONE Process Coated

Untuk membuka PANTONE Process Colour Library dari Adobe Photoshop anda, klik ke:
Window > Swatches
dan klik pada arrow seperti dalam screenshot dibawah:

Baiklah sekarang anda sudah berpeluang membuat pilihan kombinasi warna dengan baik tetapi jangan lupa yang semua warna PANTONE tersebut mestilah di convert kan kembali ke warna profile gambar anda (terutamanya bagi penggunaan Illustrator). Ini penting supaya tiada conflict colour bila keluarnya output nanti, jikalau anda ingin print menggunakan printer CYMK maka convertkan colour-colour tersebut ke dalam CYMK atau jika anda ingin publish ke website maka convert kan ke dalam RGB.

Selain dari menggunakan swatch, anda juga boleh membuat pilihan menggunakan colour scheme generator secara percuma di internet. Antara website-website yang menyediakan service ini adalah:-

• [ws] Color Scheme Generator
• Color Palette Generator
• ColorSchemer
• ColorJack: Color Generator

Ok, selamat mencuba!