2012-07-18 37 views
12

Có cách nào để sử dụng nguyên tắc thiết kế đáp ứng với Google Sites hay không. Có ai đã thử điều đó. Bạn có thể hướng tôi đến một trang web mẫu không. Tôi đã xem this google help topic nhưng sau đó được cho là về các trang web dành riêng cho thiết bị di động.Sử dụng thiết kế đáp ứng trong Google Sites

Trọng tâm chính của tôi là trang web bình thường được tối ưu hóa cho web chứ không phải chủ yếu là trang web dành cho thiết bị di động.

Hoặc Blogger sẽ là một lựa chọn tốt hơn trong trường hợp này vì điều này cho phép thay đổi CSS.

+1

Bạn sẽ phải có quyền truy cập trực tiếp vào CSS để làm bất cứ điều gì đáp ứng, vì vậy tôi nghĩ rằng bạn trả lời câu hỏi của riêng bạn với "Blogger". – Lowkase

Trả lời

6

Tôi nghĩ rằng ấn tượng tiêu cực của bạn là đúng. Nó không thực hiện các tính năng bạn mong đợi trong thiết kế đáp ứng.

Chìa khóa cho câu hỏi của bạn là Google Sites không sử dụng khai báo khung nhìn (chế độ xem meta trong phần tử đầu). Nếu bạn không có điều đó, thì trình duyệt thiết bị coi bạn là trang web chỉ dành cho máy tính để bàn cũ. Giả sử bạn sẽ phá vỡ hoàn toàn dưới 830px và đặt độ rộng trang cho phù hợp. Điều đó không có vẻ giống như thiết kế đáp ứng với tôi.

Google Sites không cho phép bạn viết đầu CSS hoặc HTML của riêng mình, do đó bạn không thể tự mình triển khai thiết kế đáp ứng hơn.

Để công bằng, bạn có thể chọn không đặt chiều rộng trang cố định. Các nút điều hướng cũng sẽ hiển thị trên các cửa sổ tương đối hẹp, nếu bạn đang sử dụng tính năng "điều hướng ngang". Sau này không phải là thiết kế tuyệt vời nhưng ít nhất nó xuống cấp một cách duyên dáng.

Có tùy chọn "Tự động điều chỉnh trang web thành điện thoại di động" trong Quản lý trang web -> Chung. Tuy nhiên nhiều người cho rằng tốt hơn là không nên sử dụng nó :). Tôi đã thử bật tính năng này trên số old site, xem trước trang và chọn "xem trước trên thiết bị di động". Ít nhất là trên Firefox trên netbook ban đầu của tôi (chiều rộng 800px), nó không đáp ứng. Nó không mở rộng để sử dụng màn hình 800px đúng cách.

Là một sang một bên, dòng gói (hoặc vắng mặt của nó) là một vấn đề tồn tại từ trước với trang web của tôi. Bạn có thể đổ lỗi cho tôi vì không thử nghiệm nó :). Tuy nhiên, nó minh họa một giới hạn của trình soạn thảo WYSIWYG trong Google Sites. Nó không hiển thị, kiểm tra hoặc lọc ra định dạng gây ra sự cố này.

google site mobile preview

-3

bây giờ một ngày có thể của nó để tạo ra một trang web Google đáp ứng. vì Google đã tăng cường tính năng này "Tự động điều chỉnh trang web thành điện thoại di động" trong nút tùy chọn Quản lý trang web.

để tìm tùy chọn- đi tới> Quản lý trang web> Chung>, trong phần dưới của trang cài đặt chung, bạn có thể thấy nút radio có tên "Tự động điều chỉnh trang web thành điện thoại di động". Chỉ cần đánh dấu vào nút radio & u đã nâng cao tính năng này.

Tham khảo một trang web ví dụ thực hiện với trang web đáp ứng Googlewww.jyotiprokashmusic.com

+0

Chào mừng bạn đến với StackOverflow. Một chút giải thích ở đây có thể giúp các lập trình viên đồng nghiệp hiểu cách hoạt động của nó. – Daenarys

+0

Không phải điều này trông rất phản ứng, cũng không phải là một ví dụ hay về trang web không đáp ứng. – cdonner

1

thoại di động có, không đáp ứng.

Tôi đã gây rối với Google Sites ngay hôm nay và bạn có thể làm cho trang web thân thiện với thiết bị di động (tôi phải đến đây để bắt đầu!). Tôi chỉ sử dụng "Blank Template" để gây rối.

Bạn cần phải kích hoạt (như những người khác đã đề cập):

Options (biểu tượng bánh răng)> Quản lý trang web> (di chuyển xuống để di động) Kiểm tra ..Tự động điều chỉnh cho điện thoại di động.Vâng, hãy chôn cách tùy chọn đó xuống ở dưới cùng!

Xem xét toàn bộ di động "đẩy" mà Google đã triển khai vào mùa xuân năm 2015, điều này sẽ được BẬT theo mặc định cho bất kỳ Trang web Google mới được tạo nào.

Chỉ cần chọn tùy chọn đó tạo một trang web di động OK (cơ bản). Không phải là trang web đáp ứng. Vì vậy, trên iPhone của tôi nó quy mô hình ảnh một cách chính xác để phù hợp với thiết bị và chuyển menu ngang chính sang biểu tượng/trình đơn "hamburger". Nhưng việc thu gọn cửa sổ trình duyệt trên máy tính để bàn không tạo ra kết quả phản hồi. https://sites.google.com/site/rwstws51/

Khi thử nghiệm, tôi đã tải lên ảnh quá lớn (2,5mb) để xem điều gì sẽ xảy ra. Việc chạy trang web thông qua Google PageSpeed ​​Insights không hiển thị bất kỳ cảnh báo "tối ưu hóa ảnh" nào, vì vậy dường như để phục vụ ảnh được tối ưu hóa cho điện thoại và máy tính để bàn.

Tôi đoán chủ đề cơ bản thực sự được gọi là "Trượt tuyết". Tôi đã thử chủ đề "Legal Pad" và nó hoàn toàn bị bẻ khóa trên thiết bị di động. Tôi nghĩ là do hình nền của phần đầu và vùng nội dung.

Với tôi Google Sites rất lý tưởng nếu bạn đã nặng vào các sản phẩm khác của Google ... tài liệu, tài liệu, Google+, webmastertools, analytics, v.v ... Vì nó có liên kết để thêm các loại mục đó khi chỉnh sửa. Hoặc cần một trang web nhanh để cộng tác vì bạn có thể dễ dàng đặt quyền truy cập trang web như YouTube, mục Drive.

Ngoài ra, bạn rất hạn chế về html bạn có thể thêm vào. Việc cố gắng thêm thẻ tập lệnh sẽ bị loại bỏ khi cố gắng lưu. Vì vậy, một lần nữa tùy thuộc vào việc sử dụng có chắc chắn các tùy chọn khác ra khỏi đó.

-1

Nếu bạn tạo biểu mẫu HTML tùy chỉnh của riêng mình bằng tập lệnh ứng dụng, bạn có thể thêm @media viewports v.v ... vào css cho các trang/biểu mẫu đó, để giúp ... nhưng khung trang web google vẫn hoạt động tốt. ... không phải là tốt ........

Các vấn đề liên quan