Ask Bagaimana cara memulai belajar web desain , Berikut ini adalah langkah-langkah untuk memulainya AdityaDees

Menjadi seorang web desain sebenarnya tidak terlalu sulit, apa lagi itu di barengi dengan niat dan menyukai apa yang anda pelajari. Tentu itu merupakan langkah yang sangat baik untuk memulai belajar.

Dalam artikel ini penulis mencoba menyusun daftar tahapan dasar-dasar untuk belajar web desain. jika anda menyukainya ikuti langkah-langkahnya sampai akhir artikel.

Pengertian web desain

Web desain merupakan sebagian dari seni yang memanfaatkan sisi kreatifitas dan pikiran seseorang yang di implementasikan terhadap suatu program.

Desainer web mengambil apa yang konseptual dan menerjemahkannya ke dalam visual, gambar, tipografi, warna, teks, ruang negatif, dan struktur bersatu pada untuk tidak hanya menawarkan pengalaman pengguna tetapi juga saluran untuk mengkomunikasikan ide.

Seorang desainer web yang baik memahami pentingnya setiap bagian dari sebuah desain. Mereka membuat pilihan pada tingkat granular, menata setiap elemen, sementara tidak pernah melupakan bagaimana elemen akan bersatu dan berfungsi dalam mewujudkan tujuan desain yang lebih besar.

Logika perlu memandu pengaturan ide dan visual pada setiap halaman, serta mengarahkan bagaimana pengguna akan melakukan perjalanan melaluinya.

Desain web dapat dipecah menjadi beberapa subdisiplin. Beberapa desainer berkarier dengan spesialisasi di bidang-bidang seperti UI, UX, SEO, dan bidang keahlian lainnya. Saat Anda memulai perjalanan Anda sebagai seorang desainer, Anda harus tahu sedikit tentang semua aspek berbeda dari desain web ini.

Backend dan Frontend

Pasti ketika anda belajar web desain tidak akan asing dengan istilah ini nantinya, karena akan sangat dekat dengan lingkungan anda belajar. Anda harus benar-benar memahami perbedaan ini, karena Kebanyakan pemula mencampuradukkan dua hal yang tentu berbeda antara Bakcend dan Frontend.

1. Pengertian Backend

Back end adalah segala sesuatu yang berjalan di belakang layar dalam menampilkan sebuah website. Situs web berada di server. Misalnya, Ketika pengguna membuat permintaan seperti menavigasi ke bagian tertentu dari sebuah situs web. Lalu server mengambil informasi yang masuk ini dan pada gilirannya menembakkan semua HTML dan kode lainnya sehingga ditampilkan di browser pengguna dengan benar. Kemudian Server meng-host atau mengeksekusi data yang dibutuhkan situs web untuk berfungsi.

Pengembang web yang berspesialisasi dalam pengembangan back-end sering kali adalah pemrogram yang bekerja dalam bahasa seperti PHP, mungkin menggunakan kerangka kerja Python seperti Django, menulis kode Java, mengelola basis data SQL, atau menggunakan bahasa atau kerangka kerja lain dalam memastikan bahwa server, aplikasi, dan database melakukan konektivitas dalam bekerja sama.

Untuk menjadi seorang web designer, Anda tidak perlu belajar terlalu dalam tentang apa yang terjadi di belakang, tetapi setidaknya Anda harus memahami tujuannya. Karena nantinya, mungkin kalian akan sering terlibat dalam suatu project kerjasama.

2. Penjelasan Frontend

Jika bagian belakang merupakan Backend, maka bagian depan interface atau antarmuka dengan pengguna merupakan Frontend. Bagian depan ini tempatnya HTML, CSS, JavaScript, dan kode lainnya bekerja sama untuk menampilkan situs web. Ini adalah bagian dari desain web yang melibatkan banyak kerjasama.

Saat Anda memiliki kemajuan dalam karir Anda, Anda mungkin menjelajah ke area pengembangan web yang lebih khusus. Yang pada akhirny Anda mungkin menggunakan dengan kerangka kerja seperti React atau Bootstrap atau masuk lebih dalam dengan JavaScript atau jQuery. Ini adalah area yang lebih maju yang tidak perlu Anda khawatirkan terlalu banyak di awal.

