이번 기수 등록 마감까지 남은 시간은?

DAY

:
:
수강 신청하기
로그인

|

내 강의실

|

마이페이지

그린채널

공지사항 게시글 보기 : 번호, 제목, 조회수, 작성일 등 정보제공
재미있고 기발한 에러페이지 디자인 조회수 20590


안녕하세요! 그린컴입니다.

여러 웹사이트들을 다니다 보면 갑작스럽게 에러페이지를 만날 때가 종종 생깁니다.

주로 '페이지를 찾을 수 없습니다' 나 '서비스에 접속할 수 없습니다'와 같은 문구를 보게 되는데요.

자칫하면 기분이 안 좋아질 수 있는 이 페이지를 기발하고 재치있게 표현함으로써 웃음을 주는 웹사이트들도 있다고 합니다.

지금부터 몇 가지 만나보도록 할까요?

CSS-TRICKS


[이미지출처:CSS-TRICKS 사이트 캡쳐]

웹디자인에 관한 여러 팁과 오픈소스들을 찾아볼 수 있기 때문에 개발자들이 유용하게 활용하는 CSS-TRICKS는 웹사이트의 성격에 맞는 에러페이지를 보여주고 있습니다. 마치 사이트 내의 오류가 생긴 부분을 직접 보여주는 듯한 효과를 내고 있기 때문에 사용자들로부터 웃음과 화를 동시에 이끌어 낼 수 있지 않을까 하네요.

Figma


[이미지출처:Figma 사이트 캡쳐]

Figma는 다양한 UI를 제작할 수 있는 프로그램으로 외국의 웹디자이너들이 많이 사용하는 웹사이트인데요. 역시나 사이트의 성격을 잘 표현하는 에러페이지를 제작하였습니다. 벡터방식을 사용해 404라는 글자를 표현하고 있기 때문에 에러페이지를 만난 사용자가 모양을 마음대로 바꿀 수 있도록 하고 있습니다.

Blizzard


[이미지출처:Blizzard 사이트 캡쳐]

스타크래프트, 디아블로, 오버워치 등 다양한 게임을 출시한 블리자드 엔터테인먼트의 홈페이지는 유명 게임 회사답게 404 에러페이지 또한 게임 캐릭터를 활용하여 표시하고 있습니다. 워크래프트에 등장하는 '멀록'을 활용하여 두리번거리는 모습을 표현하고 있는데요. 다른 게임에서 또한 자주 만날 수 있는 익숙한 캐릭터이기 때문에 블리자드 게임을 즐겨하는 분들에게는 소소한 재미를 느낄 수 있는 디자인인 것 같습니다.

Slack


[이미지출처:Slack 사이트 캡쳐]

프로젝트 혹은 일반 업무를 진행할 때 협업툴로 사용되는 Slack은 독특한 에러페이지를 가지고 있습니다. 무지개, 산, 나무 등으로 표현된 풍경에 귀여운 일러스트 동물들이 걸어다니고 있는 화면이 나오는데요. 마우스를 사용하면 양 옆으로 이동할 수 있어 아름다운 풍경을 더 살펴볼 수도 있습니다. 이런 아기자기한 페이지를 만난다면 에러가 생긴다고 하더라도 기분이 정화되는 느낌을 받을 것 같죠?

Purée Maison



[이미지출처:Purée Maison 사이트 캡쳐]

Purée Maison은 크리에이티브 에이전시라는 성격에 맞게 웹사이트 자체가 활발하고 재미있는 애니메이션으로 꾸며져 있는데요. 에러페이지 또한 귀엽게 표현하고 있습니다. 에러를 마주한 당황스러움보다는 미소를 먼저 자아내게 되는 에러페이지, 정말 재치있는 것 같습니다.


웹서핑을 많이 하는 사람에게 404 에러페이지는 흔하게 접하는 부분인데요. 내가 원했던 페이지 대신 에러페이지를 마주하게 되면 자연스럽게 짜증이 나기도 하는 것 같아요. 하지만 단순히 오류가 났다는 메시지만 있는 것이 아닌 재밌고 신기한 애니메이션, 그림, 글귀가 뜬다면 나도 모르게 미소를 짓게 될 것 같은데요. 각 성격에 맞는 에러페이지를 더 많은 웹사이트에서 만나고 싶네요.