Những mẫu website cân bằng bất đối xứng

Ngoài những yếu tố về điểm nhấn, tính nhịp điệu, sự thống nhất, tỉ lệ đối xứng trong thiết kế web thì yếu tố cơ bản nhất để đánh giá trang web là cách bố trí bố cục trong trang web.

Tính cân bằng và đối xứng trong webiste

Các hình khối, đường nét, khoảng cách trong trang web được lồng ghép với nhau một cách tinh tế. Luật cân bằng được chia ra làm hai loại là cân bằng đối xứng và cân bằng bất đối xứng :

Cân bằng đối xứng

Cân bằng đối xứng đề cập đến tất cả những gì được sắp xếp trong bố cục.Các yếu tố như chiều cao,chiều rộng…được sắp đặt một cách đối xứng trong thiết kế website.Cân bằng đối xứng được chia ra nhiều loại như cân bằng đảo ngược, cân bằng trục, cân bằng xuyên tâm…..

Cân bằng bất đối xứng đạt tính thẩm mỹ khi các yếu tố xếp đặt không có sự đối xứng với nhau nhưng xét tổng quát vẫn hài hòa với nhau , mục đích của cân bằng bất đối xứng là  thu hút sự chú ý. Bộ sưu tập dưới đây là những mẫu website được thiết kế mang tính cân bằng bất đối xứng trong thiết kế web.

Thiết kế cân bằng bất đối xứng

Sjobygda. Thiết kế đã khéo léo kết hợp  hình ảnh của nền với logo để tạo ra một thiết kế bất đối xứng, tạo nên tính trực quan cho trang web.

Những mẫu website cân bằng bất đối xứng

Enterprise Foundation sự kết hợp hình dáng lởm chỡm và hình dạng không đồng đều trong một màu sắc sặc sỡ tạo nên cảm giác cân bằng bất đối xứng.

Những mẫu website cân bằng bất đối xứng

Rock Werchter  cách bố trí truyền thống nhưng việc kết hợp những cột và thiết lập độ rộng khác nhau cho mỗi cột với nhiều chức năng khác nhau giúp trang web đạt trạng thái cân bằng bất đối xứng trong thiết kế web.

Những mẫu website cân bằng bất đối xứng

Mediascop :tinh tế và gọn gang. Việc kết hợp video với màu sắc tương phản truyền tải được thông điệp đến người dùng.

Những mẫu website cân bằng bất đối xứng

DesignBlvd nội dung thật đáng yêu, cách thiết kế web thể hiện sự hài hòa cả dữ liệu theo ngữ cảnh và hình ảnh, màu sắc. Bố trí không đối xứng nhưng vẫn đạt trạng thái cân bằng.

Những mẫu website cân bằng bất đối xứng

Artegence thiết kế chỉ sử dụng hình chữ nhật đơn giản và hình khối  để tránh cảm giác của sự nhầm lẫn và hỗn loạn nhưng vẫn gắn liền với việc truyền tải thông tin qua trang web.

Những mẫu website cân bằng bất đối xứng

Timberline Tours thiết kế phá vỡ quy luật cơ bản thiết kế và chính điều này tạo nên trạng thái cân bằng bất đối xứng

Những mẫu website cân bằng bất đối xứng

Valencia DMC toát lên một hình ảnh sang trọng.Trạng thái bất đối xứng thể hiện ở việc khối nội dung bán trong suốt kết hợp với khối tròn .

Những mẫu website cân bằng bất đối xứng

AmplifiQ hình khối với cấu trúc tổ ong tạo nên sự rung cảm mạnh mẽ. Thiết kế khéo léo phù hợp với hình ảnh và văn bản đã tạo ra khác biệt và cảm giác mất thăng bằng.

Những mẫu website cân bằng bất đối xứng

Sarasota Web Design Các nền đa giác  bố trí thành nhiều phần thu hút sự chú ý của người sử dụng ngay lập tức. Nhà thiết kế sử dụng các công cụ đồ họa để thêm vào trang web gợi nên cân bằng tổng thể.

Những mẫu website cân bằng bất đối xứng

Senador Volstead  cân bằng phần nội dung với một vài hình ảnh và văn bản nhỏ. Ở đây, cân bằng bất đối xứng được sử dụng để nhấn mạnh tạo nên một điểm nhấn trên trang web.

Những mẫu website cân bằng bất đối xứng

Jose Guizar phân chia trang web thành nhiều cột kết hợp hình ảnh sắp xếp mockup làm cho trang web bất đối xứng tạo nên cảm giác hài hòa về bố cục.

Những mẫu website cân bằng bất đối xứng

Touch Agency trang web cung cấp cho người sử dụng với tất cả các thông tin cần thiết .Thiết kế để định dạng 3 cột truyền thống nhưng có sự phá cách.

Những mẫu website cân bằng bất đối xứng

Osito  Ở đây, bất đối xứng đạt được bằng sự tương phản giữa hình ảnh và văn bản. Bằng cách này, nhà thiết kế làm cho người ta nhận thấy một khẩu hiệu lần đầu tiên trong trang web.

Những mẫu website cân bằng bất đối xứng

Eggsquis Sự đối lập giữa hình ảnh và nội dung tạo nên tính bất đối xứng cho thiết kế web này.

Những mẫu website cân bằng bất đối xứng

Alcyon Communication  mang lại một hiệu quả của thiết kế bất đối xứng  cho việc truyền thông.

Những mẫu website cân bằng bất đối xứng

Stylist Christel Winther. Trang web này là một ví dụ tốt về thiết kế bất đối xứng tạo nên cảm giác khám phá nội dung bên trong trang web.

Những mẫu website cân bằng bất đối xứng

M4ID thiết kế website  phá cách  menu  tạo nên tính bất đối xứng nhưng vẫn truyền tải thông điệp đến người dùng.

Những mẫu website cân bằng bất đối xứng

Reinast Phong cách tối giản tạo nên tính bất đối xứng mà không còn sự lựa chọn nào khác.

Những mẫu website cân bằng bất đối xứng

Flavorit. Việc tách văn bản ra riêng với hình khối hướng người dùng chú ý đến nội dung chính nhưng vẫn khắc sâu hình ảnh.

Những mẫu website cân bằng bất đối xứng

Kinetik kết hợp màu sắc với một đường chéo nâng cao hiệu quả tổng thể giúp web đạt trạng thái bất đối xứng.

Những mẫu website cân bằng bất đối xứng

Panna’s en Akka’s. Chính sọc màu hồng rộng tạo nên trạng thái đối xứng của một thiết kế.

Những mẫu website cân bằng bất đối xứng

Có nhiều cách khác nhau để tạo ra thiết kế web bất đối xứng. Bạn có thể ghép hình ảnh với văn bản hoặc không gian trống với văn bản. Thiết lập màu sắc sử dụng hình khối và đồ trang trí, chia nhỏ  các cột …... Điểm chính là để đạt được một sự cân bằng bất đối xứng  và làm cho người dùng có một cái nhìn hài hòa , thẩm mỹ trong trang web.

Tác giả bài viết: Liên Nguyễn

Tổng số điểm của bài viết là: 0 trong 0 đánh giá

Click để đánh giá bài viết
Bạn đã không sử dụng Site, Bấm vào đây để duy trì trạng thái đăng nhập. Thời gian chờ: 60 giây