Bagaimana tugas Web desain

Foto oleh Christina Morillo

Jadi, ketika seorang desainer web diberikan tujuan akhir seperti membuat halaman web yang memiliki header ini, font ini, warna ini, gambar ini, dan unicorn animasi berjalan melintasi layar saat pengguna mengklik tombol ini.

Tugas desainer web adalah mengambil ide besar itu dan memecahnya menjadi potongan-potongan kecil, dan kemudian menerjemahkan potongan-potongan ini menjadi instruksi yang dapat dipahami komputer -- termasuk meletakkan semua instruksi ini dalam urutan atau sintaks yang benar.

Setiap halaman di web yang Anda kunjungi dibuat menggunakan urutan instruksi terpisah, satu demi satu. Peramban Anda (Chrome, Firefox, Safari, dan sebagainya) adalah aktor besar dalam menerjemahkan kode menjadi sesuatu yang dapat kita lihat di layar kita dan bahkan berinteraksi dengannya.

HTML dan CSS sebenarnya bukan bahasa pemrograman secara teknis; itu hanya struktur halaman dan informasi gaya. Tetapi sebelum beralih ke JavaScript dan bahasa sebenarnya lainnya, Anda perlu mengetahui dasar-dasar HTML dan CSS, karena keduanya ada di ujung depan setiap halaman web dan aplikasi.

Fungsi HTML, CSS, Javascript dalam web desain

HTML : menyediakan struktur dasar situs, yang ditingkatkan dan dimodifikasi oleh teknologi lain seperti CSS dan JavaScript.

CSS : CSS digunakan untuk mengontrol presentasi, pemformatan, dan tata letak .

Javascript : digunakan untuk mengontrol perilaku elemen yang berbeda.

Kenali Web Visual yang menarik

Meskipun terlihat mudah dalam pelaksanaanya,hal yang terpenting adalah pahami cara kerja desain visualnya. Ketahui aturan komposisi dan pahami bagaimana elemen seperti bentuk, ruang, warna, dan geometri bersatu yang menghasilkan sesuatu yang menarik yang meningkatkan pengalaman pengguna.

Titik awal yang bagus adalah Mempelajari konsep-konsep seperti reifikasi, kemunculan, dan invarian akan memungkinkan Anda untuk memasukkan prinsip-prinsip ini ke dalam pekerjaan Anda.

Prinsip-prinsip visual web desain

Jika anda telah siap untuk membuat desain menarik yang mewakili merek Anda, Terapkan prinsip desain visual dasar sederhana ini.

Saat Anda menjalankan suite pengeditan atau meletakkan pena di atas kertas, setiap desain visual yang Anda gunakan menciptakan kesatuan di antara elemen yang berbeda atau secara kreatif meningkatkan kesatuan itu untuk mendorong suatu tindakan.

Prinsip desain visual membantu kita memahami komposisi visual. Prinsip dasar desain meliputi:

• Ruang : Dalam desain web, ini sering disebut sebagai "ruang putih", atau area antar elemen.
• Hirarki : Pentingnya beberapa elemen dalam kaitannya dengan yang lain.
• Kontras : Bagaimana elemen yang berbeda dapat menciptakan komposisi yang lebih kohesif.
• Skala/Proporsi : Hubungan antara ukuran elemen.

Sementara prinsip-prinsip ini dikembangkan bersama seni visual, desainer web menerapkan prinsip-prinsip desain yang dibangun dari ide-ide inti ini.

Cara belajar web desain

1. Memahami konsep kunci desain visual

Garis : Setiap huruf, batas, dan pembagian dalam tata letak terdiri dari garis-garis yang membentuk strukturnya yang lebih besar. Mempelajari desain web berarti memahami penerapan garis dalam menciptakan keteraturan dan keseimbangan dalam suatu tata letak.

Bentuk : Tiga bentuk dasar dalam desain visual adalah persegi, lingkaran, dan segitiga. Kotak dan persegi panjang berfungsi untuk blok konten, lingkaran berfungsi untuk tombol, dan segitiga sering digunakan untuk ikon yang menyertai pesan penting atau ajakan bertindak.

Tekstur : Tekstur mereplikasi sesuatu di dunia nyata. Melalui tekstur, kita mendapatkan gambaran apakah sesuatu itu kasar atau halus. Tekstur dapat dilihat di seluruh desain web.

