스마트폰에 최적화된 반응형웹사이트 템플릿 무료 소스 모음

 

반응형 홈페이지 제작에 유용한 무료 템플릿 모음

 

 

요즘 웹디자이너에게 핫이슈라고 할수 있는 반응형 웹사이트는 모든 브라우져와 모바일 기기에서 자동으로 크기를 변환해주는 방식을 말합니다. 최근 스마트폰 사용자가 많아지면서 모바일 방문자 유입이 급속도록 증가함에 따라 반응형 홈페이지에 대한 관심도 날로 증가하고 있습니다. 하지만 아직까지는 미디어쿼리를 지원하지 않는 익스플로러 구버전 등 호환성에 문제가 많아 현 상황을 지켜보는 사람들도 많은데요.

 

윈도우 XP 업데이트 종료 이후에 구버전의 익스플로러 사용자들이 대거 8이상을 사용한다면 빠른시간안에 반응형 웹디자인이 대세가 되지 않을까 생각이 드네요.

 

오늘은 평면디자인, 반응형 레이아웃, JQuery 슬라이더와 같은 놀라운 기능이 포함된 반응형 웹사이트 HTML 무료 템플릿을 소개해 드리겠습니다. 처음부터 새롭게 작업하는것 보다 템플릿을 이용하여 수정하시면 많은 시간을 절약하실수 있습니다. 웹소스를 이용하여 멋진 홈페이지를 제작해 보세요.~

 

 

 

 

 

 

 

 

Free Retina Ready Responsive App Landing Page Website Template

 

어플 또는 IT 기기 제품 홍보 웹페이지 제작에 유용한 반응형 템플릿입니다. 메인페이지와 모바일 페이지 두개로 나눠서 제작되었습니다.

 

 

 

 

 

 

 

 

 

 

Flat Design Portfolio Template

 

포트폴리오 템플릿으로 두 가지 버전으로 HTML/CSS 파일을 다운로드 할수 있습니다. 부드러운 스크롤 효과를 이용한 단일페이지 버전입니다.

 

 

 

 

 

 

 

 

Brushed | Responsive One Page Template

 

부트스트랩 프레임 워크를 기반으로 제작된 반응형 템플릿입니다. 아이폰, 아이패드, 아이팟 터치와 맥북 프로에 최적화되어 있습니다.

 

 

 

 

 

 

 

 

 

Big Picture HTML5 Template

 

메인화면을 큰이미지로 장식할수 있는 HTML5 웹사이트입니다.

 

 

 

 

 

 

 

 

Tesselatte - A free responsive site template

 

메인 이미지 외엔 텍스트 기반으로 비교적 쉽게 반응형 웹을 제작할수 있는 소스입니다.

 

 

 

 

 

 

 

 

 

OVERFLOW

 

매우 단조로운 레이아웃 구조지만 많은것을 표현할수 있는 홈페이지 소스입니다.

 

 

 

 

 

 

 

 

Runkeeper a mobile app Responsive web Template 

 

Runkeeper는 제품을 홍보할때 유용한 웹디자인 템플릿으로 모든 종류의 모바일에 호환성이 높은 소스입니다.

 

 

 

 

 

 

 

 

Pinball Responsive Grid Style Blog Flat web template

 

그리드 스타일의 블로그형 디자인 템플릿입니다. 이미지의 크기에 따라 게시물의 크기가 틀려지는 불규칙한 레이아웃 구조의 독특한 소스입니다.

 

 

 

 

 

 

 

 

 

Elita – HTML/CSS website

 

매우 간단한 웹사이트 구조로 제작된 HTML5 템플릿입니다.

 

 

 

 

 

 

 

 

zWiseSolutions – Free Responsive Html5 Theme

 

회수 소개 및 제품 홍보 페이지에 적합한 웹디자인 테마입니다. 3개의 이미지가 롤링 되는 슬라이더 배너가 달려있습니다.

 

 

 

 

 

 

 

 

zValencia – Free Responsive Html5 Theme

 

레스토랑, 음식점, 푸드에 관련된 홈페이지 제작에 유용하며 상단 버턴 및 배경은 따로 사용해도 좋을만큼 퀄리티 높은 자료입니다.

 

 

 

 

 

 

 

 

Prologue | HTML5

 

간단한 단일 페이지 반응형 사이트 템플릿입니다. 포트폴리오, 미니 홈페이지 제작에 유용합니다.

 

 

 

 

 

 

 

 

 

HELIOS

 

심플하고 현대적인 디자인으로 제작된 소스로 모바일 기기에 최적화되어 있습니다.

 

 

 

 

 

 

 

 

 

Dopetrope

 

최소한의 디자인 미학을 가진 깔끔한 블로그형 웹소스입니다. 잡지와 플랫 스타일의 혼합형태로 독특한 페이지를 만드실수 있습니다.

 

 

 

 

 

 

 

 

 

Jetro Flat Corporate Responsive website template

 

일러스트, 만화 같이 평면적인 디자인을 전시할수 있는 홈페이지에 유용하며 매우 깔금한 레이아웃으로 제작되었습니다.

 

 

 

 

 

 

 

 

 

