우피+노션 과 아임웹은 각각 장단점이 존재합니다.
→ 워너비들에게 보여지는 페이지를 제작하려는 경우, 아래의 장단점을 참고해주세요.
우피+노션
장점
1. DB를 에어테이블과 연동할 수 있어, DB를 활용한 위젯을 만들 수 있습니다.
→ 항공권 등
2. 해당 레이아웃 방식을 좋아하는 20대 유저들도 많습니다.
3. 동기화로 프로그램 상세페이지를 관리하는데 용이합니다.
4. CX팀이 프로그램 관리와 홈페이지 관리를 한 번에 할 수 있습니다.
단점
1. 안정성이 좀 떨어집니다. 홈페이지 불러오는 속도도 조금 느립니다
(우피 서버 이전 이후로 조금 나아지긴 했습니다.)
2. 이미지를 불러오는 속도가 느리며, GIF/ 동영상의 경우 때로 오류로 보이지 않기도 합니다.
아임웹
장점
1. 안정성
속도가 기본적으로 노션보다 빠르며, 오류 가능성도 현재까지는 적은 것으로 판단됩니다.
2. 레이아웃의 다양성
노션으로 했던 거의 모든 레이아웃이 가능합니다.
또한 노션으로 하지 못했던 레이아웃도 코드 없이 적용할 수 있습니다.
3. 보안에 더욱 강합니다. 노션과 같은 경우 publish 가 되어있는 경우, meta 추가하지 않는 이상 웹에 노출되어 접근 가능합니다. (팀공지 페이지 등)
4. seo 최적화 세팅에 유리합니다. 메뉴 페이지 설명, 메타테그 등 노출을 유리하게 적용할 수 있습니다.
5. 앱개발도 가능합니다. 외에도 아임웹에서 지원하는 다양한 기능이 있습니다.
단점
1. 동기화가 되지 않습니다.
2. DB가 존재하지 않습니다. 갤러리/ 게시판/ 상품을 활용하여 위젯을 생성, 관리해야 합니다.
3. 모바일+태블릿 반응형을 따로 관리해주셔야 합니다.
4. 페이지를 복제해도 갤러리,게시판 내용까지 복제되지는 않습니다.
이전 필요한 페이지들
후기 페이지
직장인 프로그램 리스트
이벤트 페이지 내부 페이지들
지금 우리 워너고
1.
아임웹 이전 전 위젯 DB 부터 프로그램 전체 레이아웃을 변경하면 좋습니다.
summer todo (나중 유지보수 위해 번거롭지만 꼭 필요한 작업입니다)
아임웹 + 우피
•
마감임박 style="width: 100%; height: 100%;” 제거 → 프로그램 높이를 맞추기 위함
•
마감 div 로 변경 → 프로그램 레이아웃을 변경하기 위함
•
팀코드 정리 → 아임웹 db 생성
마감 글자 크기 작을 때
<h1>마감</h1> → <div>마감</div>
코드 적용 오류가 날 때
<button></button> → <div></div>
마감임박 / 대기가능 프로그램 높이가 다를 때
style="width: 100%; height: 100%;” 제거
@페를라 CX @제리 CX
오류 가능한 상황 리스트 정리
3.
노션과 아임웹은 페이지 레이아웃이 달라, 코드가 다를 수 있습니다.
스타일 코드도 다를 수 있으니,
노션에 있는 코드를 그대로 복사 붙여넣기 하면 오류가 생길 수 있으니 주의해주세요!
4.
우피에서 동작하던 코드가 아임웹에서는 동작하지 않는 이슈가 있습니다.
우피와 아임웹의 페이지 레이아웃이 상이합니다.
따라서 코드를 새로 작성하거나, 오류가 나는 부분의 코드 수정이 필요합니다.
우피의 style, script, html 코드를 그대로 복사- 붙여넣기 하는 경우, 오류가 발생할 수 있으니
붙여넣기 전 이전 항목을 백업해두시는 방법도 권장합니다.
5.
이중 로그인 문제 (6/18)
현재까지 아임웹은 이중 로그인 + 수정을 해도 자동 저장이 되는 것으로 보여지지만,
확실히 테스트 하기 전까지는 이중 로그인을 권장하지는 않습니다.
6.
ctrl + F가 안돼요
IDE 로 복사 붙여넣기 할 수 있는 방법이 있습니다.
@페를라 CX
혹시나 아임웹 저장 실수하셔서 백업해둔 것이 필요할 때도 용이하게 쓸 수 있으니, 사용하시는 것을 추천드립니다!
7.
코드 적용이 안돼요 (tag 색상 적용이 안돼요)
코드 적용이 안되는 경우,
<style></style> 코드 내부에 해당 관련 코드에
!important 를 적어주세요
예시
.hello{
color: black !important;
}
코드 백업
아임웹의 경우, 뒤로가기의 기능이 노션보다 섬세하지 않기에,
백업 및 복사 습관화를 추천드려요