Dari latar belakang seperti kertas hingga gumpalan warna-warni dari Gaussian blur, perhatikan berbagai jenis tekstur yang dapat membuat desain Anda lebih menarik dan dapat memberi kesan fisik.

Warna : Untuk membuat desain yang tidak melelahkan mata, Anda harus mendidik diri sendiri dalam teori warna. Memahami roda warna, warna pelengkap, warna kontras, dan emosi yang terkait dengan warna berbeda akan membuat Anda menjadi desainer web yang lebih baik.

kisi-kisi Grid berakar pada hari-hari awal desain grafis. Mereka berfungsi sangat baik dalam menertibkan gambar, teks, dan elemen lain dalam desain web. Pelajari cara menyusun tata letak web Anda menggunakan kisi.

2. Mengerti dasar-dasar HTML

Hypertext markup language (HTML) memberikan arahan tentang bagaimana konten, gambar, navigasi, dan elemen lain dari situs web ditampilkan di browser web/blog seseorang.

Meskipun Anda tidak perlu menjadi ahli dalam HTML, namun tetap membantu untuk mengetahui cara kerjanya, seperti yang anda lihat di blog sederhana WQ, menggunakan Html .

Tag HTML adalah instruksi yang digunakan browser untuk membuat situs web. Judul, paragraf, tautan, dan gambar semuanya dikendalikan oleh tag ini.

Anda terutama ingin mengetahui bagaimana tag header seperti tag H1, H2, dan H3 digunakan untuk hierarki konten. Selain memengaruhi struktur tata letak, tag tajuk penting dalam cara perayap web mengklasifikasikan desain dan memengaruhi cara mereka muncul di peringkat penelusuran organik.

3. Pahami CSS

CSS (atau cascading style sheets) menyediakan gaya dan instruksi tambahan tentang bagaimana elemen HTML akan muncul. Melakukan hal-hal seperti menerapkan font, menambahkan padding, menyetel perataan, memilih warna, dan bahkan membuat kisi semua dimungkinkan melalui CSS.

intinya CSS merupakan baju untuk sebuah web/blog. Mengetahui cara kerja CSS akan memberi Anda keterampilan untuk membuat situs web yang terlihat unik dan menyesuaikan template yang ada.

4. Biasakan diri anda dengan UI

Sama seperti tombol dan mekanisme lain di dunia nyata yang memungkinkan seseorang untuk berinteraksi dengan mesin, elemen antarmuka pengguna di situs web memungkinkan seseorang untuk melakukan tindakan.

Mari kita tinjau dua prinsip utama UI: desain intuitif dan kesederhanaan :

1. Cara membuat antarmuka intuitif

Berinteraksi dan terlibat dengan situs web harus konsisten dan mengikuti pola yang berulang. Orang yang membuka situs web harus segera memahami sistem yang ada dalam menavigasinya.

2. Jadikan UI sesimple mungkin

UI ada untuk mengoptimalkan kegunaan. Ini berarti membuat kontrol mudah digunakan, serta jelas fungsinya. Baik Anda meminimalkan jumlah opsi navigasi, mempercepat proses checkout, atau mengintegrasikan elemen interaktif lain yang meningkatkan aksesibilitas, memahami UI akan membantu Anda menyederhanakan pengalaman seseorang dalam berinteraksi dengan situs web.

5. Memahami dasar-dasar tata letak

Mengetahui pola desain akan membantu Anda membuat situs web yang memiliki aliran konten dan visual yang lancar. Dua pola tata letak web umum yang perlu Anda ketahui adalah pola-Z dan pola-F.

1. Z-pola : Untuk tata letak dengan penghematan kata dan gambar serta ruang negatif dalam jumlah besar, pola-Z merupakan cara yang efisien untuk menjelajahi situs web. Saat Anda mulai memperhatikan ke mana mata Anda melihat sebuah desain, Anda akan langsung mengenali ketika pola-Z ada di tempatnya.

