Trang này không được tối ưu hóa cho thiết bị di động. Điều chỉnh mẫu để xem trên thiết bị di động. Một số thông tin cơ bản

Vào tháng 4 năm 2015, bản cập nhật công cụ tìm kiếm đã được phát hành. Thuật toán của Google dưới cái tên không chính thức “Mobilegeddon” và vào tháng 2 năm 2016 Yandex đã công bố hoạt động của một thuật toán tương tự có tên “Vladivostok”. Bản chất của chúng giống nhau - ở tìm kiếm di độngưu tiên được dành cho những trang web được điều chỉnh để xem trên thiêt bị di động. Điều này có nghĩa là khả năng đáp ứng trên thiết bị di động không thể bị bỏ qua nữa.

Và nó không chỉ là về những yêu cầu công cụ tìm kiếm. Lưu lượng truy cập trên thiết bị di động toàn cầu đã bắt kịp lưu lượng truy cập trên máy tính để bàn vào đầu năm 2014. Và ngày nay, khoảng 67% lưu lượng truy cập trên RuNet đến từ thiết bị di động. Có tính đến nhu cầu của độc giả, chúng tôi đang nỗ lực huy động blog. Bạn sẽ sớm thấy tài nguyên cập nhật của chúng tôi, tài nguyên này sẽ rất thuận tiện để đọc trên nhiều thiết bị khác nhau.

1. Phân tích đối tượng mục tiêu của bạn

Trước khi bạn bắt đầu tối ưu hóa thiết bị di động, hãy phân tích đối tượng mục tiêu của bạn bằng cách các hướng dẫn sau(ví dụ: sử dụng báo cáo Metrica tiêu chuẩn):

  • nhân khẩu học (giới tính và độ tuổi);
  • địa lý (khu vực nào có nhiều chuyển đổi nhất);
  • thiết bị (thiết bị nào được khách truy cập ưa chuộng nhất - máy tính để bàn, Điện thoại cầm tay hoặc máy tính bảng);
  • hệ điều hành (Android, iOS, Windows Phone, Windows 7, v.v.);
  • hành vi trên trang web (độ sâu duyệt web, thời gian trên trang web, lỗi, v.v.).

Biết hồ sơ khán giả mục tiêu, bạn có thể điều chỉnh thiết kế và nội dung cho phù hợp với nhu cầu của khách truy cập.

2. Điều chỉnh mẫu để xem trên thiết bị di động

Về cơ bản có 3 phương pháp tiếp cận khác nhau thích ứng với thiết bị di động - tất cả chúng đều được mô tả trong tài liệu của Google dành cho nhà phát triển. Mỗi người trong số họ đều có những ưu điểm và nhược điểm riêng.

phiên bản điện thoại

Trong trường hợp này, sẽ có 2 trang web: máy tính để bàn và thiết bị di động. Phiên bản di động được lưu trữ trên một tên miền mới (chẳng hạn như m.site.ru).

Thuận lợi:

  • Thiết kế trang web hoàn toàn được thiết kế riêng cho thiết bị di động, không cần phải thỏa hiệp;
  • quản trị viên web có cơ hội tối ưu hóa nội dung phù hợp với đặc điểm xem trên thiết bị di động;
  • Các trang web có thể được sửa đổi độc lập với nhau;
  • dễ dàng đạt được hơn tốc độ cao lượt tải xuống.

sai sót:

  • nhu cầu quản trị đầy đủ trang web mới;
  • Do bảo trì riêng biệt nên chi phí sẽ tăng lên khi thực hiện thay đổi.

Phiên bản di động đang bật miền riêng biệt có một cửa hàng trial-sport.ru

Hiển thị động

Trong trường hợp này, thiết kế được điều chỉnh cho phù hợp với độ phân giải màn hình cụ thể. Các đường lưới và vị trí phần tử có kích thước cố định trên các thiết bị.

Thuận lợi:

  • dễ dàng phát triển;
  • không cần thực hiện các thay đổi riêng biệt đối với phiên bản di động;
  • Quản trị viên web dễ dàng kiểm soát cách thiết kế và nội dung sẽ trông như thế nào trên các thiết bị khác nhau.

lỗ hổng- có thể xảy ra sự cố khi hiển thị trên các thiết bị có kích thước màn hình không khớp với kích thước màn hình do nhà phát triển chỉ định.


