2012-07-18 4 views
12

Google Sites과 함께 반응 형 디자인 원칙을 사용할 수 있습니까? 누구든지 그것을 시도 했습니까? 나를 샘플 사이트로 안내해 주시겠습니까? 나는 this google help topic을 보았지만, 그것은 독점적으로 모바일 사이트에 관한 것입니다.Google 사이트 내에서 반응 형 디자인 사용

주로 주로 모바일 사이트가 아닌 웹용으로 최적화 된 일반적인 웹 사이트입니다.

CSS를 변경할 수있는 경우 Blogger를 사용하는 것이 더 나은 옵션입니다.

+1

응답 성이 좋으려면 CSS에 직접 액세스해야하므로 "Blogger"로 자신의 질문에 답변했다고 생각합니다. – Lowkase

답변

6

당신의 부정적인 인상이 옳다고 생각합니다. 반응 형 디자인에서 기대하는 기능을 구현하지는 않습니다.

중요한 점은 Google 사이트 도구는 뷰포트 선언 (head 요소의 메타 뷰포트)을 사용하지 않는다는 것입니다. 보유하고 있지 않다면 장치 브라우저는 기존 데스크톱 전용 웹 사이트로 취급합니다. 그들은 ~ 830px 아래로 완전하게 나뉘어지고 그에 따라 페이지 최소 너비를 설정한다고 가정합니다. 그건 나에게 반응이 좋은 디자인처럼 들리지는 않는다.

Google 사이트 도구를 사용하여 자신 만의 CSS 또는 HTML HEAD를 작성할 수 없으므로보다 반응이 빠른 디자인을 직접 구현할 수 없습니다.

공평하게 말하면 고정 된 페이지 너비를 설정하지 않을 수 있습니다. 또한 "네비게이션"기능을 사용하는 경우 상대적으로 좁은 창에서 탐색 버튼을 리플 로우합니다. 후자는 훌륭한 디자인은 아니지만 적어도 품위있게 저하됩니다.

사이트 관리 -> 일반 아래의 "휴대폰을 자동으로 사이트 조정"옵션이 있습니다. 그러나 많은 사람들이 그것을 사용하지 않는 것이 좋습니다 :). old site 페이지에서 미리보기를 설정하고 페이지를 미리보고 "모바일에서 미리보기"를 선택했습니다. 필자의 원래 넷북 (800px 너비)의 Firefox에서는 응답이 없었습니다. 그것은 800px 화면을 제대로 사용하도록 확장되지 않았습니다.

줄 바꿈 (또는 줄임말)은 내 사이트의 기존 문제입니다. 당신은 나를 시험하지 않는 것에 대해 이것을 비난 할 수있다. :). 그러나 Google 사이트 도구에서 WYSIWYG 편집기의 제한 사항을 보여줍니다. 표시, 확인 또는이 문제의 원인이되는 서식을 필터링하지 않습니다.

google site mobile preview

-3

지금은 가능하면 일이 반응 Google 사이트를 확인합니다. Google에서 사이트 관리 옵션 버튼의 "휴대 전화로 사이트 자동 조정"옵션을 개선했기 때문에

옵션을 찾으려면 사이트 관리> 일반>으로 이동하고 일반 설정 페이지의 하단에서 "사이트를 휴대폰으로 자동 조정"이라는 라디오 버튼을 볼 수 있습니다. 그냥 라디오 버튼을 틱 & u 향상된 기능이 있습니다.

반응 구글 사이트 www.jyotiprokashmusic.com

+0

StackOverflow.A에 오신 것을 환영합니다. 여기에 대한 설명은 동료 프로그래머가 어떻게 작동하는지 이해하는 데 도움이 될 수 있습니다. – Daenarys

+0

또한이 응답은 매우 응답하지 않으며 응답하지 않는 사이트의 좋은 예도 아닙니다. – cdonner

1

모바일 예, 반응 없음로 만든 예를 들어 사이트를 참조하십시오.

오늘 Google 사이트 도구가 엉망이되어 사이트를 모바일 친화적으로 만들 수 있습니다 (시작하려면 여기에 와야했습니다.). 방금 "빈 템플릿"을 사용하여 주변을 어지럽게 만들었습니다.

당신은 (언급 한 다른 이들처럼) 활성화해야합니까 :

옵션 (기어 아이콘)> 사이트 관리> (모바일 아래로 스크롤) 확인 ..휴대 전화를 자동으로 조정합니다.그래, 그 옵션을 바닥에 묻어 두자!

Google이 2015 년 봄에 구현 한 전체 모바일 '푸시'를 고려하면 새로 생성 된 Google 사이트의 경우 기본적으로 켜져 있어야합니다.

이 옵션을 선택하면 OK (기본) 모바일 사이트가됩니다. 반응이 좋은 사이트가 아닙니다. 그래서 내 iPhone에서는 장치에 맞게 사진의 크기를 올바르게 조정하고 기본 수평 메뉴를 "햄버거"아이콘/메뉴로 전환합니다. 그러나 데스크톱 브라우저 창을 축소해도 응답 성있는 결과가 생성되지는 않습니다. https://sites.google.com/site/rwstws51/

테스트로서 나는 어떤 일이 벌어 질 지 알기 위해 너무 큰 사진 (2.5mb)을 업로드했습니다. Google PageSpeed ​​Insights를 통해 사이트를 실행하면 "사진 최적화"경고가 표시되지 않으므로 휴대 전화 및 데스크톱에 최적화 된 사진이 제공됩니다.

기본 테마는 실제로 "스키"라고합니다. 나는 "Legal Pad"테마를 시험해 보았습니다. 그리고 그것은 모바일에서 완전히 borked되었습니다. 헤더 및 컨텐트 영역 배경 이미지로 인해 생각합니다.

내 Google 사이트 도구는 드라이브, 워드 프로세서, Google+, 웹 마스터 도구, 분석 등 Google의 다른 제품에 이미 집중되어있는 사용자에게 적합합니다. 편집 할 때 이러한 유형의 항목을 추가하는 링크가 있습니다. 또는 YouTube, 드라이브 항목과 같은 사이트 액세스를 쉽게 설정할 수 있으므로 공동 작업을위한 빠른 사이트가 필요합니다.

또한 추가 할 수있는 HTML에 대한 제한이 있습니다. 스크립트 태그를 추가하려고하면 저장하려고 시도 할 때 제거됩니다. 따라서 사용법에 따라 다른 옵션도 분명히 있습니다.

-1

응용 프로그램 스크립트로 자신 만의 HTML 양식을 만드는 경우 해당 페이지/양식에 대한 CSS에 @media 뷰포트 등을 추가하여 도움을받을 수 있습니다. 하지만 Google 사이트 프레임은 여전히 ​​유용합니다. ... 좋지 않다 ........