2. F-pola : Desain berat pada teks, seperti untuk publikasi online atau blog, sering mengikuti pola-F yang berbeda. Di sisi kiri layar, Anda akan melihat daftar artikel atau posting, dan di badan utama halaman, Anda akan melihat deretan informasi terkait. Pola ini dioptimalkan untuk memberi orang semua informasi yang mereka butuhkan, bahkan jika mereka dengan cepat melihatnya.

6. Pelajari tentang tipografi

Font dapat memberikan nada atau emosi yang berbeda serta memengaruhi keterbacaan. Jika Anda belajar tentang desain web, mengetahui cara menggunakan tipografi sangat penting.

Tipografi melayani beberapa tujuan dalam desain web. Pertama, ini melayani tujuan utilitarian untuk membuat konten dapat dibaca. Tapi itu juga bisa berfungsi sebagai dekorasi, dan penggunaan tipografi bergaya dapat menambah estetika keseluruhan.

Berikut adalah tiga konsep dasar tipografi yang harus Anda ketahui :

• Serif : Jenis huruf serif memiliki garis sangat kecil yang dikenal sebagai serif yang menghiasi setiap huruf. Gaya tipografi ini dapat ditelusuri kembali ke cetakan.
• Sans-serif : Seperti namanya, tipografi sans serif tidak memiliki garis pengidentifikasi dari tipografi serif. Jenis huruf ini ditemukan melalui ranah digital situs web dan aplikasi.
• Display : Tampilan tipografi sering digunakan untuk tajuk utama dan bisa besar dan berdampak atau dibuat dari garis tipis dan tajam. Mereka biasanya memiliki bentuk huruf yang canggih dan dimaksudkan untuk menarik perhatian seseorang.

7. Ide dan gagasan anda

Anda dapat menonton tutorial, membaca posting blog, mendaftar di kursus online, dan menyerap semua teori dan informasi yang Anda dapat tentang desain web, tetapi satu-satunya cara untuk menjadi desainer web adalah dengan mulai mendesain web. Dan imolementasikan semua ide anda dalam webdesaign.

8. Dapatkan mentor belajar

Mentor sangat berharga karena mereka pernah berada di tempat Anda berada — pada awalnya — dan memiliki keinginan untuk membantu Anda melalui pelajaran yang diperoleh dengan susah payah yang telah mereka pelajari.

Mereka memiliki keahlian dan pengetahuan yang dalam. Mereka adalah sumber yang bagus untuk mendapatkan umpan balik tentang pekerjaan Anda dan menemukan apa yang Anda lakukan dengan benar dan apa yang perlu ditingkatkan.

9. Pelajari dasar UX

UX adalah keajaiban yang menghidupkan situs web, mengubahnya dari susunan elemen statis menjadi sesuatu yang melibatkan emosi seseorang yang menelusurinya.
Skema warna, konten, tipografi, tata letak, dan visual semuanya bersatu untuk melayani audiens Anda. Desain pengalaman pengguna adalah tentang presisi dan membangkitkan perasaan.

Ini menawarkan seseorang tidak hanya perjalanan yang mulus tetapi juga pengalaman yang menghubungkan mereka dengan entitas atau merek di balik desain web.

Berikut ini adalah prinsip UX :

• User personas
• Information architecture
• User flows
• Wireframes

10. Pelajari Javascript

JavaScript adalah bahasa pemrograman berbasis logika yang dapat digunakan untuk memodifikasi konten situs web dan membuatnya berperilaku dengan cara yang berbeda dalam menanggapi tindakan pengguna.

Mempelajari Javascript untuk web desagn tidak ada ruginya, justru ini sangat membantu tugas anda dalam membuat web desain bila di perlukan bisa menjadi solusi.

Yang memungkinkan pengembang web mendesain situs interaktif. Menurut pribadi belajar webdesaign HTML,CSS,Javascript sudah sepaket komplit.

Sebagian besar perilaku dinamis yang akan Anda lihat di halaman web adalah berkat JavaScript, yang menambah kontrol dan perilaku default browser.

Demikan langkah-langkah untuk memulai belajar webdesaign. Tentu saja, begitu banyak yang dibutuhkan untuk membuat desain web yang bagus.

Mempelajari dasar-dasar di balik desain visual, dasar-dasar UI dan UX, dan mengetahui bagaimana fungsi ujung depan dan ujung belakang akan menjadikan Anda seorang desainer yang lebih berpengetahuan luas.