sentimentalist

모바일 마켓에 대한 시장 분위기를 나타내주는 가장 큰 변화는 모바일 퍼스트(Mobile First)에서 모바일 온니(Mobile Only)로의 변화입니다. 모바일도 중요하지만 데스크탑이 여전히 중요하다는 메세지(모바일 퍼스트)에서 데스크탑은 버려도 괜찮으니 모바일을 놓치지 말자(모바일 온니)로의 변화였기 때문입니다. 물론, 모바일 기기만 신경쓴다는 것이 합리적인지에 대해서는 갑론을박이 있겠지만 모바일을 통한 매출과 수익의 창출이 데스크탑에 신경쓰는 것에 대비하여 비용 효율적인 것은 부인하기 힘든게 사실입니다.

때문에 많은 기업들이 사례(Best Practice)와 경험을 토대로 모바일 환경에 최적화 하기 위한 개선 작업에 많은 리소스를 투입하고 있습니다. 그렇지만 엠닷으로 대표되는 사이트의 구성과 반응형 웹 사이트 구성 사이에서 갈등이 생기고, 반응형 웹 사이트 안에서도 "정말로 모바일을 위한 최적화가 되어 있는가?"로 다시 한번 여러가지 의견이 나오기도 합니다. 

구글이 제공하는 모바일 웹사이트 속도 테스트 도구는 사용자들이 인터넷으로 접근 가능한 웹 사이트에 대하여 얼마나 모바일에 최적화가 되어 있는지 살펴보고, 최적화 되어 있지 않은 부분이 있다면 어떤 부분들을 집중적으로 파고들어야 하는지에 대한 가이드를 제공해주는 역할을 해줍니다. 물론 상세한 리포트를 제공받기 위해서는 구글을 통한 컨설팅을 받아야 하지만 큰 아젠더 (예: 브라우저 캐시의 활용, 이미지의 최적화 등) 를 뽑아내는데는 무리가 없습니다.

한국의 대표적인 포털 사이트인 네이버(www.naver.com)를 이용해서 모바일 최적화가 얼마나 잘 되어 있는지 살펴보았습니다. 아래의 수치가 절대적인 것은 아니고 구글 모바일 웹사이트 속도 테스트 도구가 테스트하는 방식에도 영향을 받을 수 있기 때문에 어떤 항목들에 대하여 최적화를 하면 좋다고 가이드 하는지 살펴보는 정도로 활용하면 좋을 것 같습니다. 각 결과 페이지에 깨알같이 기술된 "상대적" 이라는 단어도 논란을 막기 위한 포석이라 생각되네요!

일단 모바일 친화성 점수는 100점 만점에 99점으로 아주 훌륭하다는 피드백입니다. 다만 모바일 속도와 데스크톱 속도 항목에서 저조한 점수를 받은 것이 다소 의외입니다. 네이버의 경우 모바일 단말에서 접근시 유저 에이전트(User-Agent)를 확인해 모바일 전용 페이지(m.naver.com)으로 리디렉트 하기 때문입니다. 이런 리디렉트 절차 까지도 점수 산정에 포함되는지는 확인하지 못했습니다.

상세한 항목을 살펴보면 일부 JS 및 CSS 로 인한 리소스 로딩 블러킹 현상이 있는 것으로 보입니다. 개발자 도구를 이용해 워터폴 차트를 살펴보면 확인해 볼 수 있는 부분으로 많은 웹 사이트에서도 발견되는 부분이긴 합니다. 이미지 최적화는 파일 포맷에 대한 것인지 혹은 유저 에이전트(=브라우저)에 따른 최적 파일 포맷(예: webp, jpeg2000 등) 미사용에 대한 부분인지 역시 불명확하긴 합니다. 상황에 따라서는 데스크탑용 이미지를 리사이즈 형태로 사용하는 것에 대해 지적하는 것일 가능성도 아주 낮지만 무시하면 안되겠습니다. 

데스크톱 속도의 경우도 비슷한 항목들이 빨간색으로 분류되었습니다. 귀차니즘이 없다면 워터폴 차트를 한번 보고 싶다는 욕망이 가득했지만 애써 마음을 누르며 늘어난 노란색 항목들을 살펴보았습니다. 모바일 속도 항곰에서는 압축(gzip), 자바스크립트 축소, HTML 축소에 대한 항목이 초록색이었는데 데스크탑 유저 에이전트에 대해서는 노란색으로 추가 수정할 사항이 있다는 권고가 나온 것이 관전 포인트 입니다. 유저 에이전트 혹은 뷰포트에 따라 어떤 형태로 텍스트, 바이너리 컨텐츠를 보여주고 제공할 것인지 잘 결정해야 하겠습니다.

