Panduan tata letak konten

Ketika kami ingin me-mount konten di web, salah satu masalah besar yang kami temukan adalah bahwa proposal yang saya terima tidak pernah dipikirkan dengan baik untuk dimasukkan secara memuaskan ke dalam web. Secara umum masalahnya adalah bahwa tanpa struktur yang memadai, desain dan tata letak biasanya tidak terlihat terlalu bagus, memberikan hasil yang tidak memuaskan.

Itu sebabnya saya akan memberikan beberapa penjelasan yang sangat mendasar tentang bagaimana tata letak konten harus dipertimbangkan dalam kondisi untuk menyederhanakan pekerjaan secara maksimal dan hasilnya optimal.

Tujuan dari panduan ini adalah siapa pun yang tidak memiliki pengetahuan tentang pemrograman atau pengembangan web dapat memberikan saya tata letak yang berkualitas dan bahwa saya tidak perlu menghabiskan terlalu banyak waktu untuk mencoba mengekstraksi ide melalui beberapa percakapan hingga mencapai kesimpulan.

Langkah 1: Templat

Untuk mendapatkan template di mana kita bisa “menggambar” proposal kita, yang akan kita lakukan adalah mengambil selembar kertas A4 dan kita akan melipatnya menjadi sepertiga memanjang.

Langkah 2: Blok konten

Bayangkan kita memiliki beberapa jenis konten: video, gambar, teks. Setiap konten adalah blok persegi panjang atau persegi. Kita harus menyesuaikan blok dari atas ke bawah dari template sesuai pilihan kita. Kami akan menggambarkan tiga jenis konten.

Blok video

Kami akan menganggap bahwa video tersebut umumnya berupa video YouTube, kami wakili dalam templat sebagai berikut:

Gambar 2

Blok gambar

Itu tergantung pada apakah gambar lanskap atau potret, karena kami akan setuju.

Blok Teks

Sama seperti blok gambar, tergantung pada bagaimana kita menginginkan teks kita akan meletakkan blok atau yang lain. Kami mewakilinya dengan garis paralel.

Blok teks bisa berupa blok teks dengan paragraf dan bahkan termasuk daftar elemen tekstual

Saya akan memberikan dua contoh: satu blok teks di sebelah gambar lanskap, dan satu lagi di sebelah gambar potret:

Gambar 3

Blok judul

Judul yang masuk dalam blok terpisah adalah blok memanjang yang umumnya menempati seluruh baris.

Blok tombol

Jika kita ingin meletakkan tombol bagi orang untuk mengklik dan membawa mereka ke bagian lain dari web atau hanya sebuah jendela dengan beberapa informasi (atau formulir) muncul

Blok lainnya

Idenya serupa. Jika kita sudah mengerti bagaimana blok bekerja, saya pikir kita bisa dengan jelas menempatkan jenis blok lain yang, mirip dengan yang sebelumnya, cocok dengan persegi atau persegi panjang. Misalnya, jika kita ingin memasukkan formulir yang dimasukkan ke dalam konten. Meskipun ini biasanya yang paling tidak umum, lebih baik untuk bertanya sebelum menggunakan blok baru yang bukan tipe yang disebutkan di atas. Saya akan mencoba memperbarui daftar ini ketika ide-ide blok baru keluar yang mungkin menarik bagi semua orang.

Akhirnya, berikut adalah contoh templat dengan semua jenis blok yang disebutkan di atas:

Gambar 4

Memperluas blok

Jika kita membutuhkan lebih banyak ruang, kita hanya perlu menambahkan lebih banyak halaman ke desain blok di bagian bawah. Tidak perlu mengisi semuanya, tetapi penting untuk tidak meninggalkan celah kosong dari atas ke bawah di tengah-tengah setiap blok. Dengan cara ini kita dapat memperluas halaman:

Gambar 5

Langkah 3: Membuat konten

Sekarang kita memiliki tata letak konten dengan blok dan jenis blok perlu untuk membuat konten yang akan masuk dalam blok tersebut. Langkah 3 dapat dipertukarkan dengan langkah 2. Dengan kata lain, kita dapat membuat konten sebelumnya, dan kemudian tata letak mengetahui jumlah konten yang ingin kita sertakan. Tidak jelas untuk melakukannya dengan satu atau lain cara, tetapi kita harus menyadari bahwa konten harus sesuai dengan tata letak kita dengan tepat

Kami akan mengikuti contoh sebelumnya. Pada gambar 4 kita dapat melihat blok berikut:

  • Blok Judul 2
  • Blok Teks 4
  • Blok Video 1
  • Blok Gambar 2
  • 1 Button Block
  • Total: Blok 10

Karena itu kita harus menyesuaikan konten kita sehingga sangat cocok di blok ini tanpa meninggalkan dan bahwa ukuran font persis sama di semua dari mereka. Untuk itu itu mungkin sepadan buat konten terlebih dahulu lalu blokir. Itu sudah sangat tergantung pada orang tersebut.

