Hướng dẫn bố trí nội dung

Khi chúng tôi muốn gắn kết một nội dung trên web, một trong những vấn đề lớn mà chúng tôi thấy là các đề xuất tôi nhận được không bao giờ được nghĩ ra để kết hợp thành công vào web. Nói chung, vấn đề là nếu không có cấu trúc phù hợp, thiết kế và bố cục thường trông không được tốt lắm, cho kết quả không đạt yêu cầu.

Đó là lý do tại sao tôi sẽ đưa ra một số giải thích rất cơ bản về cách bố trí nội dung nên được xem xét trong điều kiện để đơn giản hóa công việc đến mức tối đa và kết quả là tối ưu.

Mục tiêu của hướng dẫn này là bất kỳ ai không có kiến ​​thức về lập trình hoặc phát triển web đều có thể cho tôi một bố cục chất lượng và tôi không phải mất quá nhiều thời gian để cố gắng trích xuất ý tưởng qua nhiều cuộc hội thoại cho đến khi đưa ra kết luận.

Bước 1: Mẫu

Để có một mẫu mà chúng ta có thể “vẽ” đề xuất của mình, những gì chúng ta sẽ làm là lấy một tờ giấy A4 và chúng ta sẽ gấp nó theo chiều dài MỘT THỨ BA.

Bước 2: Các khối nội dung

Hãy tưởng tượng rằng chúng ta có một số loại nội dung: video, hình ảnh, văn bản. Mỗi nội dung là một khối hình chữ nhật hoặc hình vuông. Chúng tôi phải phù hợp với các khối từ trên xuống dưới của mẫu theo lựa chọn của chúng tôi. Chúng tôi sẽ minh họa ba loại nội dung.

Khối video

Chúng tôi sẽ cho rằng video nói chung sẽ là video YouTube, chúng tôi đại diện cho nó trong mẫu như sau:

Khối hình ảnh

Nó phụ thuộc vào hình ảnh là phong cảnh hay chân dung, như chúng ta sẽ đồng ý.

Khối văn bản

Giống như khối hình ảnh, tùy thuộc vào cách chúng tôi muốn văn bản, chúng tôi sẽ đặt một khối hoặc khối khác. Chúng tôi đại diện cho nó với các đường song song.

Các khối văn bản có thể là các khối văn bản với các đoạn văn bản và thậm chí danh sách mục văn bản

Tôi sẽ đặt hai ví dụ: một khối văn bản bên cạnh hình ảnh phong cảnh và một ví dụ khác bên cạnh hình ảnh chân dung:

Khối tiêu đề

Các tiêu đề đi trong các khối riêng biệt là các khối kéo dài thường chiếm toàn bộ dòng.

Khối nút

Nếu chúng tôi muốn đặt một nút để mọi người nhấp và đưa họ đến một phần khác của web hoặc chỉ một cửa sổ có một số thông tin (hoặc một biểu mẫu) xuất hiện

Các khối khác

Ý tưởng là tương tự. Nếu chúng ta đã hiểu làm thế nào các khối hoạt động, tôi nghĩ rằng chúng ta rõ ràng có thể đặt một loại khối khác, tương tự như các khối trước đó, phù hợp với hình vuông hoặc hình chữ nhật. Ví dụ: nếu chúng tôi muốn đưa một hình thức kết hợp vào nội dung. Mặc dù điều này thường là ít phổ biến nhất, tốt hơn là nên hỏi trước khi sử dụng các khối mới không thuộc các loại được đề cập ở trên. Tôi sẽ cố gắng cập nhật danh sách này khi các ý tưởng khối mới xuất hiện có thể được mọi người quan tâm.

Cuối cùng, đây là một ví dụ về một mẫu với tất cả các loại khối được đề cập ở trên:

Mở rộng các khối

Nếu chúng ta cần nhiều không gian hơn, chúng ta chỉ cần thêm nhiều trang hơn vào thiết kế khối ở phía dưới. Không cần thiết phải lấp đầy mọi thứ, nhưng điều quan trọng là không để các khoảng trống trống từ trên xuống dưới giữa giữa mỗi khối. Bằng cách này, chúng tôi có thể mở rộng trang:

Bước 3: Tạo nội dung

Bây giờ chúng ta đã bố trí nội dung theo các khối và loại khối, cần thiết phải tạo nội dung sẽ đi trong các khối đó. Bước 3 có thể hoán đổi cho nhau với bước 2. Nói cách khác, chúng ta có thể tạo nội dung trước đó và sau đó bố trí biết lượng nội dung chúng ta muốn kết hợp. Không rõ ràng để làm điều này theo cách này hay cách khác, nhưng chúng ta phải nhận thức được rằng nội dung phải phù hợp với bố cục của chúng ta một cách chính xác

Chúng tôi sẽ làm theo ví dụ trước. Trong hình ảnh 4 chúng ta có thể thấy các khối sau:

• Khối tiêu đề 2
• Khối văn bản 4
• Khối video 1
• Khối hình ảnh 2
• Khối nút 1
• Tổng số: : Khối 10

