Kiat dan alat terbaik untuk membangun situs WordPress pertama Anda

Saya harus membuat pengakuan hari ini: Saya bukan perancang web yang sangat baik. Saya tidak pernah mengikuti pelatihan formal – saya sepenuhnya belajar secara otodidak. Keahlian saya adalah menulis, dan saya telah mengambil desain web sebagai elemen penting untuk menjadi penulis lepas dan tidak memiliki anggaran untuk situs web yang tepat. Saya memutuskan dari Hari 1 bahwa saya lebih suka memiliki situs web DIY yang layak yang saya sukai (tetapi dengan beberapa kemungkinan "kesalahan") daripada membayar untuk situs web beranggaran rendah yang saya benci dan tidak dapat menyesuaikan dari waktu ke waktu. Bagaimanapun, kita semua tahu betapa rendahnya penyedia layanan anggaran.

Maka mulailah saya masuk ke desain web DIY amatir. Cukup cepat, proses situs web DIY memicu minat saya pada desain web. Saya masih bukan seorang "desainer sejati", tetapi saya cukup tahu dasar-dasar untuk memaksimalkan alur kerja saya, membuat jalan di sekitar tema yang saya suka, dan menerapkan tweak spesifik yang saya inginkan.

Inilah masalahnya: Saya bukan (dan mungkin tidak akan pernah) seorang desainer web profesional. Dan mungkin sulit untuk menemukan sumber daya di luar sana untuk orang-orang DIY seperti saya – orang-orang yang cukup pintar untuk memikirkan banyak hal dan bersedia meluangkan waktu, tetapi yang tidak memiliki latar belakang teknis yang nyata.

Ini adalah beberapa alat dan sumber daya terbaik untuk perancang web DIY yang telah saya pelajari selama ini. Jika Anda memiliki kecenderungan yang sama, ini untuk Anda!

Pembuat situs web dan tema yang dapat disesuaikan

Saya pribadi bukan penggemar berat pembuat situs web – Saya suka WordPress, dan saya suka memiliki lebih banyak kontrol daripada yang ditawarkan kebanyakan pembuat situs web. Jika Anda menyukai ide drag-and-drop untuk mendapatkan situs yang tepat yang Anda inginkan tanpa semua penderitaan, lihatlah tema Divi untuk WordPress. Anda juga dapat menemukan sejumlah besar tema yang dapat disesuaikan untuk WordPress.

Cara membuat tema anak WordPress

Biasanya, hampir tidak mungkin menemukan tema yang sempurna; selalu ada beberapa modifikasi yang perlu dilakukan. Jadi, mengapa tidak mengambil tema default WordPress yang bagus, seperti Twenty Fifteen, dan ...

Setiap desainer memiliki tema favorit mereka – dan favorit desainer DIY (non) ini adalah GeneratePress. Itu dapat melakukan hampir semua yang saya bayangkan, add-onnya 100% sepadan dan sangat terjangkau, tutorial video menjawab 98% pertanyaan saya, dan pengembang (Tom) sangat aktif dan responsif di forum dukungan. Saya telah menggunakan tema ini selama 2 tahun dan tidak bisa lebih bahagia dengannya.

Menjaga penampilan

Hari-hari ini, bahkan saya tahu bahwa desain responsif yang ramah seluler adalah keharusan mutlak. Saya telah mengunjungi situs web di ponsel saya yang tidak seluler atau responsif, dan itu tidak cantik. Saat ini, sebagian besar tema memiliki elemen responsif – pastikan milik Anda juga. Kemudian, saat Anda sedang dalam proses pembuatan, gunakan alat seperti Duo, Screenify, atau Browser Shots untuk memastikan bahwa desain situs Anda akan terlihat bagus di perangkat apa pun.

Pernahkah Anda menggunakan panduan gaya? Ini adalah lembar referensi untuk semua elemen visual desain Anda – font, gaya, pemformatan judul, dan warna di situs web Anda. Ini sangat berguna untuk dimiliki dan dirujuk saat Anda membangun dan mengubah situs web Anda, dan Anda dapat membuatnya sendiri dengan Stylify Me.

Ini mungkin tampak tak terduga pada titik ini dalam karir desain DIY Anda — atau mungkin tidak — tetapi harinya akan tiba ketika Anda ingin membuat beberapa modifikasi di CSS untuk mengubah tampilan beberapa elemen tertentu. Ketika saatnya tiba, Anda dapat berkubang dalam tutorial, mencari dukungan dari tema Anda, atau beralih ke generator CSS untuk menghasilkan kode yang Anda inginkan. Anda juga dapat melihat Webflow, editor drag-and-drop yang memungkinkan Anda membangun apa yang ingin Anda lihat di halaman dan kemudian menghasilkan kode CSS untuk Anda. Ini adalah layanan berbayar, yang cenderung bertentangan dengan DIY.

