혼자 만들어본 그누보드 갤러리 게시판 반응형 스킨

(지난 글 보기 : 혼자 만들어본 그누보드 게시판 반응형 스킨)

이번에 올리는 스킨은 이전에 포트폴리오 카테고리에 올렸던 게시판 스킨의 갤러리 버전입니다. 

리스트 페이지의 게시글 관련 디자인만 바뀌었고, 나머지 부분은 동일합니다. 

제목 

- 그누보드 갤러리 게시판 반응형 스킨

간략 소개 

- 개발자의 디자인 실력 한계를 보여주는 갤러리 게시판 스킨입니다. 항상 심플함을 추구...

주요 정보 (일반 게시판 반응형 스킨과 거의 동일하여 간략하게 적습니다)

- 무료로 배포된 반응형 갤러리 스킨들을 여럿 참고하여 작업함. 

- 일부 디자인과 기능을 위해 부트스트랩, Font Awesome 사용

- 반응형 각 화면 크기별로 게시물이 딱 맞아떨어지게끔 출력하려면 12의 배수로 출력 해야 함. 

- 크롬, 파이어폭스, 오페라, ie8+ 작동 테스트 완료

화면 크기별 구분

- PC : 최대 width ~ 768px (최대 width 값은 기본 100% 이며, 직접 지정 가능) - 한 줄당 게시물 4개

- 태블릿 : 767px ~ 481px - 한 줄당 게시물 3개

- 모바일 : 480px 부터 - 한 줄당 게시물 2개

스크린샷 

- 스크린샷은 PC / 태블릿 / 모바일 화면 크기 순

리스트 페이지 화면입니다. 

이 반응형 갤러리 게시판 스킨은 링크를 통하여 직접 보실 수 있습니다. 

→ 스킨 데모 : http://sterster3832.iwinv.net/bbs/board.php?bo_table=gallery 사이트 유지보수 중

지난 번에 올렸던 일반 게시판 반응형 스킨에서 리스트 페이지만 갤러리형으로 변경하였습니다.

나름대로 신경을 많이 썼고 최대한 이쁘게 만들어보려고 했으나, 여기까지가 한계인 것 같습니다.

이미지 부분, 특히 썸네일 쪽으로 상당히 손이 많이 갔던 작업입니다. 

그누보드 기본 함수를 그대로 쓰니까 자꾸 썸네일에 여백이 생기고 예쁘게 나오질 않아서

이것 저것 만지다 보니 그나마 딱 맞게 출력이 되더군요. 

그리고 트래픽을 줄여보려고 움직이는 gif 이미지도 첫 프레임을 잘라서 썸네일로 만들기도 했었는데, 

하다보니 이걸 굳이 그렇게까지 할 필요가 있나 싶어서 움짤은 다시 그대로 출력되게 해놓았습니다. 

이 스킨 역시도 추후에 보수 및 수정 작업을 할 예정입니다. 

(언제가 될진 모르겠지만...)