Trang web decathlon.ru sử dụng một URL với một bộ mã HTML khác

Thiết kế thích ứng

Trong trường hợp này, bố cục trang web được điều chỉnh chính xác theo bất kỳ kích thước hiển thị nào.

Thuận lợi:

  • hiển thị chính xác trên tất cả các thiết bị;
  • không cần thực hiện các thay đổi riêng biệt đối với phiên bản di động.

sai sót:

  • sự phức tạp của sự phát triển, đặc biệt là đối với các dự án hiện có;
  • Có thể có vấn đề khi điều chỉnh các khối trên các trang web có thiết kế phức tạp.


Trang web của công ty Vostok-Service sử dụng thiết kế thích ứng, thích ứng với mọi màn hình thiết bị

Bên cạnh đó các phương pháp trên thích ứng, bạn có thể sử dụng plugin để CMS phổ biến. Ví dụ: đối với WordPress có WPtouch và WP Mobile Edition. Đây là một giải pháp rẻ tiền, nhưng hoạt động chính xác của các trang web còn nhiều điều đáng mong đợi. Và nếu đây là một giải pháp cho blog, thì đối với các dự án phức tạp, giải pháp như vậy là không thể chấp nhận được.

3. Đơn giản hóa thiết kế của bạn

Thiết kế của phiên bản thích ứng của trang web phải đơn giản và ngắn gọn. Ngày nay cái gọi là “ thiết kế phẳng”, được đặc trưng bởi sự tối giản giúp đơn giản hóa việc sử dụng. Sự thể hiện đạt được thông qua việc chơi màu sắc, thay vì độ chuyển màu, bóng, kết cấu và sự phức tạp. các hình thức tương tác và các phần tử.


Một ví dụ về sự tối giản trong thiết kế

Ngoài ra, khi phát triển trang web dành cho thiết bị di động, bạn nên quên đi trình phát Flash, tiện ích và cửa sổ bật lên. Hiệu ứng thị sai, được nhiều người yêu thích, cũng nên được bỏ qua vì nó không được sao chép trên tất cả các hệ điều hành di động và làm chậm quá trình hiển thị trang.

4. Làm việc để cải thiện khả năng sử dụng

Khi thiết kế điều hướng, trước tiên hãy nghĩ đến người dùng và trải nghiệm của họ. Bất kỳ trang nào cũng có thể truy cập được trong một vài bước - không cần các bộ lọc và danh sách phức tạp. Để thực hiện cuộc gọi chỉ bằng một cú nhấp chuột, hãy nhập chính xác định dạng số với mã quốc gia và mã thành phố +7 495.... Cung cấp ủy quyền bằng một cú nhấp chuột qua mạng xã hội. Nói một cách dễ hiểu, hãy cố gắng giảm thiểu mọi hành động của khách truy cập vào mục tiêu.

Thay vì con trỏ chuột trên điện thoại thông minh, ngón tay được sử dụng nên tất cả các phần tử phải có kích thước vừa đủ. Một người không cần phải phóng to hình ảnh để nhấp vào bất kỳ yếu tố nào. Tránh sử dụng phông chữ serif, đường cong hoặc in nghiêng. Kích thước tối ưu phông chữ - 16 pixel, chiều cao dòng - 1,2 em.

5. Tăng tốc độ tải trang

Một mặt, khả năng tăng tốc tải được cải thiện yếu tố hành vi và mặt khác, có tác động tích cực đến xếp hạng. Sử dụng dịch vụ khác nhau nén:

  • HTML và tập lệnh (máy nén HTML hoặc Gzip);
  • Mã CSS (trình rút gọn CSS hoặc trình nén CSS);
  • Mã JS (Javascriptcompressor, jscompress, v.v.);
  • hình ảnh (Optimizilla, Resizepiconline, EWWW Image Optimizer, v.v.);
  • sử dụng bộ đệm của trình duyệt.

Kiểm tra tốc độ tải trang và xem vấn đề có thể xảy ra có thể sử dụng dịch vụ Thông tin chi tiết về tốc độ trang thông qua liên kết này.

6. Sử dụng các nút mạng xã hội

Người dùng di động tích cực đăng lại nội dung. Đừng tước đi cơ hội này của họ. Bằng cách này bạn sẽ đảm bảo cho mình lưu lượng truy cập bổ sung và cải thiện tín hiệu xã hội. Thêm các nút liên kết vào các mạng xã hội phổ biến nhất, nhưng không quá 4-5 ở phần hiển thị của màn hình, nếu không các nút sẽ quá nhỏ hoặc chiếm nhiều không gian.

