Mẹo để có một trang web di động thành công

Đầu tiên di động là tên của trò chơi trong thế giới trực tuyến. Chúng tôi sẽ chỉ cho bạn (và tất cả những người đã bỏ lỡ SEO trên thiết bị di động cho đến nay) tại sao tính thân thiện với thiết bị di động lại quan trọng và cách làm cho trang web của riêng bạn thực sự sẵn sàng cho thiết bị di động

Tại sao Tối ưu hóa thân thiện với thiết bị di động lại quan trọng?

Vào năm 2013, chỉ có 16% đang lướt web trên điện thoại thông minh của họ. Đến năm 2018, hơn một nửa tổng số người dùng Internet đang sử dụng điện thoại di động của họ trực tuyến : số lượng người dùng di động tăng gấp ba lần trong vòng 5 năm. Tất nhiên, những con số này không có nghĩa là người dùng chỉ sử dụng điện thoại thông minh của họ, nhưng rõ ràng nó đang trở thành thiết bị được ưa thích để sử dụng internet, bên cạnh PC để bàn, máy tính xách tay, máy chơi game và TV thông minh.

Bạn có thể tranh luận rằng mọi người đang lướt internet bằng cách nào không thực sự quan trọng, miễn là họ truy cập vào trang web của bạn. Tuy nhiên, sử dụng internet trên điện thoại di động khác với lướt PC. Trên thiết bị di động, người dùng không có bàn phím hoặc chuột và họ có màn hình nhỏ hơn nhiều. Tùy thuộc vào vị trí của bạn, kết nối internet di động đến điện thoại thông minh của bạn có thể chậm hơn nhiều so với kết nối băng thông rộng của bạn.

Điều này có nghĩa là người dùng internet di động đánh giá cao thời gian tải ngắn và thiết bị dễ sử dụng. Do đó, tối ưu hóa thiết bị di động chủ yếu có nghĩa là UX tốt, tối ưu hóa nội dung và tối ưu hóa kỹ thuật.

Các trang web dành cho thiết bị di động không chỉ quan trọng đối với người dùng hài lòng mà còn đối với Google. Kể từ ngày 21 tháng 4 năm 2015, Google đã cho thấy tầm quan trọng của việc tối ưu hóa trang web trên thiết bị di động. Kể từ đó, “tính thân thiện với thiết bị di động” đã là một yếu tố xếp hạng. Chỉ một năm sau, Google lại một lần nữa tối ưu hóa “Bản cập nhật dành cho thiết bị di động” (hay còn gọi là “Mobilegeddon”). Tốc độ trang sau đó đã trở thành một yếu tố xếp hạng cho các trang web trên điện thoại di động vào năm 2018. Cũng trong năm đó, Google đã ra mắt “Lập chỉ mục đầu tiên trên thiết bị di động”. Kể từ đó, phiên bản di động của một trang web được ưu tiên lập chỉ mục.

Người dùng của bạn và Google cho bạn biết lý do tại sao trang web của bạn phải thân thiện với thiết bị di động. Và bây giờ chúng tôi sẽ cho bạn thấy điều quan trọng đối với việc tối ưu hóa thiết bị di động.

Trang web của bạn đã thân thiện với thiết bị di động chưa?

Trên thị trường, hiện nay có rất nhiều công cụ miễn phí và trả phí có thể giúp bạn kiểm tra xem trang web của mình có thân thiện với thiết bị di động hay không.

Kiến thức cơ bản về trang web di động của bạn

Trong thực tế, ba biến thể thường được sử dụng để tối ưu hóa thân thiện với thiết bị di động.

1. Thiết kế web đáp ứng (RWD)

Biến thể này là một kỹ thuật hiện đại dành cho các trang web di động. Mã HTML giống nhau cho trang máy tính để bàn cũng như cho điện thoại thông minh. CSS được sử dụng để điều chỉnh nội dung và bố cục của trang di động với màn hình của thiết bị di động.

Ưu điểm: Nỗ lực duy trì trang thấp, vì bạn chỉ phải duy trì một phiên bản. Cũng chỉ có một URL duy nhất, phù hợp với tất cả các loại thiết bị di động như điện thoại thông minh hoặc máy tính bảng, do đó tiết kiệm tài nguyên cho Googlebot. Không cần chuyển hướng để có được chế độ xem được tối ưu hóa cho thiết bị đó. Điều này làm giảm đáng kể thời gian tải. Ngoài ra, các chuyển hướng như vậy có thể dễ xảy ra lỗi và có thể có tác động tiêu cực đến khả năng sử dụng của trang web.

Nhược điểm: Bạn không thể tùy chỉnh trang di động hoặc làm cho nó nổi bật so với phiên bản dành cho máy tính để bàn.

2. Phục vụ động

Với biến thể này, các trang web trên điện thoại di động được phân phối với một mã (HTML và CSS) phù hợp với tác nhân người dùng. URL vẫn giữ nguyên, bất kể bạn truy cập trang web bằng điện thoại thông minh hay máy tính.