마지막으로 국내 2인자를 벗어나지 못하고 있는 (그러나 제가 거주하고 있는 티스토리를 제공하는!) 다음의 메인 웹 사이트에 대한 성능 측정을 진행해 보았습니다. 페이지가 담고 있는 정보의 양에 따라 달라질 수 있는 부분이겠지만 모바일, 데스크탑 모두 네이버 메인 페이지보다 더 높은 (그러나 둘다 빤간색인...) 점수를 받았습니다. 비슷한 레인지의 점수라 유의미하진 않겠지만 나란히 빨간색으로 저조하다는 평가를 받은 것이 의외입니다.

여러분의 웹 사이트, 블로그도 구글 모바일 웹 사이트 속도 테스트 도구로 모바일 친화도, 성능 측정을 해보시기 바랍니다. 상황에 따라 달라질 수 있는 성능 지표이니 구글의 테스트 결과만으로 너무 속상해 하지 마시기 바랍니다!

2016년이 시작된지 일주일이 지났습니다. 벌려놓은(?) 몇 가지 일들을 진행하느라 12월부터 블로그 업데이트가 다소 뜸합니다. 마무리 되는 일들도 좀 있기 때문에 조만간 블로그의 시동을 다시 걸고 달릴 것을 다짐해 봅니다. 2016년 한해동안의 활동을 결산해보지 못하고 어영부영 있던 찰나에, 2016년 한해동안의 활동을 결산해 주는 페이지가 제공된다는 티스토리의 공지를 보고 재빨리 블로그 활동을 정리해 봤습니다.

블로그를 처음 시작했던 것이 대학교 3~4학년 즈음이었던 2002~2003년 이었으니 실제 활동 햇수로는 벌써 10년을 넘은지 오래입니다. 초기에 사용하던 인티즌(Intizen)과 호스팅을 통한 태터툴즈 사용을 접고 티스토리에 자리 잡은 지가 벌써 9년이 넘었네요. 잊고 있었는데 티스토리 활동 결산 페이지에서 다시 한 번 정리해주니 감회가 무척 새롭습니다. 한참때만큼의 활동은 아니지만 꾸준하게 포스팅하고 업데이트하고 있는 덕에 간혹(?) 인기 포스팅도 나오고 그러는 것 같습니다.

한해동안 100개 이상의 포스팅을 열심히 올렸고 40만명 이상의 방문객이 다녀가셨습니다. 9년차나 되었다는 사람의 수치로는 뭐 그냥 그렇지만 이런 여러가지 활동이 상위 5% 의 티스토리 활동러(?)로 인정받는 계기가 되었던 것 같습니다. 역시나 하는 일에 맞추어 IT, 인터넷 분야의 뉴스들이 많았던 것 같습니다. 여행에 관한 글들을 더 열심히 올려보려 했는데, 항상 여행 다녀온 시점 전후로 반짝~ 하고 말았던 것이 패인이었습니다. 기억이 가물가물해지면 적기 힘든게 여행 포스팅이라, 올해는 방법을 조금 바꿔서 여행 시작부터 끝까지를 모두 포스팅할 수 있도록 해봐야겠습니다.

인기 있었던 포스팅은 대부분 IT 에 대한 것들이었지만 1위를 기록한 것은 전혀 예상 밖이었습니다. SC은행에서 발행하고 있는 리워드360 체크카드를 주력으로 사용하고 있는데요, 이 카드를 이용해서 쌓은 포인트를 손쉽게 현금화하는 방법에 대한 포스팅이었습니다. 포스팅이 높은 조회수를 기록했던 이유는 바로 뽐뿌 재테크 관련 포럼에 글이 게시되면서였던 것 같습니다. 여전히 유효한 방법이니 관심있는 분들이라면 SC은행 리워드360 체크카드로 새로운 한해 소비 패턴을 바꿔보시는 것도 좋겠습니다!

예전에 많이 올려둔 연말정산 관련 포스팅들 덕분에 1월에는 방문객이 무척 많았던 것 같습니다. 이후 부터는 매월 3만명을 조금 넘는 방문객들이 찾아주고 계십니다. 검색 유입으로 들어오시는 경우들이 대부분이고 네이버 메인이라던가 방문객 폭발을 일으킬 수 있는 곳에 게시되지 않은 것이 한해동안 꾸준한 박스권을 유지할 수 있었던 비법(?)입니다. 대충 검색 유입으로 이정도는 살 수 있다~ 하는 샘플로 보셔도 괜찮을 것 같네요!