7. Tối ưu hóa nội dung của bạn

Nội dung cần được tạo ra không chỉ để dễ xem trên màn hình nhỏ mà còn để phục vụ hành vi người dùng di động.

Thực hiện theo các quy tắc sau:

  • tính tuyến tính của nội dung (điều quan trọng nhất là ở màn hình đầu tiên và sau đó theo thứ tự giảm dần);
  • sử dụng các tiêu đề ngắn (có thể đọc nhanh);
  • chia văn bản thành các đoạn ngắn nhưng có ý nghĩa (diện tích màn hình di động nhỏ hơn nhiều so với PC và nếu người dùng không bị cuốn hút ngay từ những dòng đầu tiên, họ sẽ nhanh chóng mất hứng thú; tránh nước vào văn bản và lý luận trống rỗng);
  • thêm các yếu tố điều hướng bài viết (nội dung và neo, các nút “lên”, “xuống”, “đọc”);
  • tạo cơ hội gửi bài viết qua email (không phải ai cũng có thời gian đọc đến cuối - chẳng hạn tính năng hữu ích sẽ cho bạn cơ hội đọc tài liệu mà bạn quan tâm sau này);
  • điều chỉnh bảng để xem trên thiết bị di động (sử dụng các plugin, tập lệnh hoặc phần tử đặc biệt cuộn ngang chỉ bàn).

8. Đừng hạn chế quyền truy cập vào nội dung

Một số nhà thiết kế, thay vì điều chỉnh tất cả nội dung cho thiết bị di động, lại ẩn đi một số nội dung đó. Điều này thường được thực hiện do tính phức tạp của mẫu, nhưng đây là cách tiếp cận sai. Cung cấp phiên bản "lite" là không công bằng cho người dùng di động. Bạn cần hướng tới việc đơn giản hóa và tối ưu hóa thiết kế thay vì cắt giảm nội dung.

9. Bắt kịp xu hướng

Theo dõi xu hướng hiện nay trong lĩnh vực thiết kế và khả năng sử dụng và thực hiện những thay đổi kịp thời để không bị “đứng sau đầu máy”. Ví dụ: ngày nay các xu hướng sau có liên quan:

  • thiết kế mô-đun (nội dung được nhóm thành các khối được sắp xếp trong một nguồn cấp dữ liệu hoặc nhiều nguồn cấp dữ liệu tùy thuộc vào kích thước màn hình);
  • thiết kế phẳng (bóng, vùng nửa tối, âm lượng - tất cả những điều này đã là quá khứ);
  • cách tiếp cận đầu tiên trên thiết bị di động (trước đây các trang web được tạo cho PC và sau đó, vì cần thiết, chúng được điều chỉnh cho phù hợp với thiết bị di động - ngày nay thì ngược lại).

10. Đừng quên phân tích trang web về khả năng sử dụng trên thiết bị di động

Định kỳ kiểm tra trang web của bạn xem có tuân thủ các yêu cầu của công cụ tìm kiếm về khả năng thích ứng với thiết bị di động hay không. Bạn có thể thực hiện việc này trên Google bằng liên kết này. Chỉ cần nhập địa chỉ trang và chờ kết quả xác minh. Bất kỳ lỗi nào được tìm thấy phải được sửa chữa càng sớm càng tốt.

Để kiểm tra tính phù hợp với thiết bị di động trong Yandex, hãy thêm trang web vào Yandex.Webmaster, sau đó đi tới phần “Công cụ” / “Kiểm tra” trang di động» và nhập địa chỉ trang web. Nếu có lỗi, chúng tôi cũng sửa chúng.

Nếu bạn không có thời gian để tự mình kiểm tra và xử lý lỗi màn hình di động trang web, bạn có thể đặt hàng dịch vụ kiểm tra và nhận đề xuất từ ​​dịch vụ “Người quản lý cá nhân”.

Vì vậy, khả năng đáp ứng trên thiết bị di động không chỉ là yếu tố xếp hạng mà còn là cách để tăng lưu lượng truy cập và cải thiện hành vi của người dùng trên trang web. Nếu bạn tập trung vào việc làm cho trải nghiệm người dùng dễ dàng hơn trên trang web của mình, bạn sẽ tăng khả năng cạnh tranh và chuyển đổi.

