8월 27, 2024
소개 페이지 제작, 워드프레스 홈페이지 만들기 엘리멘터 디자인
지난 시간 헤더 디자인이 끝난 뒤 여러분과 함께 모바일 반응형으로 변경해 보았습니다. 오늘은 소개 페이지 디자인에 관해 이야기하는 것으로 워드프레스 홈페이지 만들기 과정을 이어가 보겠습니다. 웹사이트 디자인 영상은 카페에 업데이트 되었으며, 이전 과정도 함께 확인 가능합니다.
워드프레스 홈페이지 제작, 세부 페이지 디자인
랜딩 페이지와 마찬가지로 웹사이트에서 방문 페이지는 헤더와 소개 섹션이 가장 중요합니다. 방문자가 보고 싶은 내용이나 브랜드가 보여 주어야 할 콘텐츠를 배치하는 것이죠.
이번에 준비한 디자인에선 회사 소개, 서비스 소개, 연락처 소개로 구성 하였고 각각의 요소를 하나의 칼럼으로 준비해서 하나의 섹션에 3개의 칼럼을 디자인 했습니다.
이런 모습의 디자인인데, 영상에 소개 드렸지만 가장 기초적인 방식으로 그룹핑을 해서 가독성을 높였습니다. 여러분이 요소 간격이나 그룹핑을 이해하기 위해서는 폰트나 이미지 크기에 따라 가장 효과적인 상하 여백이 무엇인지 여러 디자인을 벤치 마킹해서 배워야 하는 과정이 필요합니다.
따라서 이번 프로젝트에서는 먼저 제가 설정해 놓은 값으로 무작정 따라하기 방식으로 진행해 주셨으면 합니다. 이전에도 말씀 드린 것처럼 우선 하나의 페이지를 구성해본 것과 그렇지 않은 것에 차이는 분명할 것입니다.
다음 시간에는......
하단 이미지는 다음 시간에 디자인 해야 할 띠 배너 형식의 디자인으로 크게 어려운 것은 없지만 요소 간격이 동일해야 하고, 왜 이미지 전체를 불러오지 않고, 투명 이미지에 섹션 배경 컬러를 넣어 디자인해야 하는지 이유를 설명하려는 디자인 입니다.
포스팅 하단에는 오늘 이야기한 소개 페이지 디자인을 영상을 통해 설명하는 본사 강의 자료실에 해당 디자인을 확인할 수 있는 링크를 준비했습니다.
가장 기초적인 실무 디자인을 위해 엘리멘터 기본 위젯만으로 디자인 했으며, 검색엔진 최적화에 대한 기본기에 충실하게 준비하고 있으니 워드프레스 홈페이지 만들기에 관심 있는 모든 분에게 도움이 되었으면 합니다.
해당 이미지는 반응형 디자인까지 마친 이번 소개 페이지 모습입니다. 여러분이 실무 UI, UX 워드프레스 디자인 과정을 직접 확인할 수 있는 무료 강의는 아마도 OMG DESIGN이 최초가 아닐까 생각합니다.
아무쪼록 가장 핵심적인 웹사이트 디자인을 소개하고 있는 이번 프로젝트에 함께 참여해서 그동안 배우고 싶어도 기회가 없었던 실무 디자인을 따라하며 쉽게 이해하는 시간이 되기를 바랍니다.
본사는 무료 온라인 강의와 함께 2024년 오프라인 클래스를 준비하고 있습니다. 3인 1팀으로 레슨비에 대한 부담을 확실히 줄였고, 총 8회 동안 진행 예정인 정규 스터디에서 자신이 직접 홈페이지를 제작하지 못하는 경우 모든 비용은 되돌려 드립니다.
광주광역시 인근 지역은 물론이고 주말 클래스이기 때문에 열정이 있는 분이라면 지방 수강 신청도 환영합니다. 이것으로 오늘 준비한 워드프레스 홈페이지 만들기 “세부 페이지 디자인” 관련 칼럼을 마칩니다.
클래스 회원에 가입하세요.
OMG DESIGN 스터디 카페
Related posts
7월 25, 2024
7월 9, 2024
7월 5, 2024
7월 2, 2024
