Tistory Blog:
홈페이지형 블로그 제작
(OO사 공식블로그 사례)
안녕하세요! 오늘은, 티스토리 홈페이지형블로그제작대행 사례를 보여드릴께요. 블로그제작대행, 블로그제작비용 등도 같이 알아보기로 합니다. 지난번 포스팅을 통해 그동안 여러분들이 몰랐던, 또는 알려주지 않아서 알 수도 없었던 반응형 스킨 기반의 진정한 '홈페이지형' 블로그를 알게 되셨을 것입니다.
이제는, 소비자들이 익숙한 환경을 기업이나 소상공인, 개인사업자 분들은 제공할 의무가 있고, 그래야 더 많은 콘텐츠의 열람과 고대하던 문의, 제품구매, 계약체결 등의 목적을 달성할 수 있을 것입니다. 소비자들이 익숙한 환경을 UX Design 이라고 말씀을 드렸고, 오픈마켓이나 다양한 홈페이지의 모바일화면을 통해서 알고 있는 편리한 기능들을 이제는 홈페이지형블로그제작 시 반영해줘야 한다는 것입니다.
네이버 블로그의 공통 스킨이나 플랫 디자인에서 벗어나야 하고, 정적인 디자인에서 반응형 디자인(CSS)으로 변모해야 하는 것입니다. 진정한 홈페이지형블로그제작은, 모바일 화면에 포커스 온 해야 합니다. 여러분들이 알고 있는 네이버블로그의 모바일 화면을 살펴보세요. 잘만들든지, 못만들든지 동일한 화면이 표출되는 것을 알 수 있습니다. 소비자들은 불편해합니다. 스마트한 모바일화면을 제시해줄 의무가 있습니다.
티스토리 홈페이지형블로그는, 위의 포트폴리오에서 보시는 것처럼 자유로운 영혼입니다. 원하는 디자인과 레이아웃을 기반으로 편리한 기능과 빠른 콘텐츠 전환, SNS 연동 및 FEED 기능까지 갖추고 있습니다. 신문이나 일반 홈페이지 옆에 뜨는 다양한 광고 애드센스를 붙여서 또다른 수익창출도 가능합니다. 티스토리 블로그는 카카오 다음에서 제공하는 호스팅을 무료로 사용할 수 있어 별도의 호스팅비나 도메인 비용이 나가지 않는다는 장점을 갖고 있습니다.
티스토리 홈피이지형브로그 제작 사례 일부만 보여드렸습니다.
네이버 블로그는 PC버전에서 일부영역만 코딩이 가능해서 티스토리 홈페이지형처럼 모바일 블로그 개발이 안된다는 점도 미리 알아두시면 좋을 것 같습니다.
이제 오늘 보여드릴 티스토리 홈페이지형블로그제작 대행 사례를 보여드릴께요. 디자인이나 기존 레이아웃을 유지한 채 이번에는 부분 리뉴얼 코딩 작업에만 참여하였습니다. 디자인은, 스타일 코딩으로 하여 빠르고 정확하게 진행할 수 있었던 프로젝트 였습니다.
공식블로그 제작
티스토리 블로그 제작 대행 사례
이번 블로그제작대행에는, 메인 페이지 슬라이딩 하단의 배너와 아이콘 교체작업, 상단 메뉴바 드롭다운 시 나타나는 매장안내의 페이지 처음부터 다시 클라이언트께서 원하시는 레이아웃과 분위기로 전면 교체하고 기능적인 코딩을 구현하는 작업이었습니다. 작업기간이 촉박하여 주말작업까지 해야했습니다.
위 페이지는 상단 메뉴바(Shop) 드롭다운 시 나타나는 매장안내 페이지로 새롭게 이번에 재구축한 코딩의 산물입니다. 보기에는 단순해 보여도, 몇가지 특징적인 최신 코딩을 적용해드렸습니다.
[구현된 내용]
1. 회색배경 안에 4가지 배너 설정
2. 전체보기+ 외 5가지 중간 필터기능 설정
3. 하단의 좌측 워딩(텍스트) 영역의 각 매장 코딩
4. 지도영역 표기
회색 배경 안에 4가지 배너설정
이 부분은, 제공된 아이콘과 워딩으로 구현했고, 각 배너에 대한 코딩으로 위치를 특정하고 아웃링크를 넣어 클릭시 해당 목적지로 이동하게 해주었습니다. 간격 포지셔닝, 상하좌우여백, 간격 등을 구현해야 합니다.
중간필터 6가지 코딩
전체보기+ 에서부터 와콤 무빙크 체험매장까지 각 체크박스를 만들고 클릭시 해당 데이터를 표출시켜야하는 난위도가 있는 코딩이었습니다. 티스토리는 원페이지 코딩이라는 점에서 웹디자이너 분들이 쉽게 코딩할 수 없을 정도로 쉽지는 않습니다. 그래서 웹퍼블리셔나 코더 등 숙련된 분들에 의하여 코딩이 가능합니다. 따라서, 이번 코딩은, 티스토리의 페이지 기능을 활용하여 별도로 독립적인 코딩을 하고 이것을 메뉴바 영역의 하위 메뉴로 연결시키는 자바스크립트를 사용했습니다.
필터기능을 적용한 예시를 살펴봅니다.
6가지 필터 기능 중에서 A/S 접수대행 필터를 클릭시 나타나는 매장 정보를 표출시키고 있습니다. 이것은 마치 홈페이지에서 빌더-빌더-빌더로 이어지는 3단계 페이지처럼 보일 정도로 세련된 코딩기술을 적용해준 사례입니다.
하단 좌측의 위덩영역 코딩
하단부분에 표기된 워딩영역(지점명)도 단순히 플랫디자인으로 한 것이 아니라 이 부분 역시도 각각의 지점명에 온 마우스를 해보면 해당 지점의 정보를 실시간 확인할 수 있도록 코딩이 되어 있습니다.
모바일 화면으로 해당 필터를 클릭시 표출되는 것을 보여드리면,
이렇게 해당 지점명이나 타이틀 영역의 카테고리를 눌러도 지점들의 정보를 한눈에 확인할 수 있도록 구현되어 있는 것이죠. PC 화면 뿐 아니라 위의 사진처럼 모바일 화면에서도 반응형 스킨으로 적용되어 최적의 이미지와 폰트 사이즈를 자동 적용하고 있습니다.
▲블로그 구경해보기!
블로그제작대행, 비용 등
홈페이지형블로그제작대행은 기본적으로 제공해드릴 수 있는 서비스이며, 블로그제작비용은 코딩의 난위도, 디자인 여부 등에 따라서 천차만별입니다. 블로그제작비용을 가장 손쉽게 알 수 있는 것은 밴치마킹 사이트나 파워포인트 등으로 레이아웃을 먼저 알려주시면 그에 맞는 견적을 제시해드릴 수 있습니다.
📞Click Here! 전화바로걸기(모바일)
블로그제작대행 절차와 제작기간 안내
위의 인프그래피를 통해서 쉽게 이해할 수 있을 것입니다. 네이버 블로그제작은 비교적 단기간에 충분히 가능하고, 티스토리 블로그의 경우는 최소 2주간의 기간이 적용되어야 합니다. 물론, 기간을 단축시켜서 주말작업까지 한다면 약간의 비용이 추가될 수 있습니다.
궁금하신 내용은
언제든 편하게 문의주세요!
'블로그제작' 카테고리의 다른 글
| 홈페이지형 블로그제작,관리대행 업체 찾으세요? (76) | 2024.11.21 |
|---|---|
| 티스토리, 네이버 홈페이지형 블로그제작대행 비용, 업체 활용하기! (75) | 2024.11.14 |
| 티스토리 제작, 홈페이지형블로그 반응형스킨 적용한 BLOG (6) | 2024.07.22 |
| 티스토리 홈페이지형 블로그 제작(SK렌터카, 대행비용 등) (3) | 2023.09.07 |
| 홈페이지형 블로그 제작(다음 블로그 -> 티스토리 이전) (5) | 2022.11.24 |
