2012-01-31 2 views
4

CSS를 코딩 할 때 왜/고정 된 또는 유동적 인 스타일 시트를 코딩해야하는지에 대한 의견은 궁금합니다.유동 CSS 레이아웃은 고정식으로 언제 선택합니까? 왜?

고정 된 크기의 스타일 시트는 모든 요소가 부모에게 잘 적응되도록하기 위해 액체가 더 많은 시간을 필요로하기 때문에 작성하기가 쉽고 빠르다는 것에 동의합니다.

그래서 액체를 고정시킬 때를 선택할 때 (또는 그 반대) 언제입니까? 왜?

+0

좋은 질문 일 수도 있지만 정답을 가지고있을 수도 있습니다. – Shaheer

답변

5

업데이트 2 나는 가장 좋은 방법은 지금 어떤 화면 크기에 대한 반응 및 적응 기능을 가진 사이트를 디자인이라고 생각합니다. 리퀴드 CSS에는 긴 텍스트 줄과 같은 생각할 함정이 없을 수 있습니다 (대신 블록의 텍스트 위치가 즉석에서 조정 됨) - 반응 형 디자인의 예 - 페이지가 화면 크기에 맞게 조정되는 브라우저 측 코드 :

  • http://bostonglobe.com/
  • 적응 디자인 : 사이트를 호스팅하는 서버는 PAG를 요청 브라우저 유형을 감지 e와 적절한 페이지 레이아웃을 제공합니다. 변하기 쉬운. 이것은 사용자 에이전트 식별자가 항상 정확한 것은 아니라는 점에서 함축적이다. 많은 브라우저는 예를 들어, id에 mozilla 문자열을 포함하므로이 데이터를 항상 신뢰할 수있는 것은 아닙니다.

    이전 대답

    액체 레이아웃

    • 장점 (수평 축소하거나 윈도우의 가로 너비에 맞게 스트레칭 레이아웃) : 콘텐츠가 완전히 활용할 수있는 즉석에서 포맷 the 창 너비. 즉 가장 많이 선택하는 딜레마는 인기 고정 폭입니다. 940px, 960px 또는 978px는 필요하지 않습니다. 이 은 특히 의 작은 화면 핸드 헬드 장치에 유용합니다. 가능한 모든 화면 크기를 고려할 때 작업량을 줄여야합니다.

    • 단점 사이트가 너비가 으로 줄어들거나 늘어날 수 있으므로 레이아웃을 너비가 고정 된 만큼 조절할 수 없습니다.미학과 사이트가 얼마나 멋지냐는 귀하의 통제하에있을 것입니다. 당신은 모든 화면 너비를 지원하기 위해 더 적은 작업을해야한다는 것에 대한 저의 요점은 결국 사실이 아님을 알게 될 것입니다. 여기에서는 화면이 실제로 작고 메뉴 탐색이 모두 엉망이거나 엉망이거나 너무 멀리 떨어져있는 시나리오를 고려하고 있습니다. 큰 화면

    고정 레이아웃 (사용 가능한 가로 너비에 맞게 변경되지 않는 레이아웃).

    • 장점 : 가장 보편적 인 너비에 정착하면. 940 픽셀, 960 픽셀 등 다양한 화면 너비로 사이트를 테스트 할 필요가 없습니다. 레이아웃이 깔끔하고 물건들이 움직이지 않는다, 미학, 멋지게 보이는 것이 얼마나 멋진가?

    • 단점 : 작은 화면을 가진 일부 사용자는 고정 된 너비가 더 큰 경우 사이트를 보려면 가로로 스크롤해야 할 수도 있습니다. 해당 사용자가 사용할 수있는 모바일 버전도 지원하지 않는 한

    주요 사이트를 둘러보십시오. 무엇을 사용하고 있습니까? 나에게 그 폭이 유체 사이트에서 볼 말했다

    stackoverflow.com

    을 포함하여, 더 인기가 고정 된 것 같다 : 여기 http://derekallard.com/

    , 개발자는 각 미끄러 그래픽 레이어를 사용하여 유리하게 유체 레이아웃을 사용하여 너의 창안에 조정 된 위치 폭으로 다른 사람.

    업데이트 : 잘못된 답변이나 옳은 답변은 없습니다. 둘 다 장점이 있습니다. 텔레비전, 영화, 신문에서 웹으로 온 미디어 포크는 그러한 미디어에 익숙하기 때문에 픽스 폭을 선호하는 경향이 있습니다.

    +0

    +1 답변을 자세히 설명하고 세부 사항을 설명합니다. 감사합니다 – Alex

    3

    이것은 기술의 문제가 아니며, 의사 결정의 문제입니다. 당신 (또는 클라이언트)이 액체를 원한다면 액체를 선택하십시오.

    나는 액체를 원하지 않는다. 왜? 매우 넓은 창을 사용하면 매우 긴 복사 텍스트 줄을 읽을 수 있습니다.

    확인 다른 부분을 고려해야합니다. 페이지에 액세스 할 수 있습니까? 그런 다음 페이지를 확대하는 레이아웃을 위해 일종의 액체 레이아웃을 만들어야합니다.

    또한 반응 형 웹 디자인을 찾을 수도 있습니다. 모바일 브라우저에서도 작동합니다.
    http://www.alistapart.com/articles/responsive-web-design/

    +0

    정확히 묻는 이유는 내 페이지에 액세스 할 수 있어야하고 액체를 선택해야하는지 궁금 해서요. – Alex

    +0

    +1 @yunzen "매우 넓은 창문을 읽으려면 매우 긴 텍스트 줄을 복사하십시오. " – therobyouknow

    +0

    접근 가능한 레이아웃이있는 경우, 일부 '액체 부품'이 포함 된 고정 레이아웃을 선택합니다. 달성해야 할 일은 사용자가 200 배까지 확대/축소 (IE 및 FF로 텍스트 확대/축소)하면 모든 중요한 내용이 너비가 약 1000 픽셀 인 창 안에 있어야합니다. 이것은 달성하기가 쉽지 않으며 페이지의 전체 레이아웃에 따라 다릅니다. – HerrSerker

    0

    일반적으로 고정 레이아웃은 설계 및 개발이 쉬우 며 방문자는 이러한 유형의 레이아웃에 익숙합니다.

    유체 레이아웃은 더 많은 계획이 필요하며 모든 종류의 웹 응용 프로그램에 적합하지 않습니다. 유체 접근법을 자주 사용하지 않습니다.

    2

    선택의 여지가있을 때 비즈니스 스타일 웹 앱을 제외하고는 거의 액체 레이아웃을 사용하지 않습니다.

    e.e. 고객이 많은 수평 정보를 주장하는 앱의 경우 테이블, 나는 명백한 이유를 위해 액체 배치로 갈 것이다. 더 많은 표준 웹 사이트의 경우 가능한 한 고정으로 고칠 것입니다.

    내가 정치적으로 올바르지 않기 때문에 나는 후자를 위해 액체를 사다 줄 ​​때 주로 복사 텍스트에 최대 폭을 적용 할 것이며 방문객의 99 %를 읽는 데 기쁨을 선사합니다. (상대적인) 산들 바람을 몇 가지 용도로 사용하는 것보다 내게 더 중요합니다. - 내가 접근 할 수있는 한, ­ 블록 그 중 일부만 사용하십시오. yunzen이 말했듯이 복사 텍스트의 줄 길이는 디자인과 가독성 모두에서 매우 중요한 입니다. 그 선들이 무한대로 늘어나게하지 마라.

    대부분 내 고정 레이아웃 사이트는 간단한 액체 스트레칭보다는 작은 화면 크기를 수용하는 다양한 방법을 가지고있다. 장치 뷰포트에 맞게 복사 텍스트 너비를 조정합니다. 항상 그런 것은 아니지만 때로는 CSS 미디어 쿼리가 필요합니다.

    (예 :http://www.quirksmode.org/mobile/viewports2.html)

    +0

    +1 내가 질문을 할 때 생각했던 것입니다. 확인해 주셔서 감사합니다. – Alex

    관련 문제