Ini adalah kentang kecil, tetapi pastikan situs Anda memiliki favicon. Anda dapat menggunakan generator favicon ini, atau mendapatkan plugin favicon sederhana untuk situs WordPress Anda agar prosesnya menjadi sangat sederhana. (Saya lebih suka rute plugin, menurut pendapat saya yang tidak profesional.)

Favorit semua orang: font

Font adalah anak emas dari desain web; sepertinya semua orang menyukai tipografi. Tetapi jika Anda tidak tahu apa yang Anda lakukan, font bisa jadi agak menakutkan. Membeli font, menginstalnya, bahkan memodifikasinya…yeesh. Jika Anda hanya ingin situs Anda terlihat bagus, Anda dapat menginstal Google Font dan menggunakan database tipografi ramah web yang cukup kuat. Juga mudah untuk menemukan kombinasi Font Google yang terlihat bagus bersama dengan pencarian web sederhana.

Type-Finder adalah situs yang menanyakan serangkaian pertanyaan singkat kepada Anda dan kemudian menawarkan saran font kepada Anda. Pilih dan pilih yang Anda suka, dan Anda sudah siap. Itu membuat memilih font lebih mudah, terutama jika Anda tidak berpengalaman dalam font dan teori font.

Saat Anda merasa berani dan siap untuk mendapatkan font yang tepat yang Anda inginkan untuk header, pin, dan lainnya, lihat Glyphr. Ini adalah editor font dan sangat keren.

Alat alur kerja

Saat Anda seorang desainer DIY terbang di dekat kursi celana Anda, Anda jarang memikirkan alur kerja. Tapi saya telah belajar (dengan cara yang sulit) bahwa beberapa elemen alur kerja desain yang hebat dapat membuat desain web DIY Anda jauh lebih sedikit dari sakit kepala.

13 alat berbasis browser yang harus dimiliki setiap desainer dalam perangkat mereka

Ah, aplikasi berbasis browser. Ini adalah perangkat lunak solid yang memperbarui dirinya sendiri. Anda tidak perlu dipusingkan dengan mengunduh sesuatu. Dan, mungkin yang paling fantastis dari semuanya, aplikasi pilihan Anda dapat diakses di berbagai...

Hal pertama yang ingin Anda adopsi dari "desainer web nyata" adalah konsep gambar rangka. Gambar rangka bisa sesederhana membuat sketsa setiap halaman di atas kertas atau serumit kisi-kisi di Adobe Photoshop. Untuk tujuan saya, biasanya sketsa di atas kertas sudah cukup (bagaimanapun juga, saya tidak pernah menjadi super-teknis dengan desain saya), tetapi jika Anda lebih suka melihat sesuatu secara lebih formal di kotak digital, lihat Mockflow (yang merupakan layanan berbayar) atau Moqups.

Tempat lain di mana saya terjebak adalah di mana kata-kata akan pergi dan bagaimana mereka akan terlihat – sebelum saya menyalinnya. Untuk ini, generator teks dummy sangat bagus. Memiliki salinan di situs Anda saat Anda membangunnya memudahkan untuk mengevaluasi tanpa terpaku pada kata-kata yang sebenarnya (yang merupakan kejatuhan pribadi saya).

Saat tiba waktunya untuk berhenti bermain dengan garis dan kata dan mulai bermain dengan warna, Anda memiliki beberapa pilihan yang menyenangkan. Pemetik warna adalah beberapa hal favorit saya – saya memilih warna dan kemudian pemilih warna mengeluarkan beberapa kombinasi warna yang bagus. Adobe dan Color Wizard adalah dua opsi yang menyenangkan untuk dimainkan.

Jika pemilih warna Anda tidak cocok untuk Anda, Anda dapat menggunakan sesuatu seperti Pictaculous. Unggah gambar yang Anda suka, dan itu akan menyemburkan tema warna yang diambil dari gambar. Ini sangat keren!

Bukan itu saja

Tidak ada akhir untuk alat desain yang bagus untuk desainer DIY, tetapi ini adalah hal yang saya temukan yang membuat hidup lebih mudah bagi desainer pemula. Apa alat yang Anda inginkan?

Ebook gratis: 25 alat yang harus dimiliki untuk desainer web

Toolkit desainer dapat menjadi kunci keberhasilan mereka, tetapi bagaimana Anda tahu alat apa yang harus disertakan dalam alur kerja Anda? Kami pikir 25 alat ini harus dimiliki oleh perancang web yang sukses.