Hiển thị bài viết tin tức Hiển thị bài viết tin tức

(Menu) Navigation (Menu) Navigation

Hiển thị bài viết tin tức Hiển thị bài viết tin tức

Thiết kế web chuẩn seo

Thiết kế web responsive (rwd) là một thiết lập nơi mà các máy chủ luôn gửi các mã html tương tự cho tất cả các thiết bị và css được dùng để thay đổi việc xây dựng hình của trang trên các thiết bị.

Các thuật toán của google có thể tự động phát hiện các thiết lập này nếu tất cả tác nhân googlebot sử dụng được phép thu thập dữ liệu trang và tài sản của mình (css, javascript, và hình ảnh).

 

Thiết kế đáp ứng phục vụ tất cả các thiết bị với cùng một mã số mà điều chỉnh cho kích thước màn hình.

Để báo hiệu cho trình duyệt mà trang của bạn sẽ thích ứng với tất cả các thiết bị, thêm một thẻ meta cho người đứng đầu của tài liệu:

<meta name="viewport" content="width=device-width, initial-scale=1.0">.

Thẻ meta viewport  cung cấp cho các trình duyệt làm thế nào để điều chỉnh kích thước và mở rộng quy mô chiều rộng  của thiết bị. Khi các yếu tố meta viewport vắng mặt, các trình duyệt di động mặc định để hiển thị trang ở một độ rộng màn hình và máy tính để bàn (thường là khoảng 980px, mặc dù điều này khác nhau giữa các thiết bị). Trình duyệt di động cố gắng để làm cho nội dung tìm kiếm tốt hơn bằng cách tăng kích thước font chữ và một trong hai nhân rộng các nội dung để phù hợp với màn hình hoặc chỉ hiển thị một phần của nội dung đó có phù hợp với màn hình.

Tại sao cần phải thiết kế website chuẩn seo

Chúng tôi khuyên bạn nên sử dụng kỹ thuật thiết kế web chuẩn seo bởi vì :

• Làm dễ dàng hơn cho người dùng để chia sẻ và liên kết đến nội dung của bạn với một url duy nhất.

• Giúp các thuật toán của Google chỉ định chính xác tính chất lập chỉ mục để trang hơn là cần để báo hiệu sự tồn tại của máy tính để bàn / trang di động tương ứng.

• Yêu cầu thời gian kỹ thuật ít hơn để duy trì nhiều trang cho cùng một nội dung.

• Giảm khả năng trong những sai lầm phổ biến mà ảnh hưởng đến các trang web điện thoại di động.

• Không yêu cầu phải chuyển hướng cho người dùng để có một cái nhìn thiết bị được tối ưu hóa, làm giảm thời gian tải.Ngoài ra, người sử dụng đại lý dựa trên chuyển hướng là dễ bị lỗi và có thể làm giảm trải nghiệm người dùng của trang web (xem "cạm bẫy khi phát hiện đại lý người dùng" để biết thêm chi tiết).

• Tiết kiệm tài nguyên khi googlebot thu thập dữ liệu trang web của bạn. Đối với các trang web thiết kế đáp ứng, một đại lý duy nhất sử dụng googlebot chỉ cần thu thập trang của bạn một lần, chứ không phải là bò nhiều lần với các tác nhân người dùng googlebot khác nhau để lấy tất cả các phiên bản của nội dung. Cải thiện bò hiệu quả này có thể gián tiếp giúp cho Google index nhiều hơn nội dung trang web của bạn và giữ nó một cách thích hợp trong lành.

Nếu bạn quan tâm đến thiết kế web đáp ứng, bắt đầu với bài viết trên blog của chúng tôi về trung tâm quản trị và ghé thăm các trang web cơ bản Web.

Ghi nhớ.

• Hãy chắc chắn không phải để ngăn chặn các thu thập dữ liệu của bất kỳ tài sản trang (css, javascript, và hình ảnh) cho bất kỳ googlebot sử dụng robots.txt hoặc các phương pháp khác. Đang có thể truy cập đầy đủ các tập tin bên ngoài sẽ giúp các thuật toán của chúng tôi phát hiện đáp ứng cấu hình thiết kế web trang web của bạn và xử lý nó một cách thích hợp.

•Để chắc chắn chúng ta không còn gặp những lỗi thông thường.

Kết hợp nhận diện.

kết hợp nhận diện là một thiết lập nơi mà các máy chủ hoạt động song song với javascript trên máy khách để phát hiện những khả năng của thiết bị và thay đổi nội dung đang được phục vụ.

Ví dụ, một trang web có thể chọn để thay đổi kết xuất nội dung dựa vào việc các thiết bị là một máy tính để bàn hoặc điện thoại thông minh. Trong trường hợp này, các trang web có thể bao gồm JavaScript mà phát hiện các kích thước màn hình, sau đó được gửi đến máy chủ mà cập nhật hoặc thay đổi mã được gửi đến thiết bị. Thông thường, các JavaScript lưu trữ các khả năng thiết bị phát hiện trong một cookie mà các máy chủ đọc lần ghé thăm tiếp theo từ các thiết bị tương tự.

