모바일 퍼스트 썸네일형 리스트형 Prototype 스킨 제작 후기 초기에 블로그를 오픈할때 사용하였던 Cognoscenti 스킨은 제가 직접 하드 코딩을 하긴 했지만 여러가지 삐걱거림과 알 수없는 문제들에 시달렸습니다. 속도면에서는 일반 티스토리 스킨에 비해서 이미지를 거의 쓰지 않았기 떄문에 빨랐지만 코딩능력의 부족으로 꽤 볼품 없는 스킨 인것은 부정할수 없습니다. 스킨 제작을 위해서 열심히 구글링과 공부를 하다보니 프레임웍이라는 것을 알게 되었습니다. 기본적으로 사이트에서 사용되는 요소들을 미리 만들어 놓고 이를 활용하여 편하게 웹페이지를 제작할수 있게 하는 도구 입니다. 그래서 무슨 프레임 웍을 쓸까 알아보던중 선택한 것이 부트스트랩 이었습니다. 물론 여러가지 프레임 웍이 웹상에 있지만 부트스트랩으로 만들어진 트위터와 GitHub를 보면서 "그래도 많이 쓰는게 좋.. 더보기 Introducing Prototype 제 3번째 자작스킨인 Prototype을 공개합니다. 지금 부터 새 스킨의 주요 기능을 설명드리겠습니다. HTML5 시멘틱 구조 도입 시멘틱 구조를 통해서 SEO에 최적화 되어있습니다. 이전스킨도 HTML5 기반이었지만 소심하게 쓴것에 비해서 이번에는 Section, Article 시멘틱 태그를 적극활용했습니다. HTML5, CSS3 웹 표준 검사 통과 본 스킨의 HTML마크업과 CSS스타일링은 W3C 웹표준을 엄격히 준수합니다. Mobile-First 티스토리 최초의 모바일 퍼스트 스킨입니다. 구성요소를 크기만 줄여서 재활용하는 대신 각 스크린 사이즈에 맞는 요소들을 따로 만들어 더 쾌적한 사용환경을 제공합니다. *모바일퍼스트: 웹페이지를 제작할때 PC버전의 크기를 줄이는 기존 방식 대신 반대로 모바일.. 더보기 스킨 제작 상황 업데이트 프로토타입 스킨은 100% 모바일 퍼스트로 제작이 되었습니다. (모바일 퍼스트: 기존의 반응형 웹페이지가 PC 페이지를 축소시키는 방식 대신에 역순으로 모바일 페이지를 확장하는 방식으로 만드는 방식입니다.)모바일 뷰에서는 기본 메뉴 대신 별도의 메뉴를 따로 제공합니다.기본적인 마크업은 이제 다 끝났고 스타일링만 남았습니다.스타일링 끝나면 티스토리 최적화 작업도 해야하네요이전보다 많이 가볍긴한데.... 티스토리 CDN이 워낙 구려서... 실제 적용해봐야 퍼포먼스를 제대로 알수 있을듯 합니다. ^^ P.S 그나저나 Placeholder로 괭이 사진을 쓰고 있는데... 자꾸 괭이를 보니 집사가 되고 싶네요... 더보기 이전 1 다음