Với các bản sửa lỗi nhanh, bạn có thể lưu trang web của mình khỏi Mobilegeddon và đảm bảo trang web vượt qua bài kiểm tra khả năng tương thích của Google.

Giới thiệu

Vào tháng 4 năm 2015 đã có một cuộc cách mạng thực sự trong thế giới ảo, vốn đã được gọi là "Mobilegeddon". Điều này là do Google đã thay đổi thuật toán và bắt đầu xếp hạng các trang web được tối ưu hóa cho thiết bị di động lên trên các trang còn lại. Do đó, tất cả chủ sở hữu trang web đã vội vã thực hiện các thay đổi đối với tài nguyên của họ.

Tại thời điểm viết bài, chúng tôi có thể nói rằng tác động của thuật toán đã thay đổi đối với kết quả tìm kiếm là không mạnh lắm nhưng đã được đặc trưng bởi việc bổ sung nhãn mới bên cạnh kết quả tìm kiếm trên thiết bị di động.

Nhưng trong tương lai tình hình có thể thay đổi đáng kể. Do đó, bạn nên kiểm tra xem trang web của mình có tương thích với các thiết bị di động hay không.

Có lẽ trước đây bạn không có đủ tiền hoặc thời gian để tối ưu hóa tài nguyên của mình. Nhưng bây giờ là lúc phải làm điều đó, vì sớm muộn gì bạn cũng sẽ bị dồn vào chân tường, và bạn cũng sẽ phải làm điều tương tự, nhưng nhanh chóng, ít nghĩ đến hậu quả.

Vậy bài kiểm tra khả năng tương thích với thiết bị di động của Google nhằm mục đích gì?

Google chia bài kiểm tra thành năm phần và bạn có thể kiếm được điểm khi vượt qua từng phần:

1. Xem cấu hình cửa sổ

Đặt chế độ xem bên trong một trang cho phép trình duyệt kiểm soát độ rộng và tỷ lệ của trang cho các thiết bị khác nhau.

2. Phông chữ rõ ràng

Được sử dụng kết hợp với một cửa sổ xem. Kích thước phông chữ có thể được điều chỉnh cho phù hợp với thiết bị xem trang. Trong trường hợp này, bạn có thể chỉ định kích thước cơ sở phông chữ và tỷ lệ kiểu chữ sẽ được đặt theo kiểu tương đối.

3. Tránh sử dụng plugin

Flash, Java và Silverlight gây ra nhiều bất tiện cho người dùng thiết bị di động. Chọn công nghệ web gốc (chẳng hạn như HTML5).

4. Kích thước nội dung

Đảm bảo nội dung vừa với giới hạn ngang của thiết bị và người dùng không phải cuộn theo chiều dọc hoặc chiều ngang để xem nội dung.

5. Kích thước của các nút và liên kết

Bạn không chỉ nên tự kiểm tra trang web của mình trên thiết bị di động mà còn nên áp dụng PageSpeed ​​Insights của Google để tối ưu hóa thời gian tải và cải thiện trải nghiệm người dùng.

Một số Tài liệu tham khảo

Với sự ra đời rộng rãi của điện thoại thông minh và máy tính bảng, nhiều chủ sở hữu trang web đã phát hiện ra rằng những sáng tạo của họ rất tiện lợi và trông rất đẹp mắt. máy tính desktop, trên thiết bị di động là một điều gì đó bất tiện và xấu xí. Hầu hết các trang web vào thời điểm đó được thực hiện dưới kích thước cụ thể màn hình và không có bố cục “cao su”.

Một cách rất cụ thể để thoát khỏi tình huống này đã được tìm ra - nhiều công ty chỉ cần tạo một trang web riêng biệt khác được thiết kế dành riêng cho thiết bị di động.

Sau đó đến CSS3 và truy vấn phương tiện. Các nhà thiết kế và phát triển web hiện có thể tạo các trang web có khả năng kiểm tra thiết bị mà trang đang được xem và điều chỉnh bố cục thiết kế cho phù hợp. Nội dung có thể được điều chỉnh cho phù hợp với một phạm vi thiết bị đầu ra cụ thể mà không cần phải thay đổi nội dung.

