HTML5 및 CSS3 사이트 계획 작성 방법 - 더미

종종 주요 사이트의 초기 작업에는 HTML5 및 CSS3 사이트 디자인에 대한 계획 수립이 포함됩니다. 이 단계를 빨리 시작하면 프로젝트의 실제 범위를 볼 수 있습니다. 사이트 계획 은 웹 사이트의 개요입니다. 일반적으로 계층 구조 차트로 그려집니다.

주요 대학의학과를위한 웹 사이트 디자인을 도와 줄 것을 요청한다고 가정 해보십시오. 첫 번째 질문은 "웹 사이트에서 원하는 것은 무엇입니까? "모든 것을 적어 라.

고객에게 그들이 원하는 것을 물어보십시오. 모든 참가자가 자신의 사이트가 필요하다고 생각하는 모든 것을 제안한 후에는 방 밖으로 내쫓 으십시오. 종이와 연필 만 사용하여 정보를 어떻게 구성해야한다고 생각 하느냐에 따라보다 체계적인 스케치를 만듭니다.

사이트 개요 작성 방법

사이트 개요 다이어그램을 만드는 동안 다음 제안 사항을 고려하십시오.

• 7 가지 법칙을 사용하십시오. 이 법안은 사람들이 일반적으로 한 번에 7 개 이상의 선택을 처리 할 수 ​​없음을 시사합니다. 모든 수준에서 7 개 이상의 주요 정보 세그먼트를 보유하지 않도록하십시오. 이들 각각은 7 개의 덩어리로 분리 될 수 있으며, 이들 각각은 7 개의 덩어리를 가질 수 있습니다.

• 공통점을 확인하십시오. 데이터를 검토하는 동안 일반적인 그룹이 나옵니다. 대학의 예에서 많은 코스 데이터, 학위 정보, 교수 정보 및 연구 자료를 쉽게 볼 수 있습니다.

• 각 주제를 그룹에 지정하십시오. 이것은 데이터 정규화 형식입니다. 이 데이터 구조는 반드시 공식적인 데이터 구조는 아니지만 가능할 수 있습니다.

• 계층 구조를 배열합니다. 가장 일반적인 주제에서 가장 구체적인 주제로 그룹화하십시오. 예를 들어, 코스 정보 라는 용어는 매우 광범위합니다. N100은 특정 과정이며 많은 섹션 (특정 날짜, 시간 및 강사 조합)을 가질 수 있습니다. 따라서 섹션을 N100 아래에 그룹화하고 N100을 코스 아래에 그룹화하는 것이 좋습니다.

• 대표적인 데이터를 제공한다. 여기서 모든 정보가 필요하지는 않습니다. 요점은 데이터 간의 관계를 볼 수 있도록 충분한 데이터를 확보하는 것입니다.

• 이 도표는 사이트 디자인을 대표하지 않습니다. 이러한 유형의 다이어그램의 목적은 데이터 자체가 어떻게 합쳐 지는지를 보는 것입니다. 물론,이 다이어그램은 페이지 설정과 메뉴 구조를 알려주지 만 그렇게 할 필요는 없습니다. 각 상자가 하나의 페이지가 아닙니다.

• 그럴 수도 있겠지만 그렇게 할 필요는 없습니다. 나중에이 과정에서 사이트의 구성 방법을 결정할 수 있습니다. 이러한 종류의 사이트 다이어그램을 제작하는 것은 대규모 사이트에 절대적으로 중요합니다. 그렇지 않으면 프로젝트의 범위를 실제로 파악할 수 없습니다.주요 이해 관계자가 전달하고자하는

정보 가 정확하게 반영되어 있는지 확인하십시오. 사이트 다이어그램 작성 방법

사이트 다이어그램은 사이트 개요의보다 구체적인 버전입니다. 이 시점에서 시스템 및 조직 관계에서 원하는 특정 페이지에 대한 약속을합니다.

사이트 다이어그램은 다음과 같은 이유로 개요와 약간 다릅니다.

각 상자는 페이지를 나타냅니다.

• 이제 페이지 구성 방법에 대한 결정을 내려야합니다. 개요의 어느 수준에서 별도의 페이지가 있는지 확인하십시오. 예를 들어, 모든 코스 섹션은 한 페이지에 있습니까? 아니면 N100의 모든 섹션입니까? 각 코스의 각 섹션마다 다른 페이지가 있습니까? 이러한 결정은 페이지 구성에 사용할 기술을 결정하는 데 도움이됩니다. 사이트 다이어그램에는 여전히 모든 페이지가 필요하지 않습니다.

• 30 개의 수업이있는 경우 어디로 가는지 모두 알고 있고 모두 동일한 목적과 디자인을 가지고 있다면 각 수업에 대해 설명 할 필요가 없습니다. 탐색 구조가 명확해야합니다.

• 계층 구조는 명확한 탐색 구조를 제공해야합니다. 물론 보조 탐색 구조를 추가 할 수는 있습니다. 각 상자의 이름을 지정하십시오.

• 각 페이지에는 이름이 있어야합니다. 이 상자 이름은 페이지 제목으로 번역되며 통합 제목 시스템을 구성하는 데 도움이됩니다. 이 배열은 탐색 체계에 유용합니다. 각 상자의 전체 레이아웃을 식별합니다.

• 일반적으로 사이트는 몇 개의 레이아웃 만 사용합니다. 대부분의 페이지에는 표준 레이아웃이 있습니다. 종종 프론트 페이지의 레이아웃이 다릅니다 (뉴스 및 탐색 정보 용). 또한 전문 레이아웃이있을 수 있습니다. 예를 들어 교직원 페이지에는 모두 눈에 띄는 이미지가있는 특정 레이아웃이 있습니다. 여기에 레이아웃을 계획하지 마십시오. 단지 그것을 식별하십시오. 주문을 정리하십시오.

• 페이지 순서가 중요하다면 사이트 다이어그램을 사용해보세요. 이 사이트 계획 프로세스의 목표는 각 페이지에 필요한 것을 명확하게 이해하는 것입니다. 이 정보를 통해 데이터 및 시각적 디자인 단계를 쉽게 완료 할 수 있습니다. 사이트 다이어그램은 절대적으로 중요한 문서입니다. 승인 된 후에 인쇄하여 모니터에 테이프로 붙이십시오. 나머지 프로젝트에 대한지도입니다.