동적 페이지 디자인

페이지를 디자인합니다.

웹 사이트를 디자인할 때는 정적 페이지든 동적 페이지든 간에 페이지를 시각적으로 디자인하는 단계가 중요합니다. 웹 페이지에 동적 요소를 추가할 경우에는 페이지의 디자인이 페이지의 유용성에 중대한 영향을 미칩니다. 따라서 개별 페이지 및 전체 웹 사이트와 사용자와의 상호 작용을 신중하게 고려해야 합니다.

동적 내용을 웹 페이지에 통합시키는 일반적인 방법은 먼저 내용이 들어갈 표를 만든 다음 동적 내용을 이 표의 셀로 가져오는 것입니다. 이 방법을 사용하면 다양한 형식의 정보를 구조화된 형태로 나타낼 수 있습니다.

동적 내용 소스를 만듭니다.

동적 웹 사이트에서는 웹 페이지에 해당 내용을 표시하기 위해 데이터를 추출할 소스가 필요합니다. 내용 소스를 웹 페이지에서 사용하려면 다음을 수행해야 합니다.

• 데이터베이스와 같은 동적 내용 소스 및 페이지를 처리할 애플리케이션 서버에 연결합니다. 바인딩 패널을 사용하여 데이터 소스를 만듭니다. 이렇게 하면 데이터 소스를 선택하여 페이지에 삽입할 수 있습니다.

• 표시할 데이터베이스의 정보 또는 레코드세트를 만들어서 페이지에 포함시킬 변수를 지정합니다. 또한 [레코드세트] 대화 상자에서 쿼리를 테스트할 수 있으며, 쿼리를 바인딩 패널에 추가하기 전에 필요한 조정을 할 수도 있습니다.

• 동적 내용 요소를 선택하여 선택한 페이지에 삽입합니다.

웹 페이지에 동적 내용을 추가합니다.

레코드세트와 기타 데이터 소스를 정의하여 바인딩 패널에 추가한 후 레코드세트가 나타내는 동적 내용을 페이지에 삽입할 수 있습니다. Dreamweaver의 메뉴 기반 인터페이스를 사용하면 바인딩 패널에서 동적 내용 소스를 선택하여 이를 현재 페이지의 적절한 텍스트, 이미지 또는 양식 오브젝트에 삽입함으로써 동적 내용 요소를 손쉽게 추가할 수 있습니다.

동적 내용 요소나 기타 서버 비헤이비어를 페이지에 삽입하면 Dreamweaver는 서버측 스크립트를 페이지의 소스 코드에 삽입합니다. 이 스크립트는 정의된 데이터 소스에서 데이터를 검색하여 웹 페이지에 렌더링하도록 서버에 지시합니다. 다음 중 한 가지를 수행하여 웹 페이지에 동적 내용을 넣을 수 있습니다.

• 코드 보기 또는 디자인 뷰에서 삽입 포인터 위치에 놓습니다.

• 텍스트 문자열이나 다른 자리 표시자로 대체합니다.

  동적 내용을 HTML 속성에 삽입합니다. 예를 들어 동적 내용은 이미지의 src 속성이나 양식 필드의 value 속성을 정의할 수 있습니다.

페이지에 서버 비헤이비어를 추가합니다.

동적 내용을 추가하는 것 외에도 서버 비헤이비어를 사용하여 복잡한 애플리케이션 논리를 웹 페이지에 통합할 수 있습니다. 서버 비헤이비어는 애플리케이션 논리를 웹 페이지에 추가하는 미리 정의된 서버 측 코드로, 상호 작용과 기능을 향상시킵니다.

Dreamweaver 서버 비헤이비어를 사용하면 코드를 직접 작성하지 않고도 애플리케이션 논리를 웹 사이트에 추가할 수 있습니다. Dreamweaver에서 제공하는 서버 비헤이비어는 ColdFusion, ASP 및 PHP 문서 유형을 지원합니다. 서버 비헤이비어는 빠르고, 안전하며, 강력한 기능을 갖도록 작성되었습니다. 내장 서버 비헤이비어는 모든 브라우저에 대해 플랫폼 간 호환 웹 페이지를 지원합니다.

Dreamweaver는 동적 내용 및 복잡한 비헤이비어를 텍스트나 디자인 요소를 삽입할 때처럼 페이지에 쉽게 적용할 수 있도록 해주는 포인트-클릭 인터페이스를 제공합니다. 다음과 같은 서버 비헤이비어를 사용할 수 있습니다.

• 기존 데이터베이스에서 레코드세트를 정의합니다. 정의한 레코드세트가 바인딩 패널에 저장됩니다.

• 한 페이지에 여러 레코드를 표시합니다. 동적 내용을 포함하는 개별 셀이나 행 또는 전체 표를 선택하고 각 페이지 보기에 표시할 레코드 수를 지정합니다.

• 동적 표를 만들어 페이지에 삽입하고 표를 레코드세트에 연결합니다. 표 모양과 반복되는 영역은 나중에 속성 관리자와 반복 영역 서버 비헤이비어를 사용하여 수정할 수 있습니다.

• 동적 텍스트 오브젝트를 페이지에 삽입합니다. 삽입하는 텍스트 오브젝트는 미리 정의된 레코드세트의 항목이며 모든 데이터 서식을 적용할 수 있습니다.

• 레코드 내비게이션 및 상태 컨트롤, 마스터/세부 정보 페이지, 데이터베이스의 정보 업데이트용 양식을 만듭니다.

• 데이터베이스 레코드에서 두 개 이상의 레코드를 표시합니다.

• 사용자가 데이터베이스 레코드에서 이전 또는 다음 레코드를 볼 수 있도록 레코드세트 내비게이션 링크를 만듭니다.

• 사용자가 반환된 레코드 수를 추적하거나 반환된 결과에서 레코드의 위치를 추적할 수 있도록 도와 주는 레코드 카운터를 추가합니다.

비헤이비어를 직접 작성하거나 타사에서 작성한 서버 비헤이비어를 설치하여 Dreamweaver 서버 비헤이비어를 확장할 수도 있습니다.

페이지를 테스트 및 디버그합니다.

동적 페이지 또는 전체 웹 사이트를 만들어서 웹에 게시하기 전에 먼저 예상대로 작동하는지 기능을 테스트해야 합니다. 또한 장애가 있는 사용자가 해당 애플리케이션의 기능을 제대로 사용할 수 있는지 고려해야 합니다.