포스팅은 좀 들쭉날쭉해서 개인적으로는 조금 아쉬웠습니다. 세컨 블로그로 개발 / IT 시스템을 다루는 곳이 있어서 합치면 112개보다 많은 포스팅을 하긴 했습니다만 (여기에 회사 커뮤니티까지 합치면 그 수가 좀 더 많아지긴 합니다) 숫자적인 측면에서 많이 아쉬운 부분입니다. 더 꾸준히 전문성을 보여줄 수 있는 포스팅들을 전략적으로 해볼 계획을 세워봐야겠습니다. 바쁜 일정이 많지만, 블로그는 역시 마음의 고향이니까요. :-) 올 한해도 블로그에 많은 방문 부탁드리며, 진정 도움이 되는 컨텐츠들이 가득하도록 꾸려 나가 보겠습니다. 

이제 슬랙에 협업 공간을 만들어봅시다. 차근차근 따라 하면 어렵지 않습니다. 우선 슬랙 홈페이지(https://slack.com/)에 접속해봅시다.

슬랙 홈페이지 첫 화면에서 이메일 주소를 적고 [Create a new team] 링크를 클릭합니다. 회사 구성원만 사용하는 팀으로 만들고 싶다면 회사에서 제공받은 이메일 주소를 입력하는 것이 좋겠지요? 개인 목적으로 만드는 팀이라면 개인 이메일 주소를 써도 괜찮습니다. 

[그림 1] 슬랙 홈페이지 첫 화면

이메일을 입력하면 기계적인 가입을 막기 위하여 여섯 자리 인증 코드를 포함한 메일을 입력한 메일 계정으로 발송합니다. 도착한 메일을 확인하여 인증 절차를 마칩니다. 

[그림 2] 이메일 주소 인증

슬랙을 이용하는 데 이름은 크게 중요하지 않습니다만 사용자를 쉽게 식별할 수 있도록 이름을 입력하겠습니다. 유저네임(Username)은 일종의 닉네임으로 팀 공간 내에서 사용합니다. 원하는 이름으로 자유롭게 입력해보세요.

[그림 3] 유저네임 입력

유저네임까지 입력하면 이제 패스워드를 지정할 차례입니다. 여기서 지정된 패스워드는 해당 팀을 접속할 때만 사용하는 패스워드입니다. 하나의 이메일로 여러 팀에 참여하고 있다면 각 팀별로 패스워드를 다르게 설정할 수 있다는 의미입니다. 

[그림 4] 비밀번호 입력

이제 팀 도메인을 설정하는 단계입니다. 팀 도메인은 일반적인 도메인 호스트명의 제약조건을 따르며 누군가 선점한 도메인이라면 사용할 수 없습니다. 도메인 이름은 나중에 변경할 수도 있으니 너무 심각하게 고민하지 않아도 됩니다. 

팀 도메인까지 입력하면 사람들에게 초대 메일을 보낼 수 있습니다. 당장 누군가를 초대할 것이 아니라면 나중에 보낼 수도 있으니 이 단계를 건너뛰어도 괜찮습니다.

[그림 6] 팀원 초대

여기까지 무사히 진행을 했다면 생성된 팀 도메인으로 이동하면서 슬랙 협업 공간을 만나게 됩니다. 

[그림 7] 슬랙에 오신 것을 환영합니다!

 슬랙은 기존의 다른 서비스와는 조금 다릅니다. 단일 계정이 아니라 복수의 이메일 계정을 활용할 수 있고, 한 이메일 계정으로 여러 팀에 참여할 수 있습니다. 슬랙 클라이언트는 이러한 n:n 구조의 이메일 - 팀의 관계를 하나의 화면에 등록하고 관리할 수 있으며 쉽게 콘텍스트(Context)를 전환하며 사용할 수 있도록 도와줍니다. 나중에 조금 더 자세히 설명을 하겠지만 팀 내에서도 채널을 통해 더 세부적으로 사용자들의 정보 공유 권한을 조절할 수 있습니다. 

기기별 애플리케이션을 설치해보고 모바일과 데스크탑 클라이언트가 어떤 차이가 있고 원활한 팀 활동을 위해 어떤 형태로 이용할 것인지도 한번 고민해 보시기 바랍니다. 그럼 다음 화에서는 슬랙의 주요 기능인 메시지를 알아봅시다.