Ưu điểm: Chỉ có một URL cho tất cả các thiết bị và bạn có thể xác định các thông số kỹ thuật cho thiết bị đầu ra tương ứng rất chính xác dựa trên tác nhân người dùng.

Nhược điểm: Đầu ra của các biến thể mã có nghĩa là bạn phải bảo trì trang nhiều hơn và trên hết, phải chú ý đến nhiều chi tiết khi thực hiện thay đổi.

3. Tên miền phụ được tối ưu hóa cho thiết bị di động

Trong trường hợp này, trang di động có URL riêng tương ứng với URL của phiên bản dành cho máy tính để bàn. Nội dung trên trang web dành cho thiết bị di động có thể giống với URL trên máy tính để bàn, nhưng không nhất thiết phải giống như vậy. Thông thường, hai mã HTML khác nhau được xuất. Trên biến thể dành cho máy tính để bàn và các trang dành cho thiết bị di động, thẻ rel = alternate được chèn để tham chiếu đến phiên bản khác.

Ưu điểm: Bạn có thể tối ưu hóa trang di động một cách hoàn hảo cho thiết bị đầu ra.

Nhược điểm: Nỗ lực lập trình và bảo trì cao hơn đáng kể so với các tùy chọn trước đó. Bạn phải duy trì hai trang.

Bản thân Google đề xuất thiết kế web đáp ứng như một giải pháp cho SEO di động . Đây là những ưu điểm chính của thiết kế web đáp ứng so với hai tùy chọn còn lại:

• Ít nỗ lực bảo trì hơn
• Một URL cho tất cả các thiết bị
• Rất linh hoạt, vì trang web về cơ bản phù hợp với nhiều thiết bị đầu ra khác nhau
• Nguy cơ cấu hình không chính xác thấp hơn
• URL dễ chia sẻ hơn
• Googlebot tiết kiệm tài nguyên

Cách cho Google thấy rằng trang web của bạn thân thiện với thiết bị di động

Khi thu thập thông tin, Googlebot có thể nhận ra trang web của bạn có thân thiện với thiết bị di động hay không:

Các lựa chọn thay thế cho trang web di động: PWA, AMP & Apps

Ứng dụng web tiến bộ (PWA) hoặc Trang di động được tăng tốc (AMP) là những lựa chọn thay thế cho thiết kế web đáp ứng ưa thích. Các trang này thân thiện với thiết bị di động ngay từ đầu và cung cấp một số lợi thế.

AMP và PWA đều có mã nguồn rất mỏng. Trong khi AMP có thể thuyết phục trên tất cả bằng tốc độ của nó, PWA cung cấp các chức năng như ứng dụng gốc. Ví dụ: chúng có thể được lưu trữ dưới dạng biểu tượng như một ứng dụng trên màn hình di động. Bạn có thể tìm thấy hướng dẫn từng bước về AMP tại đây.

Cả hai biến thể đều có nhược điểm là chúng không thể dễ dàng được cá nhân hóa so với các trang web đáp ứng.

Các ứng dụng thường linh hoạt hơn, vì chúng được hướng tới các hệ điều hành khác nhau của các thiết bị cuối riêng lẻ và do đó có thể sử dụng một số tính năng của thiết bị tương ứng. Tuy nhiên, việc phát triển một ứng dụng đòi hỏi nhiều nội lực cũng như chi phí hơn.

Tối ưu hóa tốc độ trang cho các trang web thân thiện với thiết bị di động

Có nhiều cách để cải thiện tốc độ trang của các trang web trên điện thoại di động:

• Loại bỏ JavaScript hoặc CSS chặn hiển thị.
• Sử dụng bộ nhớ đệm của trình duyệt. Các phần tử không đổi như CSS cho bố cục được lưu trong bộ nhớ cache của trình duyệt. Sau đó, chúng không phải được tải lại mỗi khi trang được gọi lên lần nữa hoặc có thêm các nhấp chuột vào trang.
• Nén hình ảnh của bạn. Ở đây chúng tôi chỉ cho bạn cách bạn có thể nén hình ảnh.
• Loại bỏ mã HTML không cần thiết. Ví dụ, đây có thể là những nhận xét không còn cần thiết.

Các mẹo về nội dung và bố cục cho trang web thân thiện với thiết bị di động của bạn

Sự khác biệt lớn nhất giữa việc gọi trang web bằng điện thoại thông minh hoặc máy tính để bàn là kích thước màn hình khác nhau, có nghĩa là trang được vận hành khác nhau.

Trong tối ưu hóa thiết bị di động, bạn nên chú ý đến các yếu tố sau:

1. cung cấp cho người dùng nội dung thực sự cần thiết. Tự hỏi bản thân xem có nội dung nào trên trang web mà bạn có thể làm mà không có hoặc bạn có thể hiển thị dễ dàng hơn. Sử dụng các câu ngắn. Quan trọng: Máy tính để bàn = Điện thoại thông minh – các trang web phải có cùng nội dung.

