사용자에게 친절한 웹 사이트 만들기

도서관에서 웹 사이트 만들기에 관련된 책을 빌려 읽었는데요. 원제 Don’t make me think 의 2번째 개정판 “상식이 통하는 웹사이트가 성공한다” 와 3번째 개정판 “(사용자를) 생각하게 하지마” 입니다.  저자 스티브 크룩은 사용자 입장에서 웹 사이트를 평가하고 개선 사항을 알려주는 일을 하는데요.   이 책에서 웹 사이트를 만드는데 필요한 중요한 규칙들을 알려주고 있습니다. 책의 주요 내용과 제…

도서관에서 웹 사이트 만들기에 관련된 책을 빌려 읽었는데요.원제 Don't make me think 의 2번째 개정판 "상식이 통하는 웹사이트가 성공한다" 와 3번째 개정판 "(사용자를) 생각하게 하지마" 입니다. 저자 스티브 크룩은 사용자 입장에서 웹 사이트를 평가하고 개선 사항을 알려주는 일을 하는데요.  이 책에서 웹 사이트를 만드는데 필요한 중요한 규칙들을 알려주고 있습니다. 책의 주요 내용과 제 생각을 포스팅 합니다.  제…

[북리뷰] 프리미엄 테마로 만드는 워드프레스 사이트

나는 왜 이 책을 리뷰하는가 ?    이 책을 리뷰하고자 하는 이유가 있는데요. 그 이유는 이 책이 출판되기 1년 전에 워드프레스 관련 블로그 사이트를 만들고 이 책에 나오는 대부분의 내용들을 경험했기 때문입니다. 책에서 다루고 있는 유료테마 The7을 사용하면서 경험한 내용들을 정리한 블로그 글은  The7 테마 옵션정리, 비주얼컴포저 사용법1, 비주얼컴포저 사용법2, The7테마 메뉴만들기, Go Pricing 사용법 입니다.  …

나는 왜 이 책을 리뷰하는가 ?  이 책을 리뷰하고자 하는 이유가 있는데요. 그 이유는 이 책이 출판되기 1년 전에 워드프레스 관련 블로그 사이트를 만들고 이 책에 나오는 대부분의 내용들을 경험했기 때문입니다. 책에서 다루고 있는 유료테마 The7을 사용하면서 경험한 내용들을 정리한 블로그 글은  The7 테마 옵션정리, 비주얼컴포저 사용법1, 비주얼컴포저 사용법2, The7테마 메뉴만들기, Go Pricing 사용법 입니다.  제가 워드프레스에 관심을 갖게…

워드프레스 비주얼 컴포저 사용법 2

워드프레스 비주얼 컴포저(visual composer) 사용법 1에서 행, 열, 요소의 레이아웃과 행 설정에 대해 설명했는데요. 2에서는 프론트엔드 상태에서 열, 요소 설정에 대해 설명합니다. 프론트엔드는 관리자 화면없이 미리보기 상태에서 페이지를 만들기 때문에 훨씬 더 직관적입니다. 또한 프론트엔드 상태에서 화면을 모바일로 변경 후 레이아웃을 변경할 수 있습니다. 경험해보니 플러그인 판매사이트 코드캐년( codecayon )에서 1위를 유지하는 이유를 알겠습니다.  …

워드프레스 비주얼 컴포저(visual composer) 사용법 1에서 행, 열, 요소의 레이아웃과 행 설정에 대해 설명했는데요. 2에서는 프론트엔드 상태에서 열, 요소 설정에 대해 설명합니다. 프론트엔드는 관리자 화면없이 미리보기 상태에서 페이지를 만들기 때문에 훨씬 더 직관적입니다. 또한 프론트엔드 상태에서 화면을 모바일로 변경 후 레이아웃을 변경할 수 있습니다. 경험해보니 플러그인 판매사이트 코드캐년( codecayon )에서 1위를 유지하는 이유를 알겠습니다.  프론트엔드…

visual composer

워드프레스 비주얼 컴포저 사용법 1

워드프레스 비주얼 컴포저( visual composer )는 프로그래밍 지식없이 페이지를 쉽게 만들도록 도와주는 플러그입니다. 비주얼 컴포저를 설치하고 편집기를 보면 상단에 백엔드 에디터(backend editor)와 프론트엔드 에디터(frontend editor) 버튼이 보입니다. 백엔드 에디터는 관리자 화면에서 작업하고 새 창에서 확인하는 방식입니다. 프론트엔드 에디터는 페이지  미리 보기 화면에서 작업하고 같은 창에서 확인하는 방식입니다. 백엔드 에디터부터 설명할텐데요. 백엔드 에디터를 이해하면 프론트 에디터 사용법도…

워드프레스 비주얼 컴포저( visual composer )는 프로그래밍 지식없이 페이지를 쉽게 만들도록 도와주는 플러그입니다. 비주얼 컴포저를 설치하고 편집기를 보면 상단에 백엔드 에디터(backend editor)와 프론트엔드 에디터(frontend editor) 버튼이 보입니다. 백엔드 에디터는 관리자 화면에서 작업하고 새 창에서 확인하는 방식입니다. 프론트엔드 에디터는 페이지  미리 보기 화면에서 작업하고 같은 창에서 확인하는 방식입니다.백엔드 에디터부터 설명할텐데요. 백엔드 에디터를 이해하면 프론트 에디터 사용법도 쉽게…

움직이는 배너 만들기

웹사이트에 사용할 움직이는 배너를 만들어 봤는데요. 움직이는 배너를 만들게 된 이유는 제 사이트에 설치한 배너가 영어라 배너에 한글 번역이 나오도록 하고 싶어서 입니다. 움직이는 배너를 만들기 위해서 만화영화처럼 이미지 몇 장이 필요합니다. 저는 영어로 된 원본 이미지 한 장과 번역된 이미지 한 장이 교대로 나오도록 만들었습니다. 테마포레스트에서 제공하는 이미지 250×250 이미지를 포토샵으로 불러오기 했습니다.   포토샵에서 원본이미지를…

웹사이트에 사용할 움직이는 배너를 만들어 봤는데요. 움직이는 배너를 만들게 된 이유는 제 사이트에 설치한 배너가 영어라 배너에 한글 번역이 나오도록 하고 싶어서 입니다. 움직이는 배너를 만들기 위해서 만화영화처럼 이미지 몇 장이 필요합니다. 저는 영어로 된 원본 이미지 한 장과 번역된 이미지 한 장이 교대로 나오도록 만들었습니다. 테마포레스트에서 제공하는 이미지 250x250 이미지를 포토샵으로 불러오기 했습니다.   포토샵에서 원본이미지를…