Trong số những thứ khác, điều này cũng cho phép bạn tiết kiệm chi phí khi duy trì một phiên bản khác, dành cho thiết bị di động, của trang web.

Vâng, chúng ta hãy thử làm điều này.

Nhưng hãy nhớ rằng tất cả các bản sửa lỗi này chỉ là bản sửa lỗi tạm thời có thể giúp bạn trong khi tạo một trang web thực sự, đầy đủ và phản hồi nhanh.

Bất kỳ quyết định nào bạn đưa ra đều phải tính đến nhu cầu của doanh nghiệp và khách truy cập trang web. Bất kỳ thay đổi nào trong số này cũng có thể có tác động đến các khía cạnh khác trong chiến lược SEO của bạn.

Vui lòng tham khảo ý kiến ​​​​của chuyên gia SEO có trình độ trước khi thực hiện bất kỳ thay đổi nào đối với trang web trực tiếp.

Vì thế,

*Bạn có một trang web hiện có;

*Bạn muốn thực hiện những thay đổi tối thiểu đối với HTML và CSS của trang web.

Trong trường hợp này, bạn có một số lựa chọn:

Thay đổi mẫu trang web của bạn

Nhiều CMS ngày nay cho phép bạn thay đổi chủ đề hoặc mẫu. Và nhiều mẫu có tính thích ứng, tức là chúng thích ứng với chiều rộng màn hình mong muốn.

Ví dụ: nếu bạn sử dụng WordPress, thì công việc ở đây sẽ mất khoảng năm phút. Chủ đề có thể được thay đổi chỉ với một vài cú nhấp chuột. Gần như ngay lập tức trang web của bạn sẽ nhận được thiết kế mới và sẽ phù hợp với thiết bị di động.

Tùy thuộc vào cách trang web hiện tại của bạn được thiết kế, bạn có thể thấy rằng một số nội dung không tự động xuất hiện trong chủ đề mới. Vì vậy, một số công việc thủ công có thể phải được thực hiện.

thuận

Khả năng thay đổi thiết kế ngay lập tức.

Hàng nghìn chủ đề có sẵn (một số miễn phí).

Nhược điểm

Không phải tất cả nội dung trước đó đều có thể hiển thị trên mẫu mới mà không cần thực hiện thêm thao tác nào.

Một thiết kế mới có thể không phải lúc nào cũng phù hợp với thương hiệu của bạn.

Tạo một trang web riêng cho thiết bị di động

Có lẽ, theo một số người, điều này đồng nghĩa với việc thừa nhận thất bại. Nhưng việc tạo một trang web riêng biệt, thân thiện với thiết bị di động có lẽ sẽ tiết kiệm chi phí nhất giải pháp hiệu quả trong thời gian ngắn đối với nhiều trang web không có quyền truy cập vào CMS hoặc không thể thay đổi thiết kế.

Chắc chắn bạn đã nghe nói rằng việc tối ưu hóa trang web trên thiết bị di động ảnh hưởng đến tốc độ và hiệu quả quảng bá ở phân khúc di động, thu hút khách hàng, đối tác và khách hàng mới.

Lưu lượng truy cập của thiết bị di động trong RuNet năm 2017. Qua theo Kỹ thuật số Báo cáo là 75%, và vào năm 2018. sẽ tăng lên 79%.

Không có đào tạo đặc biệttối ưu hóa trang web di động bạn đã mất hàng trăm, hàng nghìn khách truy cập mục tiêu - những khách hàng có khả năng tạo ra lợi nhuận.

Tỷ lệ người dùng di động cho các ngóc ngách và phân khúc thị trường khác nhau khác nhau nhưng có xu hướng chung tăng lên.

  • Làm thế nào để biết bạn có cần đặt hàng không tối ưu hóa thiết bị di động trang web ngay bây giờ?
  • Làm cách nào để kiểm tra độc lập các thuộc tính và chỉ số thân thiện với thiết bị di động của một dự án web?
  • Trang web/cửa hàng của bạn sẵn sàng đón nhận lưu lượng truy cập trên thiết bị di động như thế nào?

Tối ưu hóa trang web trên thiết bị di động: 5 bài kiểm tra miễn phí

Vuốt tự kiểm tra cửa hàng trực tuyến, trang web bán hàng của bạn hoặc trang đích, để xác định:

  1. Bạn có cần tối ưu hóa thiết bị di động ngay bây giờ không?
  2. Nó thuận tiện như thế nào cho khách hàng di động của bạn?
  3. Trang web của bạn ẩn những lỗi gì?

