Bố cục thông minh của 20+ thiết kế website đậm hình ảnh

Trải qua nhiều sự biến chuyển, giờ đây người ta đã biết dùng infographic để diễn đạt các số liệu. Các thiết kế website khách sạn, thời trang, nhiếp ảnh…muốn gây ấn tượng với người xem về sản phẩm của mình, họ sẽ chọn bố cục website đậm hình ảnh. 20+ ví dụ đẹp mắt dưới đây chắ chắn sẽ giúp ích cho những ai muốn tìm hiểu thêm về cách làm các bố cục web dạng này. 

Một bố cục trang web tốt không chỉ điều hướng người dùng đến với đúng mục tiêu của họ mà còn giúp cho họ trở thành khách hàng tiềm năng của bạn. Giống như những gì google đã làm, tại sao các chủ trang web thích quảng cáo Google đến như vậy ? Chính vì khi điều hướng tốt, một khách hàng tìm kiếm từ khóa nào đó và đến trang web của bạn. Họ chắc chắn là người có nhu cầu nào đó về sản phẩm và dịch vụ của bạn.

Fitz

Visit Suffolk

Một thiết kế website du lịch đến từ nước Anh. Nó không chỉ là một trang cung cấp thông tin đơn thuần bởi cách bố cục dày đặc hình ảnh của nó.

Awd Agency

Hãng thông tin liên lạc này sử dụng những hình ảnh khổ lớn trong suốt và biến mất khi bạn di chuột qua từng ảnh. 

Cartel Belli

Thêm một hãng thông tin liên lạc sử dụng bố cục dạng lưới, hình ảnh cũng được phủ màu đỏ và sẽ biến mất khi di chuột qua.

Simon Foster Design

Hình ảnh cỡ lớn cùng chữ rất nhỏ được sử dụng. Các khối màu lớn kết hợp với các hình vẽ tay. Chỉ có một điều là bạn không thể biết các link sẽ dẫn bạn đi đâu. 

Jux

Một trang chia sẻ mới với bộ sưu tập hình ảnh trên landing page. Màu sắc của các hình xung quanh hình mà bạn di chuột vào sẽ có sự thay đổi.

RVLT

Bố cục đậm đặc hình ảnh được cắt theo hình tam giác, vẫn là bố cục dạng lưới nhưng thực sự rất mới lạ. Điều thú vị nữa là mỗi lần refresh trang, bố cục sẽ lại thay đổi.

Gabs

Bạn hãy đoán thử xem công ty này sản xuất thứ gì, cho dù ở tên của nó đã có chữ |bag”

Hommard

Một website thời trang với những hình ảnh xếp theo dạng lưới. Chỉ những ô hình ảnh có viền  mỏng trắng khi di chuột qua thì mới chứa link.

Arthur Gallan

Cách thể hiện hình ảnh khác lạ. Tất cả những người trong hình đều có thể chuyển động trên màn hình. 

L'Oreal Color Looks

Ảnh toàn trang thumbnail thực chất là một màn hình slideshow. Di chuột qua hình sẽ được xem 5 ảnh và nếu click vào thì sẽ mở slide với ảnh lớn hơn. 

Cropp

Website thời trang dùng slide ở đầu và bố cục lưới ở dưới. Hiệu ứng động khi di chuột qua ảnh khiến mọi thứ thú vị hơn. 

Trama

Trang web sử dụng lưới với các khối màu trên đó có lượng chữ tối giản. Trông nó giống phong cách cinemagraph hơn là một video clip. 

Etienne Aigner

TRang web có diện mạo tối giản mặc dù khoác lên mình rất nhiều hình ảnh. Mỗi hình là một vật dụng cụ thể. Cuộn trang xuống sẽ thấy video và slideshow.

Lois Jeans

Bố cục dạng lưới với hiệu ứng màu sắc trong suốt trên mỗi hình ảnh, khi di chuột qua ảnh, bạn sẽ thấy sự khác biệt. 

House: Campaign spring 2014

Trang web có khá ít chữ nhưng nhiều hình ảnh, video và âm nhạc, chúng thuộc về các nghệ sỹ khác nhau.Hiệu ứng biến đổi sẽ diễn ra khi bạn di chuột qua mỗi hình ảnh. 

Yvan Rodic

Thiết kế website portfolio của Yvan Rodic, người vừa là một dân du lịch, nhiếp ảnh gia. Ảnh được xếp theo các hàng ngang trên landing oage, click vào ảnh sẽ đến với toàn bộ ảnh chụp về một địa điểm nào đó.

Nicolas Tarier Photography

Portfolio đơn giản với gallery ảnh theo bố cục dạng lưới. Click vào ảnh sẽ đến với ảnh cỡ đầy đủ.

Bernd Kammerer

Một trang web cá nhân khác của nhiếp ảnh gia, nó thể hiện niềm đam mê nhiếp ảnh của người nghệ sỹ này.Vòng tròn đỏ sẽ chuyển sang trắng khi bạn di chuột vào. 

Grischek

Landing page này chứa nhiều ảnh thumbnail và logo ở chính giữa trang. Một hoặc vài ảnh xung quang sẽ sáng lên nếu bạn di chuột qua.

Rod McClean

Hình ảnh của trang có thể chuyển động nhanh dưới dạng slideshow, ngoài ra nếu bạn di chuột qua một ảnh, nó sẽ chuyển sang hình tứ giác.