Appz Single page Responsive website template

 

Appz는 HTML5, CSS3을 이용한 반응형 템플릿으로 모든 장치를 지원하기 위해 세가지 다른 형식의 제공합니다.

 

 

 

 

 

 

 

 

iOS7 App Responsive Landingpage web template

 

Ios7앱은 모든 모바일 응용 프로그램을 이용한 마케팅에 적합합니다. IOS 또는 안드로이드 모바일의 새로운 앱을 소개하는 쇼케이스를 만들수 있습니다.

 

 

 

 

 

 

 

 

 

<관련글>

2013/12/10 - 웹디자이너를 위한 모바일 디자인 컨텐츠 포토샵 소스 모음

2013/11/14 - 웹디자이너를 위한 종합선물세트! 포토샵 PSD 무료 디자인 모음

2013/11/04 - 디자인에 실무에 도움되는 놀라운 포토샵 PSD 템플릿 모음

2013/10/30 - 홈페이지 제작할때 꼭 확인해야하는 크로스 브라우저 호환성 테스트

2013/10/21 - HTML5와 CSS3의 새로운 기능을 이용한 홈페이지 무료 템플릿 디자인 22종

2013/10/07 - 간편하게 웹사이트 전체를 다운받을 수 있는 HTTrack 프로그램 소개

이 글을 공유하기

댓글(26)

  • 2014.02.18 01:09 신고

    잘 보고 갑니다 ^^

  • ZIMBIE
    2014.02.22 02:24 신고

    흥미로운 정보 감사합니다. 공부하는 학생으로서 많은 도움이 되었습니다. 모든 정보를 흡수하고 싶지만 아직 제 자신이 미숙하여 자주 들려 차근차근 익히겠습니다. 다양한 정보 기대하겠습니다.

    • 2014.02.24 09:21 신고

      ^^ 사실 저도 아직 완벽하게 습득을 못했습니다. 공부는 끝이 없는것 같아요. 종종 방문해주셔서 좋은 의견 부탁드립니다.~

  • 장젼
    2014.03.27 20:34

    너무 좋습니다. 이런소스!!많이 올려주세요 ^^

  • 웹디
    2014.10.17 14:22

    대박이군요감사합니다 잘쓰겠습니다

  • 아롱복
    2014.11.19 09:59

    주인장님 오랜만에 뵙겠습니다.
    뭐 좀 여쭈어 볼게요.... 요html.net 사이트, 개인 회사의 홈페이지로 사용을 해도 무방한가요??

    • 2014.11.19 16:07 신고

      허..아롱복님..정말 오랜만이셔요. 요즘 반가운 분들이 많이 찾아주시네요. 위에 있는 자료들은 상업적 사용이 가능한 프리소스입니다. 소규모 회사의 디자인 자료로 쓰는건 전혀 문제가 없으실꺼에요. ^^

  • 아롱복
    2014.11.19 16:35

    답변감사합니다. 자주 댓글은 남기지 못하지만, 매일 감사하게 자료들 참고하고 있습니다.
    고맙습니다.

    • 2014.11.20 15:43 신고

      ^^ 넹.. 자주 오신다니 감사드립니다. 내년쯤엔 웹통도 좀 변화가 필요한것 같아 준비중에 있어요. 기대해주세요.~

  • 아이재미
    2015.01.10 18:16

    겁나게 감사합니다.
    디자인에 디자와....컴퓨터에 컴자도 모르를 저로서는... 도전해볼 가치가 있는 자료입니다.
    진심으로 감사합니다.(_._)

  • 2015.04.14 15:25

    비밀댓글입니다

    • 2015.04.14 17:28 신고

      안녕하세요.^^ 저도 웹디라 깊이있게 웹언어를 공부하진 못했습니다. 잡다하게 php html5 css 액션스크립트 조금씩 아는정도인데요. 반응형 웹에 대해 저도 도움 받은 곳이 있어서 소개는 가능할것 같습니다. http://sir.co.kr/bbs/board.php?bo_table=pb_lecture&sca=%EB%B0%98%EC%9D%91%ED%98%95%EC%9B%B9

      여기 강좌를 보면 반응형 웹에 대한 이해도가 높아질수 있을것 같아요. ^^ 도움되셨으면 좋겠네요.

  • 감사합니다
    2015.06.02 10:14

    우와. 감사합니다. 요즘 반응형 웹 공부중인 직장인입니다. 감사합니다 ^^

  • 2015.06.08 11:39

    비밀댓글입니다

  • 2015.12.08 11:32

    비밀댓글입니다

  • 2016.03.18 15:58

    비밀댓글입니다

    • 2016.03.21 13:54 신고

      ^^ 아마도 PSD로 다운받으신게 아닌것 같습니다. 조금더 밑에 보면
      텍스트로 Download PSD : Here 라고 작은글씨가 있습니다. 그걸로 다운 받아 보세요.~

  • 2017.08.10 18:52 신고

    공유 너무 많이 감사합니다

    즐거운 하루 보내세요

Designed by JB FACTORY