Trong việc tạo một trang web, giai đoạn kết xuất thiết kế trang là rất quan trọng, sau đó sẽ được sắp xếp và xuất bản trên mạng. Trong bài viết này, bạn sẽ học cách sử dụng Adobe Photoshop để vẽ bố cục phù hợp cho một trang web, trên cơ sở đó sau này bạn có thể hình thành các bố cục phức tạp hơn.
Nó là cần thiết
Chương trình Adobe Photoshop
Hướng dẫn
Bước 1
Tạo một tệp mới trong Photoshop (Ctrl + N) với kích thước 1040x1400, trong đó 1400 là chiều cao. Bật hiển thị thước (Ctrl + R) và đặt pixel làm đơn vị đo trong cài đặt thước.
Bước 2
Bắt đầu kéo dài các đường dẫn để chúng vừa với đường viền của các hộp bố cục. Kéo dài các đường viền bên sao cho 40 pixel còn lại ở các cạnh. Các đường viền trên và dưới cũng nên để lại 40 pixel ở mỗi bên so với đường viền của nền.
Bước 3
Sau đó, chọn một hướng dẫn có kích thước 200px từ trên cùng của nền xuống cho tiêu đề trên cùng.
Bước 4
Để tạo các thanh bên ở bên trái và bên phải của bố cục, hãy đặt các đường dẫn hướng 240 pixel từ đường viền nền sang bên trái và 800 ở bên phải.
Bước 5
5px vào trong từ sidebar bên trái và bên phải và vẽ thêm hai đường dẫn dọc. Sau đó, kéo thêm hai đường dẫn 245 px ở bên trái và 795 px ở bên phải.
Bước 6
Bây giờ đo từ đường viền của tiêu đề 30px và vẽ một đường dẫn ngang cho menu ngang.
Bước 7
Chọn vùng hẹp của menu ngang mà bạn vừa đánh dấu bằng vùng chọn hình chữ nhật bằng cách sử dụng phím M. Chọn công cụ tô màu và tô vùng đó bằng màu xám nhạt trung tính.
Bước 8
Chọn công cụ tô màu và tô vùng đó bằng màu xám nhạt trung tính. Nhấp vào menu "Chọn-Sửa đổi-Nén", chỉ định tuỳ chọn 1 pixel và nhấp vào "OK." Tô màu khu vực này với màu xám nhạt hơn - bạn sẽ có một khung menu.
Bước 9
Tạo một lớp mới và chọn một hình ảnh phù hợp cho biểu tượng hoặc biểu trưng của trang web, sau đó mở nó.
Bước 10
Chèn một hình ảnh trên một lớp mới trong tiêu đề, đặt nó ở cạnh bên trái. Ở bên phải của hình ảnh, viết tiêu đề văn bản của trang web bằng bất kỳ phông chữ nào.
Bước 11
Thiết kế các khối trang web của bạn cùng một bảng màu với tiêu đề mới được tạo. Chọn khu vực của thanh bên trái và thực hiện các thao tác tô hai màu tương tự như với khối menu.
Bước 12
Làm tương tự với khối nội dung rộng chính giữa. Sao chép layer sidebar bên trái và đặt nó làm sidebar bên phải.
Bước 13
Thêm văn bản vào bố cục của bạn - chọn phông chữ trung tính và điền vào tiêu đề menu, ví dụ tin tức, ảnh, thẻ và phần liên kết.
Bước 14
Hoàn thành bố cục bằng cách tạo một "chân trang" hoặc chân trang - ghi bản quyền và địa chỉ liên hệ của bạn vào đó.
