워드프레스 웹사이트 개발을 하다보면 코드를 수정하고 웹브라우저에서 확인하는 과정을 수 없이 반복하죠. 주로 구글 크롬을 사용하는데 웹브라우저를 그냥 새로고침하면 적용된 것이 나타나지 않는데 이것은 캐시 때문입니다. 브라우저 캐시 기능은 현재의 웹 페이지를 있는 그대로 브라우저(내 컴퓨터)에 저장합니다. 이를 제거하려면서 새로고침하려면 매번 Ctrl+F5 또는 Ctrl+Shift+R 키를 눌러야 캐시가 제거되면서 새로고침됩니다.제경우..
이 글은 아주 오래된 글의 업그레이드 버전입니다. 아래의 글에서 제이쿼리와 CSS를 이용해 버튼을 클릭하면 좌우로 애니메이션 되는 기능을 설명했는데 제이쿼리에 사용된 toggle function이 1.8 버전에서 폐기예정 선언이 있으면서 1.9 버전에서 완전 폐기됐습니다. 따라서 최근 버전의 제이쿼리를 사용하면 작동하지 않습니다. https://martian36.com/523 CSS가 발전하면서 CSS3의 애니메이션 기능을 이용하면 더욱 다양..
바로가기위 버튼을 클릭하면 위 그림이 나오는 사이트로 이동합니다. 노란색의 Download the Source 링크를 클릭해 압축 파일을 다운로드 합니다.압축해제하고 폴더로 들어가면 위와 같이 나옵니다. html 파일을 클릭하면 눈내리는 효과가 나옵니다. 티스토리에 설치를 위해 필요한 파일은 하나입니다.js 폴더에 들어가 snowfall.jquery.js 파일을 티스토리에 업로드 합니다. <script src="//code.j..
아주 옛날에 웹개발의 기본인 HTML, CSS를 배우던 시절이 있었습니다. 가장 절실했던 것은 간단한 편집기이면서 작성한 코드를 바로 확인할 수 있는 편집기였습니다. 내가 작성한 코드가 어떻게 보이는지 일일히 저장하고 웹브라우저에서 확인하는 것이 너무 불편했죠. 오늘자 웹디자이너 뉴스 기사에 이런 편집기가 나타났습니다. 이 편집기는 웹브라우저인 파이어폭스의 제작사로 모질라에서 만든 것이더군요. 그래서 신뢰성이 더합니다. 설치할 필요도 없고 ..
부트스트랩 문서 파일을 필요에 의해 내 컴퓨터에서 볼 수 있도록 만들었습니다. 부트스트랩 공식 최종 버전인 Bootstrap 3.3.6과 부트스트랩 4 알파 버전 2입니다. WAMP 서버나 오토셋으로 웹서버 환경을 만들어 놓고 WAMP의 경우 www 폴더에, 오토셋의 경우 public_html 폴더에 붙여넣고 열어야 합니다. 부트스트랩 3의 경우 웹브라우저에서 http://localhost/bootstrap3/를 입력하고 엔터키를 ..
Roboto는 구글의 안드로이드 디자인 웹사이트에서 2012년 1월부터 사용하던 폰트입니다. 그 이전에는 Droid라는 폰트를 기본 폰트로 사용했습니다. Roboto의 개발자는 폰트 디자이너인 Christian Robertson이고 2010년부터 구글의 직원으로 일하고 있습니다. 2014년 구글이 머티리얼 디자인을 발표하면서 폰트를 재디자인해 머티리얼 디자인의 기본 폰트로 사용하고 있습니다. 그러던 중 2015년 1월 다시 업데이트 됐습니다.&nbs..
구글이 작년에 머티리얼 디자인(Google Material Design) 가이드 라인을 발표했습니다. 구글용 웹사이트나 앱에 적용할 통일화된 디자인으로 레이아웃, 스타일, 애니메이션, 등 웹 디자인에 필요한 모든 요소에 대해 정의를 하고 이에 따를 것을 요구하고 있습니다. 바로가기여기에는 아이콘도 포함되며 700여개의 아이콘이 있습니다.세세한 부분까지 규격을 만들어놓고 있습니다.바로가기색상에 대해서도 정해놓고 있습니다.바로가기가능한..
부트스트랩 템플릿 중 쓸만한 것이 나타나면 계속 소개하고 있습니다. 이번 템플릿은 컨택트 폼 스크립트까지 포함돼있습니다. 요즘은 HTML 템플릿을 검색하면 거의 부트스트랩으로 만들어진 것만 나타나고 있습니다. 그만큼 부트스트랩의 사용도가 높아지고 있습니다. 세계 최대의 템플릿 사이트인 씸포레스트에서 부트스트랩으로 검색하면 전체 19,000 여개의 템플릿 중 6천여개가 검색됩니다. 거의 3분의 1에 해당합니다. 2년전만해도 엄청 적은 숫자였습니다.여기..
워드프레스 완벽입문: HTML/CSS 기초부터 부트스트랩을 활용한 테마 제작까지
트위터 부트스트랩 책 발간(디자이너도 놀라워 할 매끈하고 직관적인 웹 사이트 디자인의 비밀)
워드프레스 쇼핑몰 만들기 책 발간(우커머스와 한국형 결제 플러그인으로 온라인 쇼핑몰 만들기)
DIY! 워드프레스 - 빠르고 간편하게 만드는 워드프레스 블로그/홈페이지 서적 출간(워드프레스 완벽입문 개정판 1권)
DIY! 워드프레스 쇼핑몰 - 프리미엄 테마로 만드는 쇼핑몰/웹사이트 서적 출간
서브라임 텍스트 - 프로그래머와 디자이너가 선택한 텍스트 에디터 서적
트위터 부트스트랩으로 만드는 워드프레스 테마
프리미엄 테마로 만드는 워드프레스 사이트