Tối ưu hóa trang web trên thiết bị di động được bao gồm trong phạm vi dịch vụ tiêu chuẩn của chúng tôi.

Chúng tôi làm việc đồng thời với phiên bản dành cho máy tính để bàn và thiết bị di động (thích ứng) nhằm tối đa hóa việc quảng bá trang web hoặc cửa hàng trực tuyến trong TOP 10 và đưa khách hàng đến với bạn.

Mức độ tối ưu hóa của trang web dành cho thiết bị di động được hiển thị theo 2 thông số:

  • Mobile Friendless (thân thiện, khả năng sử dụng - 96/100)
  • Tốc độ di động (tốc độ - 53/100)

Trong ví dụ trên, trang web được thử nghiệm 100% cần tối ưu hóa tốc độ trên thiết bị di động. Nhưng với khả năng thích ứng (tiện lợi) thì mọi thứ đều ổn. Ảnh chụp màn hình cho thấy dự án cũng yêu cầu tăng tốc phiên bản dành cho máy tính để bàn (Tốc độ máy tính để bàn - 66/100).

Nếu bài kiểm tra hiển thị số “đỏ” hoặc “vàng” trong báo cáo, hãy sửa lỗi ngay lập tức.

Cần tối ưu hóa trang web dành cho thiết bị di động nếu tài nguyên web của bạn nhận được tổng cộng hơn 10% lưu lượng truy cập di động. Khách hàng đang truy cập trang web của bạn từ máy tính bảng và điện thoại, nhưng bạn đã chuẩn bị như thế nào cho những lần truy cập này?

Bạn có thể xem tỷ lệ phần trăm lưu lượng truy cập di động hiện tại trong số liệu thống kê của Yandex.Metrica:

Báo cáo -> Báo cáo tiêu chuẩn -> Công nghệ -> Thiết bị

Trong ví dụ báo cáo hàng quý này, 64,9% tổng lưu lượng truy cập rơi vào PC (máy tính để bàn những máy tính cá nhân) và 35,1% còn lại là chuyển đổi trên thiết bị di động:

  • điện thoại thông minh - 31,6%
  • máy tính bảng - 3,5%

Nếu lưu lượng truy cập trên thiết bị di động lớn hơn 10% thì việc tối ưu hóa trang web trên thiết bị di động sẽ giúp tăng doanh số bán hàng. Nhưng sự vắng mặt hoàn toàn lượt truy cập trên thiết bị di động là một vấn đề...

Lưu lượng truy cập trên thiết bị di động bằng 0 cho thấy có lỗi nghiêm trọng. Có lẽ dự án web của bạn:

  • không trải qua quá trình tối ưu hóa thiết bị di động
  • mất khách hàng di động và lợi nhuận
  • có khả năng cạnh tranh thấp trong kết quả tìm kiếm trên thiết bị di động của Yandex và Google

Để đánh giá xu hướng tăng trưởng về số lượt truy cập trên thiết bị di động theo thời gian và trong tương lai, bạn cần xây dựng lại báo cáo Yandex.Metrica một chút.

Trên cùng một trang của báo cáo, chọn khoảng thời gian - “NĂM” và hiển thị - “Dòng” hoặc “Khu vực”:

Trong hình, lưu lượng truy cập web trên PC đang giảm và số nhấp chuột từ điện thoại thông minh đang tăng lên. Nếu bạn có hình ảnh tương tự, hãy tối ưu hóa đơn hàng và thu hút nhiều khách truy cập trên thiết bị di động hơn. Kiếm tiền trên bán hàng di động bây giờ, trước khi các đối thủ cạnh tranh làm điều này.

Xin lưu ý rằng đối thủ cạnh tranh không ngủ!

Nếu các trang web cạnh tranh được chuẩn bị tốt hơn cho lượt truy cập trên thiết bị di động, phù hợp với lưu lượng truy cập trên thiết bị di động, sử dụng thuận tiện và nhanh chóng, bạn sẽ mất khách hàng và tiền bạc. Thậm chí 10% lưu lượng truy cập trên thiết bị di động cũng là một giá trị thương mại đáng kể không thể bỏ qua.

Tối ưu hóa trang web trên thiết bị di động sẽ cung cấp thêm tiềm năng và lợi thế cạnh tranh để chinh phục phân khúc thị trường di động trong phân khúc chủ đề của bạn.

