웹 사이트 레이아웃은 웹 사이트에있는 정보만큼이나 중요합니다. 사용자 친화적 인 웹 사이트를 원할 경우 쉽게 탐색 할 수있는 레이아웃을 선택하십시오. 아마도 일부 레이아웃은 이해하기 쉽고 사용하기가 빠르다는 것을 알았지 만, 다른 레이아웃은 시간 소모적이며 사용하기에 드는 가치는 거의 없습니다..
사용하기 쉬운 웹 사이트는 전체적으로 더 많이 방문하여 돌아올 수 있습니다. 일반적으로 사용하기가 더 쉬운 레이아웃은 더 쉽게 만들 수 있습니다..
웹 사이트는 레이아웃에 다양한면을 가지고 있습니다 ... 처음에는 디자인에 관심이 있습니다. 귀하의 웹 페이지에 귀하가 원했던 모든 것들이 있습니까? 그것이 어떻게 구성되고 필요한 모든 것이 어디에 위치해 있는지 알고 있습니까? 개별 페이지마다 다른 레이아웃을 사용할 수 있습니다. 동일한 웹 사이트에 속해 있다고해서 반드시 동일한 모양과 느낌을 갖는 것은 아닙니다. 일관성이 도움이되지만 필수는 아니며 사람들은 웹 사이트에서 다양한 레이아웃과 템플릿을 사용합니다..
와이어 프레임에서 포토샵으로 웹 사이트 레이아웃을 만드는 방법 [2 부]
웹 사이트는 교과서와 유사하며 각 페이지는 주제 나 이벤트와 같은 고유 한 장에 해당합니다. 균일 성을 선택하거나 다양한 템플릿과 레이아웃을 선택하는 것은 실제로 찾고있는 것과 웹 사이트 자체에 넣고 싶은 일에 달려 있습니다. 활용중인 웹 사이트 빌더가 여러 레이아웃을 지원하는지 여부를 확인하고 평가하는 것이 좋습니다. 단일 레이아웃을 기반으로하는 몇 가지가 있습니다..
너는 그것의 내용 인 너의 웹 사이트의 목적을 손상시킬만큼 너무 바쁘지 않은 배치를 원할 것이다. 내용은 분명히 귀하의 웹 사이트에서 가장 중요한 항목입니다. 귀하의 방문자가 내용을 보러 오므로 계속 집중하십시오..
레이아웃은 또한 발표 할 내용을 기반으로합니다. 공간이 필요한 텍스트의 양에 비해 공간이 필요한 텍스트의 양에 따라 레이아웃을 선택하십시오. 또한 필요한 링크 및 페이지 선택을 제공하는 레이아웃이 있어야합니다. 올바른 템플릿을 사용하여 추가 페이지를 추가하면 작업을 상당히 줄일 수 있습니다..
색상이 밝고 눈부신 경우 웹 사이트 배경이 더 매력적이며 매력적입니다. 그러나 색 때문에 텍스트를 읽을 수 없거나 눈에 어려울 경우 방문자가 없어 질 것입니다.
필요한 경우 템플리트의 유형, 색상 및 패턴을 선택한 후에 링크, 페이지 단추, 배너 및 메뉴가 필요한 모든 것이 올바른 위치에 있는지 확인하는 것이 중요합니다. 여러 부분에 대한 위치를 선택할 수있는 수많은 템플릿 선택 사항이 있습니다. 웹 사이트의 레이아웃을 완료하려면 다음 옵션을 선택하십시오. 웹 사이트 레이아웃을 만드는 방법 지난 10 년 동안 웹 디자인을 할 때 고정 레이아웃이나 유동 레이아웃 중 어떤 것을 사용할지에 대한 질문이 웹 디자인 세계에서 두드러졌습니다. 주요 디자인 참가자는 속담 울타리의 양쪽에있었습니다. 최근에는 화면 해상도가 급격히 높아짐에 따라 고정 레이아웃은 액체를 대체하지만 액체 레이아웃은 여전히 적절하게 설계되어있는 경우 큰 이점을 제공합니다.
예선
내가 포함하는 용어를 사용할 때? 요소, 나는 텍스트, 이미지 및 기타 내용을 보유하는 열 또는 상자를 언급합니다. 포함하는 요소에는 테두리와 배경 이미지가있을 수 있지만 대개 화면의 중요한 내용에 대한 시각적 컨테이너 일뿐입니다.
고정 너비 레이아웃
고정 레이아웃에서, 각각의 크기는? 웹 페이지의 요소가 정확하게 지정됩니다. 브라우저 창 크기를 조정하면 페이지가 변경되지 않습니다. 기본적으로 모든 브라우저 또는 컴퓨터에서 동일하게 보입니다..
액체 레이아웃
액체 레이아웃에서는 포함 요소의 크기가 브라우저 크기 및 사용자 환경 설정에 따라 변경됩니다. 큰 화면 해상도에서는 컨테이너 크기가 커지고 브라우저 크기를 조정하면 컨테이너 크기가 줄어 듭니다..
장점과 단점 (장단점) :
고정 너비 레이아웃
찬성
* 읽기 쉬운 선 길이 보장
* 이미지를 다른 요소 및 유형 크기와 관련하여 정확하게 배치 할 수 있습니다.
* 디자이너가 페이지 표시 방법을 완전히 제어 할 수 있습니다 (사용자와 대조적으로).
* 예측 가능한 기본 인쇄 동작을 허용합니다..
단점
* 최적이 아닌 유형 크기를 만들 수 있습니다.
* 페이지 크기와 텍스트 크기를 사용자가 제어 할 수 있습니다..
* 화면의 공간을 활용하지 않으며 화면 공간의 큰 사용되지 않는 부분을 생성하여 사용자가 스크롤해야하는 양을 잠재적으로 늘릴 수 있습니다 (특히 고해상도에서는이 사실이 중요 함)
액체 레이아웃 :
찬성
* 공간 또는 화면 공간을 최대한 활용할 수 있습니다. 또한 사용자가 자신의 환경 설정으로 웹 사이트의 크기를 조정할 수 있기 때문에 사용자가 크기를 조정하는 것을 가장 많이 제어 할 수 있습니다..
* 사용자 환경 설정에 따라 텍스트 크기를 변경할 수 있으므로 시력 문제가있는 사람들이 레이아웃이 증가 된 크기 주변에서 자동으로 조정되는 동안 페이지에서 텍스트 크기를 늘리거나 줄일 수 있습니다..
* 올바르게 설계된 경우 대부분의 웹 사이트가 고정 레이아웃을 사용한다고 가정 할 때 웹 사이트를 경쟁 업체와 약간 다르게 설정합니다..
단점
* 화면 크기가 너무 크거나 작아서 읽을 수없는 텍스트를 만들거나 읽기 / 스캔 선 길이가 생기기 쉽습니다
* 기본 페이지 인쇄에 문제가 발생할 수 있습니다. (별도의 인쇄 스타일 시트를 사용하여 액체 레이아웃에도 불구하고 모든 페이지에서 완벽한 인쇄가 가능하지만 인쇄용 스타일 시트가 제공되지 않는 경우이 조건이 유효 함)
* 웹 사이트 크기가 변경되면 이미지 크기가 텍스트 비율에 따라 덜보기 좋게 나타날 수 있습니다..
최신 스크린 해상도 및 고정 너비 레이아웃의 보급
현대 웹 디자인의 레이아웃 디자인이 직면 한 문제는 잠재적 인 웹 사이트 방문자들 사이의 공통 화면 해상도의 큰 차이입니다. 허용되는 가장 작은 현대적인 해상도는 800 x 600 픽셀입니다. 최근 와이드 스크린 및 대형 모니터 해상도가 급상승함에 따라 화면 너비는 1280 픽셀 더하기 매우 일반적입니다..
Q. 그럼 어떻게 800 픽셀 너비와 1280 픽셀 너비로 잘 보이는 사이트를 디자인합니까??
A. 대부분의 웹 디자이너들은 800 픽셀 너비의 고정 된 레이아웃을 사용하고 있습니다. 그렇게 말하면서 저는 개인적으로 디자인했고,보기 좋고 멋진 해상도를 읽을 수 있습니다. 이 레이아웃의 구체적인 내용은이 기사의 범위를 벗어나지 만,이 작업을 성공적으로 수행하기 위해 보거나 생성 한 대부분의 디자인은 화면의 일정 비율로 정의되는 :패딩:과 함께 여러 내용 열을 사용합니다. 따라서 화면이 작 으면 여러 열이 매우 가깝습니다. 그러나 화면이 커지면 패딩이 비례 적으로 증가하고 열이 더 멀리 떨어져 있습니다.
권장 사항 및 분석
대부분의 웹 사이트는 고정 또는 :반:고정 레이아웃으로 설계해야합니다. 그것은 가독성과 완벽한 콘텐츠 표현을 보장합니다. 즉, 웹 사이트에 많은 양의 텍스트 기반 콘텐츠 (페이지 당 3-5 개 이상의 단락)가 포함되어 있거나 웹 사이트가 비표준 디자인 방식의 이점을 크게 누릴 경우 액체를 사용하십시오.
그래도 확실하지 않다면 고정을 선택하십시오. 고정 레이아웃은 유지 보수가 쉽고 모든 사용자가 쉽게 읽을 수 있으며 웹 디자이너가 코드를 더 쉽게 작성할 수 있습니다. 액체 레이아웃이 제대로 이루어지지 않으면 잠재적 인 사용자를 고치고 괴롭히는 문제가 더 많이 발생할 것입니다. 예를 들어 내 개인용 애완 동물 중 하나는 디자이너가 단일 컬럼 액체 레이아웃을 사용하는 경우입니다. 개인용 컴퓨터 워크 스테이션은 19 인치 및 17 인치 와이드 스크린의 두 모니터로 구성됩니다. 웹 사이트가 단일 액체 칼럼으로 설계되었을 때 페이지의 너비가 일반적으로 읽기가 쉽지 않으므로 수동으로 창 크기를 조정해야합니다.