Cho rằng các máy chủ trả về html khác nhau để sử dụng tác nhân khác nhau, kết hợp nhận diện được coi là một loại cấu hình phục vụ năng động. Các chi tiết được mô tả trong fullhere, nhưng để tóm tắt ngắn gọn, các trang web bao gồm các "vary: user-agent" đáp ứng tiêu đề http khi một url phục vụ nội dung html khác nhau để sử dụng tác nhân khác nhau được yêu cầu.

 

Sử dụng hiệu quả javascript.

Trong cấu hình này, tất cả các thiết bị được phục vụ như nhau trong đó bao gồm một html <script> yếu tố để bao gồm một tập tin javascript bên ngoài mà có thể có nội dung khác nhau tùy thuộc vào yêu cầu sử dụng đại lý. Đó là, các mã javascript được tự động phục vụ.

Trong trường hợp này, chúng tôi đề nghị rằng các tập tin JavaScript được phục vụ với các "vary: urer-agent" http header. Đây là một tín hiệu để lưu trữ internet và googlebot rằng javascript có thể khác nhau cho các đại lý người dùng khác nhau, và là một tín hiệu cho googlebot thu thập dữ liệu tập tin javascript  sử dụng khác nhau googlebot nhân người dùng.

Đối với người dùng, điều này có nghĩa là kích thước font chữ có thể có một sự xuất hiện không phù hợp, và người dùng có thể phải nhấp đúp hoặc kéo phóng to để có thể xem và tương tác với các nội dung. Đối với google, chúng ta không thể đánh giá một trang như điện thoại di động thân thiện, vì nó đòi hỏi loại này (hoặc gõ) trong tương tác trên một thiết bị di động.

bên trái là một trang mà không có một viewport meta quy định - do đó các trình duyệt di động giả định chiều rộng máy tính để bàn và dễ điều chỉnh trang để phù hợp với màn hình, làm cho nội dung khó đọc. Bên phải là cùng một trang với một viewport cụ thể phù hợp với chiều rộng thiết bị - trình duyệt di động cũng không quy định trang và nội dung là có thể đọc được.

Đối với hình ảnh đáp ứng, bao gồm các <picture> phần tử.

Javascrip

Một phần của việc xây dựng các trang web điện thoại di động thân thiện  đòi hỏi phải xem xét cẩn thận là sử dụng các javascript  để thay đổi dựng hình và hành vi của các trang web trên các thiết bị khác nhau. Tiêu biểu sử dụng của javascript  bao gồm việc quyết định quảng cáo hoặc có độ phân giải hình ảnh biến thể để hiển thị trong trang.

Phần này mô tả các cách tiếp cận khác nhau để sử dụng javascript  và làm thế nào họ có liên quan đến khuyến cáo việc sử dụng thiết kế web đáp ứng của google.

Cấu hình chung

Có ba triển khai phổ biến của JavaScript cho các trang web điện thoại di động thân thiện là:

• javascript -adaptive: Với cầu hình này, tất cả các thiết bị được phục vụ như nhau html, css, javascript  và nội dung. Khi javascript được thực hiện trên thiết bị, vẽ hoặc hành vi của trang web bị thay đổi. Nếu một trang web yêu cầu javascript , đây là cấu hình đề nghị của google.

• Cùng nhận diện: thực hiện điều này, các trang web sử dụng cả javascript và phát hiện phía máy chủ của khả năng thiết bị để phục vụ nội dung khác nhau để các thiết bị khác nhau.

• Linh động dùng trước javascript  với cầu hình này, tất cả các thiết bị được phục vụ như nhau html, nhưng javascript  được phục vụ từ một url tự động phục vụ mã javascript  khác nhau tùy thuộc vào sử dụng đại lý của thiết bị.

Hãy nhìn vào mỗi người trong các cấu hình chi tiết.

Thích ứng javascript 

Trong cấu hình này, một url phục vụ cùng một nội dung (html, css, javascript , một hình ảnh) cho tất cả các thiết bị. Chỉ khi javascript  được thực hiện trên thiết bị là việc vẽ hoặc hành vi của các trang web bị thay đổi. Điều này cũng tương tự như thiết kế web thế nào đáp ứng, sử dụng các truy vấn cssphương tiện truyền thông, công trình.

Như một ví dụ, một trang phục vụ tất cả các thiết bị cùng một html trong đó bao gồm một <script> yếu tố đó yêu cầu một url bên ngoài phục vụ các javascript . Tất cả các thiết bị yêu cầu urlcủa JavaScript được cùng mã. Khi thực hiện, javascript  phát hiện các thiết bị và quyết định thay đổi một cái gì đó về trang web, nói để bao gồm một hình ảnh điện thoại thông minh thân thiện hoặc mã quảng cáo thay vì các lựa chọn thay thế máy tính để bàn.

Cấu hình này có liên quan rất chặt chẽ để thiết kế web đáp ứng và các thuật toán của chúng tôi có thể phát hiện thiết lập này tự động. Hơn nữa, cấu hình này không có một yêu cầu cho các Vary tiêu đề http vì các url của các trang và tài sản của mình không tự động

phục vụ nội dung. Vì những lợi thế, nếu trang web của bạn cần phải sử dụng javascript , đây là cấu hình đề nghị của chúng tôi.

Như một quy tắc chung, nếu trang web của bạn làm việc trong một trình duyệt gần đây như google chrome hoặc apple mobile Safari, nó sẽ làm việc với các thuật toán của chúng tôi.

Theo who web