Sự sáng tạo trong cách thiết kế trang 404 Error qua 20 ví dụ

Thứ ba - 07/07/2015 00:33

Vì một lý do nào đó, thiết kế web chuyên nghiệp của bạn gặp lỗi ở đâu đó, đây là tình huống khó có thể tránh khỏi trên internet.

Sự sáng tạo trong cách thiết kế trang 404 Error qua 20 ví dụ

Thay vì một trang báo lỗi trống trải với những dòng chữ sơ sài taọ cảm giác hụt hẫng và thậm chí khó chịu cho người xem, chúng ta hoàn toàn có thể tạo ra một trải nghiệm người dùng ấn tượng hơn với thiết kế trang báo lỗi 404 thú vị.

Có một trang báo lỗi 404 error có thiết kế tốt quan trọng hơn bạn tưởng. Khi thiết kế website chính, bạn cũng cần chuẩn bị luôn trang báo lỗi đề phòng trường hợp cần dùng đến. Đôi khi việc lỗi trang không phải có nguyên nhân từ bạn, trang 404 error sẽ hướng người dùng trở về trang chủ. Đây giống như một cơ hội thứ 2 để thu hút người dùng và khiến họ không nản lòng mà rời bỏ trang của bạn. Nếu website của bạn chưa có một bản trang báo lỗi nào, hãy nghĩ đến nó ngay từ lúc này. 

Dưới đây là 20 ví dụ sáng tạo về trang 404 error mà chúng tôi đã chọn để bạn tham khảo. 404 error giống như một thế giới ẩn chứa những điều làm người cả bạn và người dùng web bất ngờ, vậy hãy tận dụng cơ hội này để làm cho thương hiệu của bạn thực sự nổi bật. 

Mashable

Dòng thông báo ngắn gọn nhưng hoàn toàn không nhàm chán, kết hợp cùng hình minh họa dễ thương sẽ làm cho người xem dịu bớt tâm trạng. 

404 error thiet ke web sang tao

Template Monster

Trang 404 error này chứa khá nhiều nội dung chữ và hình ảnh, nhưng nó không làm người xem mất kiên nhẫn, bởi nội dung của trang khá vui nhộn và thú vị. 

404 error thiet ke web sang tao

Defrozo

Bên cạnh lời xin lỗi chân thành về vấn đề lỗi trang là một số thông tin hữu ích cho người dùng web để hướng cho họ đến những việc cần làm tiếp theo. 

404 error thiet ke web sang tao

 

Diesel

Thiết kế trang báo lỗi này khá đơn giản với hai hình ảnh đóng vai trò navigation. 

404 error thiet ke web sang tao

StickerMule

Phương án chuyển tiếp được đưa ra cho người dùng khi gặp lỗi tại trang này. 

404 error thiet ke web sang tao

 

Blue Daniel

Bối cảnh khá chi tiết của trang báo lỗi đã đủ khiến người xem dành thêm thời gian ở lại website. Cho dù họ đang gặp một trang bị lỗi thực sự nhưng có vẻ như vẫn không thiếu điều thú vị ở đây để xem. 

404 error thiet ke web sang tao

dario brozzi

Thiết kế tối giản với màu xám ở nền và màu đen của chữ kết hợp tạo nên sự tinh tế. Lối chơi chữ cũng góp phần làm không khí bớt tẻ nhạt ở đây. 

404 error thiet ke web sang tao

centresource

Khi gặp lỗi trang này, bạn có hai lựa chọn với 2 nút call to action. 

404 error thiet ke web sang tao

agens

Chắc hẳn nhiều người sẽ bật cười khi thấy hình ảnh một phi hành gia phiên bản hoạt hình đang ngồi khóc ngoài vũ trụ như dưới đây. 

404 error thiet ke web sang tao

Tinsanity

Sự hài hước phà phá cách vẫn tiếp tục mang đến không khí thoải mái cho mọi người ở đây. 

404 error thiet ke web sang tao

 

MailChimp

Hình ảnh của trang báo lỗi minh họa rất đúng tình trạng mà trang này gặp phải: mọi thứ đóng băng nghĩa là mọi thứ không hoạt động được. 

404 error thiet ke web sang tao

Good Dog Design

Chắc hẳn người tạo ra thiết kế này cũng là một người yêu động vật. 

404 error thiet ke web sang tao

Tripomatic

Dòng thông báo ngắn gọn và thực sự hài hước khi đưa ra lý do trang này không hoạt động. 

404 error thiet ke web sang tao

Starbucks

Một loạt nguyên nhân và những phương án thay thế được trình bày để người dùng thông cảm, bên cạnh đó là hình ảnh vết cà phê đầy biểu cảm. 

404 error thiet ke web sang tao

Template Monster Ru

Dành cho những người biết tiếng Nga. 

404 error thiet ke web sang tao

RSQ

Thiết kế tối giản với những nét vẽ minh họa đơn giản. 

404 error thiet ke web sang tao

Focus Lab

Thiết kế sáng sủa và cũng không quên đưa ra những lựa chọn thay thế cho người xem. 

404 error thiet ke web sang tao

Michael Schmid

Có nhiều việc khác để làm trong lúc chờ lỗi trang này được khắc phục, đi ăn một chiếc hamburger là một gợi ý không tồi cho một mẫu thiết kế website nhà hàng độc đáo.

404 error thiet ke web sang tao

Fastcentrik

Nhìn vào hình minh họa là chúng ta đủ hiểu được tình hình tại đây. 

404 error thiet ke web sang tao

Nulab Inc.

Thật sự có quá nhiều cách để làm dịu lại tâm trạng của người dùng web khi gặp trang lỗi, chẳng hạn như cách mượn hình ảnh của những chú cừu đáng yêu này. 

404 error thiet ke web sang tao

Tác giả bài viết: Phùng Thanh Hằng
Nguồn tin: Ngôi Sao Số Web & Brand Solutions