Langkah 4: Menyesuaikan konten dengan blok

Mari kita asumsikan bahwa kita sudah memiliki desain yang digambar di atas kertas dan semua blok konten dibuat. Sekarang langkah terakhir adalah menggabungkannya. Untuk ini kita akan menggunakan beberapa alat untuk menggabungkan semuanya dan kirimkan ke desainer web.

Blok Video

Video dapat dikirimkan dalam dua cara:

  1. Dalam format video MP4 melalui alat seperti WeTransfer.
  2. OPSI PREFERRED: Mengunggahnya ke saluran YouTube March dan meneruskan tautan YouTube ke video.

Jika hanya ada satu video di tata letak tidak akan ada masalah. Tetapi jika ada beberapa video kita harus mengaitkannya dengan tata letak yang telah kita lakukan di atas kertas.

Sebagai contoh. Bayangkan ada tiga video. Dalam tata letak kita akan menggambar nomor 1 di video pertama, nomor 2 di video kedua dan nomor 3 di video ketiga. Dan ketika mengirim semua dokumentasi kita akan meletakkan sesuatu seperti ini:

  • Video 1: Video yang membahas tentang frasa nir-kekerasan dengan judul: "Ungkapan-ungkapan nir-kekerasan yang paling penting"
  • Video 2: Video yang membahas tentang warna bendera dengan judul: «Bendera nir-kekerasan»
  • Video 3: Video tentang grup yang akan berbaris di Argentina dengan judul: “Tim dasar Argentina”

Ini akan memudahkan untuk mengetahui video mana yang sesuai dengan setiap bagian.

Blok Gambar

Dalam hal ini, semua gambar harus diunggah ke platform IMGUR: https://imgur.com/upload

Dan kemudian berikan tautan ke gambar-gambar itu. Yang ideal adalah menempatkan gambar sama dengan video, ditandai dengan 1, 2, 3 dan seterusnya. Misalnya, bayangkan kita memiliki 4 gambar dengan cepat di Afrika Selatan. Keempatnya memiliki nama yang sama: “sudafrica.jpg”. Nah, kami menempatkan nama berturut-turut ke titik di mana mereka akan berada di tata letak dan kami melukis nomor di atas kertas yang sesuai. Contoh:

  • sudafrica-1.jpg
  • sudafrica-2.jpg
  • sudafrica-3.jpg
  • sudafrica-4.jpg

Tombol, Judul dan Blok Teks

Terakhir, blok ini harus ditulis dalam Dokumen Word, atau di Google Documents.

Formatnya sangat sederhana: Di dokumen Word kami meletakkan jenis Blok (Judul, Tombol, atau Teks) diikuti dengan nomor yang akan sesuai dalam tata letak.

Ejemplos:

  • Judul 1:….
  • Judul 2: ...
  • Teks 1: ...
  • Teks 2: ...
  • Tombol 1: ...
  • Tombol 2: ...

Lalu saya meletakkan contoh dokumen dengan teks yang benar-benar acak sehingga dapat dilihat bagaimana ini akan terstruktur, mengikuti contoh gambar 4:

Beginilah tata letak seharusnya terlihat setelah kami menempatkan angka yang sesuai dengan setiap bagian:

Gambar 6

Langkah 4: Kirim semua

Setelah kami melakukan semuanya, Anda hanya perlu mengirimkannya kepada orang yang bertanggung jawab atas tata letak

Itu hanya akan mengambil

  1. Sketsa di atas kertas dengan tata letak
  2. Isinya
    • Tautan video ke YouTube atau WeTransfer
    • IMGUR tautan gambar
    • Tautan ke dokumen di Google Documents atau file Word

Final Notaris Penting

Yang ideal akhirnya adalah memasukkan gambar yang luar biasa yang akan menyertai tajuk Judul 1 halaman. Itu sebabnya Judul 1 harus selalu muncul di awal.

Gambar tajuk harus berukuran 960 x 540 piksel. Gambar ini dapat dikirim seperti gambar lainnya, oleh IMGUR

Hasil akhir

Dan akhirnya dengan semua informasi ini, halaman akan diatur. Mengikuti dan menyelesaikan dengan contoh ini, halaman dengan hasil akhir mengikuti semua parameter yang telah kita naikkan sebelumnya akan menjadi ini:

Halaman terakhir
Situs web ini menggunakan cookie miliknya sendiri dan pihak ketiga agar berfungsi dengan benar dan untuk tujuan analitis. Ini berisi tautan ke situs web pihak ketiga dengan kebijakan privasi pihak ketiga yang mungkin Anda terima atau tidak terima saat Anda mengaksesnya. Dengan mengklik tombol Terima, Anda menyetujui penggunaan teknologi ini dan pemrosesan data Anda untuk tujuan ini.    Ver
pribadi