Do đó, chúng tôi sẽ phải điều chỉnh nội dung của mình sao cho phù hợp hoàn hảo trong các khối này mà không cần rời khỏi và kích thước phông chữ hoàn toàn giống nhau trong tất cả các khối đó. Cho rằng là có thể đáng giá tạo nội dung trước rồi chặn nó. Nó đã phụ thuộc rất nhiều vào người.

Bước 4: Ghép nội dung với các khối

Giả sử rằng chúng ta đã có bản thiết kế được vẽ trên giấy và tất cả các khối nội dung được tạo. Bây giờ bước cuối cùng là kết hợp nó. Đối với điều này, chúng tôi sẽ sử dụng một số công cụ để kết hợp mọi thứ và gửi nó cho nhà thiết kế web.

Khối video

Video có thể được thông qua theo hai cách:

1. Ở định dạng video MP4 thông qua một công cụ như WeTransfer.
2. LỰA CHỌN ƯU ĐÃI: Tải chúng lên kênh YouTube tháng 3 và chuyển liên kết YouTube tới video.

Trong trường hợp chỉ có một video trong bố cục sẽ không có vấn đề. Nhưng nếu có một vài video chúng ta sẽ phải liên kết chúng theo một cách nào đó với bố cục mà chúng ta đã thực hiện trên giấy.

Ví dụ. Hãy tưởng tượng có ba video. Trong bố cục, chúng tôi sẽ vẽ một số 1 trong video đầu tiên, một số 2 trong video thứ hai và một số 3 trong video thứ ba. Và sau đó khi gửi tất cả các tài liệu, chúng tôi sẽ đặt một cái gì đó như thế này:

• Video 1: Video đề cập đến các cụm từ bất bạo động với tiêu đề: "Các cụm từ quan trọng nhất của bất bạo động"
• Video 2: Video đề cập đến màu cờ sắc áo với tiêu đề: «Lá cờ bất bạo động»
• Video 3: Video đề cập đến nhóm sẽ hành quân ở Argentina với tiêu đề: "Đội cơ bản của Argentina"

Điều này sẽ giúp bạn dễ dàng biết video nào tương ứng với từng phần.

Khối hình ảnh

Trong trường hợp này, tất cả các hình ảnh phải được tải lên nền tảng IMGUR: https://imgur.com/upload

Và sau đó chuyển các liên kết đến những hình ảnh đó. Lý tưởng là đặt các hình ảnh giống với video, được đánh dấu bằng 1, 2, 3, v.v. Ví dụ, hãy tưởng tượng chúng ta có 4 hình ảnh đang bay ở Nam Phi. Cả bốn đều có cùng tên: “sudafrica.jpg”. Chà, chúng tôi đặt các tên liên tiếp đến điểm mà chúng sẽ ở trong bố cục và chúng tôi vẽ số trên giấy tương ứng với chúng. Ví dụ:

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

Nút, tiêu đề và khối văn bản

Cuối cùng, các khối này nên được viết trong Tài liệu Word hoặc tốt nhất là trong Google Docs.

Định dạng rất đơn giản: Trong tài liệu Word, chúng tôi đặt loại Khối (Tiêu đề, Nút hoặc Văn bản) theo sau là số mà nó sẽ tương ứng trong bố cục.

Ejemplos:

• Tiêu đề 1: Đào.
• Tiêu đề 2: Giáo dục
• Văn bản 1: Giáo dục
• Văn bản 2: Giáo dục
• Nút 1:
• Nút 2:

Sau đó, tôi đặt một tài liệu mẫu với các văn bản hoàn toàn ngẫu nhiên để có thể thấy nó sẽ được cấu trúc như thế nào, theo ví dụ về hình ảnh 4:

Đây là cách bố trí sẽ trông như thế nào khi chúng ta đặt các số tương ứng với từng phần:

Bước 4: Gửi tất cả

Khi chúng tôi đã hoàn thành mọi thứ, bạn chỉ cần gửi nó cho người chịu trách nhiệm bố trí

Nó chỉ đơn giản là

1. Phác thảo trên giấy với bố cục
2. Nội dung
   • Liên kết video đến YouTube hoặc WeTransfer
   • Liên kết IMGUR của hình ảnh
   • Liên kết đến tài liệu trong Google Docs hoặc tệp Word

Chung cuộc công chứng

Cuối cùng, lý tưởng sẽ là bao gồm một hình ảnh nổi bật sẽ đi kèm với tiêu đề 1 của trang. Đó là lý do tại sao Tiêu đề 1 phải luôn xuất hiện ở đầu.

Hình ảnh tiêu đề phải có kích thước pixel 960 x 540. Hình ảnh này có thể được gửi giống như phần còn lại của hình ảnh, bởi IMGUR

Kết quả cuối cùng

Và cuối cùng với tất cả thông tin này, trang sẽ được thiết lập. Theo dõi và kết thúc với ví dụ này, trang có kết quả cuối cùng theo sau tất cả các tham số mà chúng tôi đã nêu trước đây sẽ là:

Trang cuối cùng