글로벌인재연수원(GTTI) — 통이미지 사이트를 고객 자가관리형 텍스트 기반 아임웹으로 리뉴얼

기획 의도

글로벌인재연수원(GTTI)은 가족 한달살기·영어캠프부터 국비지원 해외취업(K-MOVE)까지 폭넓은 해외 연수 프로그램을 운영하는 교육기관입니다. 이번 프로젝트에서 부스터웹이 맡은 범위는 기존 gtti.or.kr의 메인 페이지 리뉴얼입니다. 방문자가 가장 먼저 마주하는 메인 페이지 한 장을, 검색에 노출되고 담당자가 직접 관리할 수 있는 구조로 다시 설계하는 것이 목표였습니다.

단순히 보기 좋은 첫 화면을 만드는 데 그치지 않고, 정부 승인 이력이라는 GTTI의 실질적 강점을 전환 도구로 바꾸는 것에 초점을 맞췄습니다. 엄격한 정부 기준을 통과한 기관이라는 사실이 영어캠프·한달살기 같은 일반 프로그램의 신뢰도까지 끌어올리도록, 메인 페이지의 메시지 순서를 다시 짰습니다.

정부의 엄격한 기준을 통과한 기관, 한달살기·영어캠프의 기준도 다릅니다.

클라이언트 과제

리뉴얼 전 메인 페이지는 세 가지 구조적 문제를 안고 있었습니다.

• 통이미지 중심 구조 — 텍스트가 이미지 안에 그려져 있어, 정보가 아무리 많아도 검색엔진이 내용을 읽지 못했습니다. 구글·네이버 검색에서는 사실상 비어 있는 페이지에 가까웠습니다.
• 자가관리가 불가능한 구조 — 프로그램 문구 하나를 바꾸려 해도 이미지를 다시 디자인해야 했습니다. 운영 담당자가 직접 손댈 수 없어 업데이트가 지연되고 외주 비용이 반복됐습니다.
• 전환 경로의 부재 — 여러 프로그램이 평면적으로 나열돼, 방문자가 자신에게 맞는 프로그램을 빠르게 찾아 상담으로 이어질 흐름이 없었습니다.

특히 GTTI의 핵심 강점인 국비지원 해외취업 사업이 메인에서 부각되지 못해, 정부 인증이라는 공신력이 방문자를 설득하는 데 쓰이지 못하고 있었습니다.

접근

메인 페이지를 텍스트 기반 코딩 방식으로 전면 재구성했습니다. 이미지에 갇혀 있던 문구를 실제 HTML 텍스트로 되살려, 검색엔진이 페이지 내용을 온전히 읽을 수 있게 만들었습니다.

신뢰 축과 수익 축을 엮은 메시지 구조

메인 페이지의 흐름을 두 개의 축으로 설계했습니다. 상단 신뢰 배지와 ‘WHY GTTI’ 영역에서 정부지원·보증보험·국가공인 같은 공신력을 먼저 확인시키고, 이어지는 대상별 프로그램 카드에서 가족·아이·시니어·취업 등 방문자가 자신에게 맞는 길로 자연스럽게 이동하도록 했습니다. 신뢰가 먼저 서고, 그 위에서 선택과 상담이 일어나는 순서입니다.

자가관리형 위젯과 공통 헤더 시스템

아임웹(imweb) 위젯 단위로 메인 페이지를 조립하고, 사이트 전반에 걸리는 공통 헤더에 타이포그래피 시스템을 심었습니다. 담당자가 관리자 화면에서 문구를 고치거나 메뉴를 추가해도 제목·본문·간격이 일관되게 유지되도록 설계해, 디자인을 다시 맡기지 않고도 직접 운영할 수 있게 했습니다.

시니어까지 배려한 접근성

시니어 연수 방문자를 고려해 본문 글씨를 키우고(기준 18px) 행간과 터치 영역을 넉넉히 확보했습니다. 모바일에서는 전화·카카오·상담 버튼을 화면 하단에 고정해, 스크롤 위치와 관계없이 언제든 문의로 연결되도록 했습니다.

결과

메인 페이지가 이미지 덩어리에서 검색엔진이 읽을 수 있는 텍스트 구조로 바뀌었습니다. 반응형으로 재구성돼 데스크톱과 모바일 어디에서든 정보의 위계와 상담 동선이 유지됩니다.

무엇보다 운영 담당자가 직접 사이트를 관리하는 구조가 자리 잡았습니다. 리뉴얼 이후 담당자가 관리자 화면에서 메뉴와 문구를 직접 조정하며 사이트를 운영하고 있고, 공통 헤더의 타이포 시스템 덕분에 새 콘텐츠를 얹어도 디자인 통일성이 흔들리지 않습니다. ‘고치려면 매번 외주를 다시 맡겨야 하던’ 메인 페이지가 ‘담당자 손에서 직접 굴러가는’ 페이지로 바뀐 것이, 이번 메인 페이지 리뉴얼의 가장 실질적인 성과입니다.