Jadi, Anda telah memutuskan akhirnya saatnya untuk meluncurkan situs web untuk memamerkan keterampilan profesional Anda atau keramaian sisi Anda. Sebagai persiapan, Anda menangkap domain yang sempurna, mendaftar untuk layanan pembuatan situs web, memilih templat yang tepat, dan menyusun beberapa salinan pemenang penghargaan untuk dibuang di sana. Dan sekarang Anda sedang menatap situs web Anda yang besar, indah, dan kosong . Penekanan pada bagian yang kosong.
Terlepas dari betapa mudahnya begitu banyak platform online membuat membangun situs web hari ini, menatap halaman kosong mungkin masih membuat kepala Anda berputar. Lagi pula, masih ada beberapa hal yang harus Anda pahami - seperti foto mana yang harus dimasukkan dan bagaimana cara menata halaman - dan jika Anda tidak memiliki banyak pengetahuan desain web, prosesnya mungkin tampak sangat mengintimidasi.
Kami di sini untuk memberi tahu Anda bahwa Anda memiliki ini. Untuk membuat menarik situs web yang indah menjadi mudah, kami datang dengan toolkit utama yang akan memandu Anda melalui semua elemen yang Anda perlukan untuk membuat situs Anda aktif dan berjalan, bersama dengan program favorit kami dan kiat pro untuk membuatnya luar biasa.
1. Gambar
![](http://i.go-travels.com/img/advice/839/here-s-how-design-brag-worthy-website.jpg width=780 />
<p>Anda pasti pernah mendengar pepatah, "gambar bernilai ribuan kata." Ini berdering terutama ketika datang ke konten digital; semakin banyak yang dapat Anda sampaikan melalui citra yang menarik, semakin sedikit teks yang perlu Anda gunakan untuk menggambarkan apa yang ingin Anda katakan atau jual.</p>
<center>
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1427824399252755" crossorigin="anonymous"></script>
<ins class="adsbygoogle" style="display:inline-block;width:580px;height:400px" data-ad-client="ca-pub-1427824399252755" data-ad-slot="3871104749"></ins>
<script>(adsbygoogle=window.adsbygoogle||[]).push({});</script>
</center><p>Mulailah dengan memikirkan diri sendiri dan pekerjaan Anda. Apakah Anda memiliki foto profesional yang dapat Anda gunakan? Jika tidak, cari teman dan coba tangan Anda sendiri, atau pertimbangkan untuk mempekerjakan seorang profesional. Apakah Anda memiliki foto atau tangkapan layar dari pekerjaan yang Anda lakukan di masa lalu? Kumpulkan mereka. Bagaimana dengan foto yang Anda sukai dan telah dibagikan di Instagram yang mewakili pekerjaan atau kepribadian Anda? Pilih beberapa favorit Anda.</p>
<p>Jika Anda membutuhkan pengisi, stok gambar adalah cara untuk pergi. Unsplash dan StockSnap.io adalah beberapa opsi bebas atribusi favorit kami (artinya Anda dapat menggunakannya secara gratis sesuai dengan isi hati Anda). Jika Anda tidak menemukan yang Anda cari, Anda dapat mempertimbangkan untuk membayar satu atau dua foto yang sempurna. Ada banyak pilihan di luar sana, dari situs gambar stok besar seperti Getty Images - yang memiliki integrasi dengan Squarespace menawarkan $ 10 gambar kepada orang-orang yang membeli melalui situs tersebut - ke operasi yang lebih kecil seperti Stocksy dan Twenty20 di mana biayanya biasanya sekitar $ 10- $ 25 per gambar.</p>
<center>
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1427824399252755" crossorigin="anonymous"></script>
<ins class="adsbygoogle" style="display:block" data-ad-client="ca-pub-1427824399252755" data-ad-slot="4175470618" data-ad-format="auto"
data-full-width-responsive="true"></ins>
<script>(adsbygoogle=window.adsbygoogle||[]).push({});</script>
</center><p>Saat memilih foto-foto ini, pikirkan citra yang mencerminkan kepribadian Anda atau hal-hal yang Anda lakukan setiap hari. Apakah Anda, seperti kebanyakan dari kita, duduk di meja sepanjang hari? Cari foto meja yang sesuai dengan kepribadian Anda. Apakah pekerjaan utama Anda melibatkan orang? Cari bidikan yang memperlihatkan kelompok yang berkolaborasi. Apakah Anda berbicara tentang hasrat Anda untuk bepergian? Cari beberapa foto menakjubkan dari destinasi favorit Anda. Anda bahkan dapat memutuskan untuk menggunakan video sebagai gambar latar belakang Anda jika itu masuk akal untuk pekerjaan yang Anda lakukan!</p>
<center>
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1427824399252755" crossorigin="anonymous"></script>
<ins class="adsbygoogle" style="display:inline-block;width:580px;height:400px" data-ad-client="ca-pub-1427824399252755" data-ad-slot="3871104749"></ins>
<script>(adsbygoogle=window.adsbygoogle||[]).push({});</script>
</center><p>Kemungkinannya adalah bahwa pada titik tertentu, Anda ingin mengedit gambar yang sudah Anda miliki atau temukan secara online. Mulai memotong, meringankan, touch-up, dan bahkan menambahkan teks atau gambar dengan editor gambar sederhana. Beberapa layanan desain situs web - termasuk Squarespace - memiliki editor gambar yang tersedia sebagai bagian dari platform. Kalau tidak, ada banyak pilihan gratis atau murah secara online. PicMonkey menawarkan serangkaian fitur lengkap seharga $ 5 / bulan, yang berkisar dari penggunaan pemutihan gigi yang mudah digunakan hingga efek makeup untuk headshot Anda hingga filter foto, bingkai, dan banyak lagi.</p>
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1427824399252755" crossorigin="anonymous"></script>
<ins class="adsbygoogle" style="display:inline-block;width:336px;height:280px" data-ad-client="ca-pub-1427824399252755" data-ad-slot="5787935184"></ins>
<script>(adsbygoogle=window.adsbygoogle||[]).push({});</script><p><strong>Bacaan Lebih Lanjut:</strong> 50 Foto Gratis yang Dapat Anda Gunakan untuk Membuat Profil Sosial Anda Lebih Menakjubkan</p>
<a id="menu-2"></a><h2>2. Palet Warna</h2>
<p align=)
![](http://i.go-travels.com/img/advice/839/here-s-how-design-brag-worthy-website-2.jpg width=780 />
<p>Banyak templat situs web dilengkapi dengan skema warna yang telah ditetapkan sebelumnya, jadi jika Anda menyukai apa yang Anda diberikan, jangan lewatkan bagian ini. Tapi, karena warna adalah cara mudah untuk menambahkan sedikit kepribadian ke situs Anda, Anda dapat memilih untuk mengubahnya.</p>
<center>
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1427824399252755" crossorigin="anonymous"></script>
<ins class="adsbygoogle" style="display:inline-block;width:580px;height:400px" data-ad-client="ca-pub-1427824399252755" data-ad-slot="3871104749"></ins>
<script>(adsbygoogle=window.adsbygoogle||[]).push({});</script>
</center><p>Apakah Anda suka hitam dan putih dengan sedikit kecerahan atau ingin sedikit nuansa warna di situs Anda, coolors.co adalah sumber yang bagus untuk mengidentifikasi warna yang akan bekerja sama. Ini sangat mudah digunakan - cukup kunjungi situs dan tekan bilah spasi hingga Anda menemukan serangkaian warna yang Anda sukai. Anda bahkan dapat mengunggah foto dengan warna yang Anda sukai dan mendapatkan contoh langsung dari mereka. Jika Anda memasukkan banyak gambar di situs Anda, ini bisa menjadi strategi yang bagus untuk memastikan skema warna Anda berfungsi secara keseluruhan. Tempat mengejutkan lain untuk menemukan warna yang cocok dan mewakili Anda? Lemari Anda! Tarik beberapa utas favorit Anda dan sesuaikan pilihan warna Anda dengan yang lainnya.</p>
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-1427824399252755" crossorigin="anonymous"></script>
<ins class="adsbygoogle" style="display:inline-block;width:336px;height:280px" data-ad-client="ca-pub-1427824399252755" data-ad-slot="5787935184"></ins>
<script>(adsbygoogle=window.adsbygoogle||[]).push({});</script><p>Agar hal-hal dari visual tidak berlebihan, sebaiknya pilih palet yang netral dengan satu atau dua warna aksen. Untuk tujuan yang mudah, cobalah beberapa warna abu-abu ditambah warna favorit Anda dan rona pelengkap (misalnya, abu-abu muda, abu-abu sedang, abu-abu gelap, oranye, dan biru). Setelah Anda menyukai apa yang telah Anda kumpulkan, ekspor palet secara keseluruhan atau salin kode warna untuk swatch spesifik yang Anda suka dan tempel langsung ke kode situs Anda atau editor gaya bawaan.</p>
<p><strong>Bacaan Lebih Lanjut:</strong> Teori Warna Untuk Desainer: Membuat Palet Warna Anda Sendiri</p>
<a id="menu-3"></a><h2>3. Huruf-huruf</h2>
<p align=)
.</p>
<p>Sebuah kata peringatan di sini - walaupun tergoda untuk memilih sesuatu yang menyenangkan atau berbeda, Anda harus mengikuti prinsip yang sama seperti ketika Anda memilih font pada resume Anda dan memastikan semuanya profesional dan dapat dibaca. Jika Anda benar-benar ingin memasukkan font kursif atau unik, mainkan dengan meletakkannya di satu tempat sebagai elemen grafis (di header Anda, misalnya) dan menjaga sisa teks lebih mendasar.</p>
<p><strong>Bacaan Lebih Lanjut:</strong> 20 Font Terbaik dan Terburuk untuk Digunakan pada Resume Anda (Atau Situs Pribadi)</p>
<a id="menu-4"></a><h2>4. Tata Letak Halaman</h2>
<p align=)
![](http://i.go-travels.com/img/advice/839/here-s-how-design-brag-worthy-website-4.jpg width=780 />
<p>Sekarang Anda telah memilih semuanya - tetapi di mana Anda menempatkan semuanya di halaman? Mengatur banyak konten dan membuatnya terlihat disengaja bisa jadi sulit jika Anda tidak terbiasa dengan desain web, tetapi ada banyak cara untuk mempercepat dengan cepat.</p>
<p>Jika Anda membangun situs Anda di Squarespace, Anda akan menghargai tata letak pemula perusahaan, yang menawarkan template yang dioptimalkan untuk semuanya, mulai dari halaman sekitar Anda hingga halaman kontak. Dari sana, Anda dapat mencolokkan konten Anda atau memindahkan blok elemen untuk memenuhi kebutuhan Anda.</p>
<p>Tempat hebat lain untuk mendapatkan inspirasi untuk tata letak Anda adalah situs orang lain! Imitasi adalah bentuk sanjungan terbaik, jadi temukan orang yang menurut Anda telah mengatur situs mereka dengan baik dan mencoba meniru elemen yang Anda sukai dari mereka. Atau, cari istilah seperti "desain situs web" dan "tata letak situs web" untuk mengumpulkan contoh yang dapat Anda tiru sendiri.</p>
<p><strong>Bacaan Lebih Lanjut:</strong> 35 Situs Web Pribadi Terbaik Yang Pernah Kami Lihat</p>
<a id="menu-5"></a><h2>5. Logo</h2>
<p align=)