Bagaimana cara membuat desain situs web?

Setiap pemilik situs memimpikan desain unik untuk sumber dayanya. Semua orang tahu bahwa seseorang dipenuhi oleh pakaian. Hal yang sama berlaku untuk situs, ketika pengunjung pertama kali menarik perhatian pada desain proyek, dan kemudian ke konten. Jika desainnya terlalu cerah atau, sebaliknya, membosankan, pengguna akan segera meninggalkan sumber dayanya. Jangan memenuhi sampai melimpahi situs web dengan elemen yang tidak perlu, karena sumber daya web dengan desain minimalis sering terlihat jauh lebih menarik. Cara membuat desain situs web?

Bahkan, seluruh proses desain dapat dibagi menjadi tiga tahap: membuat sketsa, membuat tata letak dalam editor grafis, desain tata letak. Sebuah sketsa desain dapat dibuat dalam editor foto sederhana atau dengan pensil biasa di selembar kertas. Adapun tata letak, sebagian besar desainer menggunakan Photoshop sebagai editor grafis paling kuat dari yang sudah ada. Untuk desain tata letak, Anda perlu pengetahuan tentang bahasa markup hypertext dan CSS. Sebelum membuat desain Anda sendiri, tanyakan pada diri sendiri beberapa pertanyaan sederhana: apakah saya tahu HTML dan CSS, dan juga dapatkah saya bekerja dengan editor grafis?

Jika Anda menjawab secara negatif, maka proses pembuatan desain tidak akan melampaui tahap pertama. Mudah menggambar sketsa, tetapi tidak setiap pengguna dapat membuat tata letak dan membuat desain yang sudah jadi. Sebagai hasilnya, disarankan untuk memulai dengan mempelajari dasar-dasar HTML | CSS, serta menonton beberapa video pelatihan tentang Photoshop, untuk mengetahui di mana setiap alat berada, bagaimana menerapkan filter, dan banyak lagi.

Sebelum Anda mulai membuat sketsa, buat gambar desain masa depan di kepala Anda. Harap dicatat bahwa desain apa pun terdiri dari bagian-bagian berikut:

  • "Header" situs adalah bagian atas dari setiap desain, yang meliputi, sebagai aturan, logo, nama situs dan beberapa tombol (kontak, tentang penulis). Tutup dapat memiliki ketinggian yang berbeda, tetapi biasanya parameter ini tidak melebihi 300 piksel. Seringkali di bagian atas situs terdapat formulir pencarian dan spanduk iklan.

  • Bilah samping - menu samping situs. Informasi sekunder dan elemen tambahan ditempatkan di bilah sisi: blok dengan artikel baru, formulir pencarian, berbagai jajak pendapat dan kalender, tautan, iklan, elemen navigasi pada sumber daya. Beberapa sidebar dapat digunakan dalam desain situs, tetapi ada juga desain tanpa kolom samping.
  • "Basement" adalah bagian bawah situs. Biasanya berisi tautan ke sumber daya utama dan hak cipta dengan gaya "(c) 2014 situs terbaik." Tetapi dalam beberapa tahun terakhir, konsep bagian "basement" dari desain telah berubah dengan munculnya perangkat mobile. Di "ruang bawah tanah" elemen mulai mengendap, yang biasanya ditempatkan di sidebar.

  • "Bagian utama" adalah blok tempat konten utama ditempatkan. Sebagian besar desainer menempatkan bagian utama situs di tengah, sehingga lebih nyaman untuk membaca materi.

Jadi, sekarang Anda tahu dari apa blok situs itu terdiri. Saatnya untuk mulai memecahkan masalah bagaimana membuat desain situs web sendiri. Buka editor foto paling sederhana (Paint is enough) dan buat templat baru dengan resolusi 1280 × 1024. Patut diingat bahwa saat membuat pengukuran metrik situs tidak digunakan. Semua blok "diukur" dalam piksel.

Iklan

Misalnya, Anda memutuskan untuk membuat sketsa dengan satu bilah sisi. Tandai batas-batas ruang bawah tanah, judul situs dan sidebar di editor grafis.

Apakah Anda punya ide untuk membuat beberapa kolom samping dan menempatkan konten di tengah? Hebat, tetapi ketika menandai, pertimbangkan lebar bilah samping dan ruang untuk konten utama. Kolom samping tidak boleh terlalu lebar (tidak lebih dari 300 piksel), dan setidaknya 500 piksel harus dibiarkan di bawah konten utama, jika tidak, teks tidak akan nyaman untuk dibaca.

Ketika tag utama diberi jarak, saatnya untuk melengkapi sketsa desain dengan elemen. Tambahkan hak cipta di ruang bawah tanah, blok dengan formulir pencarian, judul, dll. Sketsa desain akan mengambil tampilan yang lebih menarik dan tidak akan menjadi satu set bentuk geometris..

Jika Anda telah belajar bekerja di Photoshop, maka inilah saatnya untuk mengubah sketsa menjadi tata letak. Tetapi sebelum itu, tentukan warna situs. Untuk situs berita, warna latar belakang putih, warna teks hitam, dan warna tautan biru lebih cocok. Jika desainnya dibuat untuk situs tema wanita atau wisata, maka gunakan warna yang lebih cerah. Pada saat yang sama, Anda tidak boleh membuat pohon Natal dari desain, karena banyaknya warna mengganggu persepsi konten utama.

Mulailah mengisi setiap blok tata letak dengan grafik. Bereksperimen dengan warna dan latar belakang, buat elemen dan tombol Anda sendiri. Namun, di Internet ada sejumlah besar latar belakang yang berbeda, tombol untuk membuat desain.

Ketika tata letak akhirnya siap, potong menjadi balok dan buat desain dari itu. Pada saat yang sama, tandatangani setiap lapisan sehingga lebih mudah untuk dikenakan.

Dengan munculnya perangkat mobile, popularitas desain karet responsif telah tumbuh. Setiap pengguna dapat membuat tema untuk situsnya, tetapi hanya desainer asli yang dapat menyesuaikannya dengan semua perangkat. Pada awal "karier" desain Anda, cobalah untuk memulai dengan templat sederhana.

Ingat tiga aturan sederhana untuk "desain hebat":

  • teks harus dapat dibaca dengan baik bahkan ketika gambar dinonaktifkan di browser;
  • cobalah untuk tidak menggunakan warna vyrviglaznye;
  • buat navigasi situs yang nyaman.

Setelah membuat desain dan mentransfernya ke situs, pastikan untuk mengujinya di berbagai browser. Menarik teman dan kenalan untuk diuji, karena kritik orang lain memiliki efek positif pada orang tersebut. Ingat aturan dasar: desain situs harus disukai tidak hanya oleh Anda, tetapi juga oleh pengguna lain. Karena itu, selalu dengarkan pendapat pengunjung untuk proyek Anda..