Desain Website Dasar Untuk Mengembangkan Website Profesional

0

Desain website yang cantik dan unik sering kali bisa menarik perhatian banyak orang dan berpotensi orang terus mengunjungi website anda.Dengan website pun bisa menjadi media promosi sekaligus menjadi blog.Di jaman sekarang ini membuat website menjadi sangat mudah dan tanpa dasar yang kuat sekalipun semua orang bisa membuat yang namanya website.Terserah mau website pribadi atau keperluan lain.Nah di artikel ini akan diberitahukan dasar – dasar / pondasi dasar desain website kok bisa seperti ini itu asalnya darimana.Baik langsung saja simak dan langsung praktekkan setelah selesai membaca artikel

  1. Ide website, membuat sitemap website
    Yang pertama kita harus tau website yang mau dibuat mempunyai berapa halaman.Dengan sitemap kita jadi lebih tau gambaran website kita secara garis besar berisi halaman apa saja.
    Berikut contoh sitemap :

    • Perusahaan Keren
      • Home
      • Blog
      • About
      • Gallery
      • Contact Us
  2. Membuat Sketsa atau Wireframe Website
    Yang kedua kita mulai gambarkan secara kasar kerangka websitenya.Misal di sitemap diatas ada halaman gallery, nah digallery ini tampilan websitenya seperti apa.Berikut contoh wireframe atau biasa disebut layout ini :wireframe web
  3. Memvisualisasikan Website
    Setelah selesai membuat kerangka website, langkah selanjutnya yaitu mengimplementasikannya dalam bentuk desain yang sebenarnya.Software yang biasa dipakai bisa aplikasi pengedit gambar seperti Adobe Photoshop, Gimp, Inkscape, Adobe Illustrator, dan lainnya.
  4. Coding
    Setelah selesai membuat kerangka website, langkah selanjutnya yaitu mengimplementasikannya dalam bentuk kode HTML & CSS sebagai pemanisnya.Pada tahap ini biasanya menggunakan yang namanya HTM & CSS Framework atau Front – End Framework.Alasan menggunakan framework ini biasanya karena memudahkan pengimplementasian dan tidak membuat kode dari awal dan lebih stabil karena sudah di tes oleh para developer di dunia.Contoh framework bisa Bootstrap, Materialize, Semantic UI, dan lain – lain.Bisa langsung dicari dengan keyword diatas.

  5. Testing meliputi Browser, Responsive Design
    Lalu saat sudah selesai semua, langkah yang terakhir adalah melakukan testing dengan cara mencoba membuka website dengan berbagai browser dan berbagai device.Untuk device, tidak harus benar – benar mencobanya dengan tablet, smartphone, ipad, atau sebagainya karena browser sekarang sudah menyediakan fitur Responsive Design Test.Jika menggunakan Chrome bisa membukanya dengan menekan tombol F12 lalu tekan CTRL + SHIFT + M.Untuk Firefox juga sama seperti di Chrome.

Demikian tahapan yang sering dilakukan untuk mendesain website.Walaupun sekarang banyak software / tools yang langsung bisa menciptakan sebuah website seutuhnya ( baca : website builder ), bagi developer paling tidak harus tetap mengerti dasar ini karena akan bermanfaat jika ingin mendesain website custom dari nol.

LEAVE A REPLY