5. Kiểm tra tối ưu hóa trang web dành cho thiết bị di động

Cách dễ nhất để kiểm tra xem tài nguyên web của bạn có sẵn sàng cho lượt truy cập trên thiết bị di động hay không là yêu cầu kiểm tra từ công ty “TỐI ƯU HÓA” của chúng tôi. Trong trường hợp này bạn:

  • thoát khỏi những rắc rối khi phân tích và phân tích ở giai đoạn phát triển
  • tiết kiệm thời gian và tiền bạc cho doanh nghiệp của bạn
  • lấy khuyến nghị chi tiết, Làm thế nào để cải thiện website bán hàng, những điều cần chú ý

Trong 2 ngày, chúng tôi sẽ kiểm tra kỹ lưỡng, toàn diện và chuyên nghiệp tất cả các thông số trong chuỗi bán hàng của bạn, bao gồm cả phiên bản di động và thống kê lưu lượng truy cập. Chúng tôi sẽ biên soạn báo cáo chi tiết và từng bước với danh sách các mẹo từ các nhà phát triển web giỏi nhất của chúng tôi.

Tối ưu hóa trang web di động bao gồm những gì?

1. Làm việc với từ khóa

Từ điện thoại họ thường nhập ngắn (bàn phím) hoặc rất dài ( quay số bằng giọng nói) cụm từ và điều này phải được tính đến. Cốt lõi ngữ nghĩađang được điều chỉnh cho phiên bản di động!

2. Thiết kế

Mọi thứ không cần thiết đều bị loại bỏ. Tối ưu hóa trang web dành cho thiết bị di động giới hạn hoặc điều chỉnh khu vực xem để phù hợp với các thành phần trang quan trọng bên trong màn hình nhỏ. Những điều sau đây có thể được tối ưu hóa:

  • phông chữ và phong cách
  • khối và mô-đun
  • màu sắc và hình nền
  • cấu trúc và điều hướng
  • menu và widget
  • lề và phần đệm

3. Tăng tốc

Tốc độ Internet di động nhà khai thác di độngĐể lại nhiều mong muốn. Nếu trang web chạy chậm và mất hơn 2-3 giây để tải, khách truy cập sẽ chuyển sang đối thủ cạnh tranh. Vì vậy, điều quan trọng là phải tăng tốc tài nguyên.

4. Thông số ĐỊA LÝ

Công cụ tìm kiếm trong kết quả di động cho Nền tảng Android và iOS tính đến vị trí địa lý và hiển thị cho người dùng các ưu đãi gần nhất trong khu vực của họ. Không thể tối ưu hóa trang web dành cho thiết bị di động nếu không đặt thông số GEO.

Tối thiểu, bạn cần thêm dự án vào các dịch vụ GEO phổ biến, dịch vụ trợ giúp Yandex và bản đồ địa phương như 2GIS.

Những thiếu sót cản trở hoạt động binh thương, giảm sự tham dự và thu nhập. Loại bỏ lỗi - giai đoạn quan trọng tối ưu hóa trang web cho thiết bị di động và tiện ích.

6. Khả năng sử dụng trên thiết bị di động

Bạn cần xác định dự án kinh doanh của mình thuận tiện như thế nào khi mở từ thiết bị di động. Chỉ có 2 giải pháp để tiếp nhận và phục vụ khách hàng di động:

− Thích ứng cách trình bày(thiết kế tự động thích ứng với màn hình khác nhau tiện ích) hoặc...

− Đặc biệt phiên bản trang web (phiên bản di động được tạo trên tên miền phụ và khác biệt đáng kể so với tài nguyên chính ở chức năng đơn giản hóa, menu đặc biệt và thiết kế).

Bạn có thể tự mình thực hiện công việc này mà không cần sự trợ giúp của chuyên gia không? Bạn sẽ mất bao lâu nữa khách hàng di động và thị phần? Tại sao bạn không khắc phục tình trạng này ngay bây giờ và yêu cầu tối ưu hóa trang web trên thiết bị di động?

Xét cho cùng, nó không đắt lắm và mọi chi phí sẽ được thanh toán hết trong 2-3 tháng tới. Nhấn nút và đạt doanh số cao!