2. không đặt các phần tử cảm ứng quá gần nhau: người dùng của bạn sẽ vận hành trang web di động bằng ngón tay của họ qua màn hình cảm ứng. Nếu khoảng cách giữa các điều khiển riêng lẻ quá nhỏ, trang sẽ khó sử dụng vì chẳng hạn như một ngón tay chạm vào hai phần tử cùng một lúc.

Mẹo: Nên chọn khoảng cách ít nhất năm mm giữa các phần tử cảm ứng. Mỗi phần tử phải cao ít nhất bảy milimét.

3. Định dạng biểu mẫu đầu vào tốt nhất với kích thước tương đối: Các trường đầu vào cho địa chỉ hoặc dữ liệu khác nên thích ứng với màn hình. Các trường nhập phải lớn và rõ ràng nhất có thể trên thiết bị di động để người dùng dễ dàng thực hiện các mục nhập và do đó đến đích nhanh hơn.

4. sử dụng càng ít phông chữ khác nhau càng tốt: kiểu chữ càng đồng đều thì văn bản càng có thể đọc tốt trên màn hình nhỏ.

5. Chú ý đến cỡ chữ đủ dùng: Bản thân Google cũng khuyến nghị cỡ chữ 16 làm cơ sở. Điều này được xác định bằng pixel CSS. Định nghĩa của lớp CSS cho kích thước phông chữ có thể trông như sau:

body {font-size: 16px;}

Möchtest Du weitere Schriftgrößen verwenden, können diese dann trong Relation zur Basis angegeben werden:

.small {

font-size: 12px; / * 75% đường cơ sở * /

}

Nếu bạn đang sử dụng trang web dành cho thiết bị di động đáp ứng, bạn có lợi thế hơn vì thẻ khung nhìn hiển thị pixel độc lập với thiết bị đầu ra.

Các lỗi thường gặp với tối ưu hóa thân thiện với thiết bị di động

1. Các tệp
   JavaScript, CSS và hình ảnh bị chặn: Các tệp JavaScript, CSS và hình ảnh không thể lập chỉ mục cho Googlebot: Nếu các tệp quan trọng bị robots.txt chặn, Googlebot không thể thu thập dữ liệu trang web của bạn một cách chính xác và do đó không thể lập chỉ mục nó một cách chính xác. Do đó, bạn nên đảm bảo rằng Googlebot có thể thu thập thông tin tất cả các tệp cần thiết để hiển thị trang web. Với Ryte, bạn có thể kiểm tra tệp robots.txt miễn phí.
2. Nội dung không thể truy xuất:
   Một số nhà thiết kế web vẫn sử dụng Flash. Tuy nhiên, nội dung này không thể phát lại trên điện thoại thông minh.
3. Chuyển hướng không chính xác:
   Chuyển hướng không hoạt động: Điều này đặc biệt đúng nếu bạn đang sử dụng URL di động. Quản trị viên web thường quên tham chiếu đến phiên bản di động trong mã nguồn thông qua rel = alternate.
4. Chuyển hướng nội bộ không liên quan:
   Các liên kết nội bộ nên được kiểm tra thường xuyên và nhà điều hành trang web nên chú ý xem chúng có tham chiếu đến các trang chính xác hay không. Thông thường, sai lầm được thực hiện ở đây là tích hợp các liên kết tham chiếu đến một trang không liên quan, ví dụ: liên kết trên các trang dành cho thiết bị di động tham chiếu đến trang chủ của trang web trên máy tính để bàn.
5. Hình ảnh được sử dụng quá lớn:
   Nếu bạn quên nén hình ảnh trên trang web của mình, điều này sẽ có tác động tiêu cực đến thời gian tải trang web di động của bạn.
6. Bạn quên thẻ khung nhìn:
   Trong trường hợp này, người dùng cần cuộn theo chiều ngang để nắm bắt nội dung, điều này ảnh hưởng rất xấu đến khả năng sử dụng.

Thân thiện với thiết bị di động chỉ là một phần của tối ưu hóa công cụ tìm kiếm

Ngay cả khi bây giờ bạn đã đọc hướng dẫn đầy đủ về SEO trên thiết bị di động, bạn nên luôn nhớ rằng tối ưu hóa thiết bị di động chỉ là một phần trong các biện pháp SEO của bạn. Bất kể trang web dành cho thiết bị di động được hiển thị như thế nào trên điện thoại thông minh hoặc máy tính bảng, nội dung độc đáo có giá trị gia tăng vẫn tiếp tục được tính cho người dùng và Google. Mặc dù hoặc thậm chí với SEO trên thiết bị di động, bạn nên đầu tư ít nhất nhiều thời gian vào nội dung tuyệt vời để đạt được thứ hạng hàng đầu và truyền cảm hứng cho người dùng của bạn.