Google tuyên bố rằng họ tính đến việc tối ưu hóa trang web cho thiết bị di động trong tìm kiếm của mình. Nếu bạn đã thêm tài nguyên của mình vào quản trị trang web của Google, thì có thể được đánh dấu “Trang web không được tối ưu hóa cho thiết bị di động”. Điều này có nghĩa là công việc cần phải được thực hiện để cải thiện khả năng hiển thị của tài nguyên trong mắt Google và điều chỉnh trang web cho phù hợp với thiết bị di động. Các hướng dẫn bên dưới không chỉ áp dụng cho tài nguyên WordPress mà còn cho bất kỳ công cụ nào khác.

Để kiểm tra khả năng thích ứng của hiển thị trang web, chúng tôi sẽ sử dụng dịch vụ của Google https://developers.google.com/speed/pagespeed/insights.

Chỉ định địa chỉ trang web và nhấp vào nút “Phân tích”. Bạn có thể thấy rằng trong ví dụ này, điểm trải nghiệm người dùng trên thiết bị di động là 69 phần trăm và ngoài ra còn có thông báo “Trang có thể không sẽ được kiểm nghiệm dễ xem trên thiết bị di động.”

Hãy đặt cho mình mục tiêu tối ưu hóa trang web và cải thiện điểm số lên ít nhất 90%, được coi là tốt trong mắt Google.

Trước hết hãy chú ý đến thông báo “Tùy chỉnh khu vực xem”. Tốt nhất nên bắt đầu từ đây vì việc khắc phục sự cố này sẽ tự động ảnh hưởng đến ước tính của Google về kích thước phông chữ và các thành phần hoạt động.

Nhấp vào liên kết “Cách khắc phục” và xem văn bản tiếp theo về sự cần thiết phải chỉ định thẻ khung nhìn.

Có liên kết tới "Tùy chỉnh chế độ xem của bạn" giải thích cách sử dụng thẻ này. Chúng tôi sẽ không giải quyết nó một cách chi tiết. Hãy chỉ sử dụng hướng dẫn của Google mà bạn cần chỉ ra hướng dẫn trong khối đầu trên trang web:

< meta name = viewport content = "width=chiều rộng thiết bị, tỷ lệ ban đầu=1">

Chúng tôi thêm thẻ vào trang web và kiểm tra xem chỉ báo tiện lợi cho người dùng thiết bị di động đã thay đổi như thế nào.

Chúng tôi thấy mức tăng từ 69 lên 80%.

Nếu bạn đã bật bộ đệm trên trang web của mình thì trước khi kiểm tra, bạn phải tắt bộ đệm hoặc xóa các tệp được lưu trong bộ đệm, nếu không việc kiểm tra có thể được thực hiện bằng các tệp cũ.

Tiếp theo, chúng tôi xem xét vấn đề trong vùng màu đỏ “Điều chỉnh kích thước nội dung cho chế độ xem”. Vấn đề là Google kiểm tra chiều rộng của thiết bị là 375 pixel và kích thước của một số thành phần trang web vượt quá con số này.

Thực tế là nhiều mẫu được tạo trước đó chứa kích thước tuyệt đối của các thành phần trang web. Ví dụ: tệp style.css có thể chứa các hướng dẫn như thế này

#wrapper ( chiều rộng: 1000px; )

#vỏ bánh (

chiều rộng: 1000px;

giấy gói - trong trong trường hợp nàyĐây là vùng chứa chính của trang web. Đương nhiên, một phần tử như vậy không vừa với màn hình rộng 375 pixel. Bạn cũng có thể tìm thấy khác hướng dẫn tương tự cho các thành phần trang web khác.

Chúng tôi sẽ khắc phục vấn đề này bằng thủ thuật sau. Hãy viết lại các phong cách trên như sau:

#wrapper ( chiều rộng tối đa: 1000px; chiều rộng: 100%; )

#vỏ bánh (

chiều rộng tối đa: 1000px;

chiều rộng: 100%;

Khi tạo một trang, trình duyệt sẽ sử dụng giá trị tối thiểu trong hai: chiều rộng tối đa và chiều rộng. Trong trường hợp này, nếu chiều rộng màn hình của người dùng lớn hơn 1000px thì giá trị 1000 sẽ được sử dụng và nếu chiều rộng màn hình của người dùng nhỏ hơn 1000px thì giá trị bằng chiều rộng màn hình (100%) sẽ được sử dụng.