AMP là gì và Cách bắt đầu với Google AMP bạn cần biết

Bất kỳ ai có trang web đều nên suy nghĩ về cách làm cho các web trên thiết bị di động của họ trở nên thân thiện hơn và đơn giản hơn đối với người dùng của họ. Đảm bảo rằng một website có thể tải nhanh chóng và hiệu quả sẽ giúp bạn giảm tỷ lệ thoát trang từ mỗi người dùng. AMP , hoặc trang dành cho thiết bị di động được tăng tốc, sẽ giúp được việc đó và việc bắt đầu sử dụng nó cho chính mình dễ dàng hơn bạn tưởng. Bạn chỉ cần hiểu nó là gì và nó hoạt động như thế nào để đi đúng đường. Cho dù bạn sở hữu một trang web thương mại điện tử sử dụng WordPress hay một trang web khác là bộ mặt của doanh nghiệp của bạn, AMP có thể giúp bạn theo nhiều cách. Sau đây công ty thiết kế web Expro cùng các bạn phân tích "AMP là gì và Cách bắt đầu với Google AMP bạn cần biết" bài viết dưới đây.

Mục lục [hide]

AMP là gì?

Vì vậy, bây giờ giả sử bạn đã sẵn sàng để bắt đầu tối ưu hóa trang web của mình. Bạn đã có phiên bản của tất cả các trang của mình, nhưng bây giờ bạn sẽ cần phải làm việc với hai phiên bản khác nhau. Một là bản gốc. Loại còn lại là phiên bản AMP với các plugin AMP Wordpress nếu bạn sử dụng wordpress thiết kế web. Bạn sẽ không thể sử dụng các phần tử biểu mẫu, biểu mẫu khách hàng tiềm năng, nhận xét trên trang hoặc bất kỳ JavaScript của bên thứ ba nào. Điều này có nghĩa là bạn sẽ phải giảm bớt một số thứ để có được những gì bạn đang tìm kiếm và nó sẽ phải chuẩn hơn trong việc định dạng. Đối với một số trong số này, bạn có thể thêm iframe, nhưng bạn không thể sử dụng nó cho mọi thứ.
Khi bạn muốn sử dụng hình ảnh (mà bạn sẽ sử dụng trên hầu hết các trang web và trang di động), bạn cần phải thực hiện chúng rất cẩn thận. Chúng cần sử dụng phần tử amp-img và chúng phải được chỉ định. Điều đó có nghĩa là bạn không thể chỉ đặt một bức ảnh và để nó như vậy. Bạn phải cực kỳ chính xác về những gì bạn đang đưa vào và nó sẽ lớn như thế nào. Bạn cần biết mọi thứ về hình ảnh đó và bạn cũng cần phải làm như vậy khi nói đến video. Bạn sẽ cần phải cẩn thận hơn nữa về video vì chúng cần được chỉ định theo một số cách khác nhau.
Hãy nhớ rằng nếu bạn định đưa AMP vào trang web của mình, bạn cần cho phép nó trong phiên bản gốc của trang web bằng thẻĐiều này sẽ đảm bảo rằng các thiết bị di động có thể tìm thấy phiên bản phù hợp của trang web và sẽ hiển thị phiên bản AMP khi ai đó cố gắng mở trang web của bạn từ bất kỳ loại điện thoại hoặc máy tính bảng nào. Chỉ cần đảm bảo rằng bạn đặt mọi thứ vào đúng vị trí.

Bắt đầu bằng ví dụ AMP

Vì vậy, giả sử bạn đã sẵn sàng bắt đầu tự mình sử dụng AMP. Bước đầu tiên là trang web của bạn có khả năng không được tối ưu hóa cho AMP. Nhưng đừng lo lắng; không ai thực sự bắt đầu với một trang web được tối ưu hóa AMP. Nó quá mới và không thực tế nếu bạn đang sử dụng trang web của mình chủ yếu để sử dụng máy tính xách tay và máy tính để bàn khi bạn bắt đầu. Sau đó, bạn bắt đầu suy nghĩ về cách bạn sẽ tận dụng tối ưu thiết bị di động và làm cho mọi thứ dễ dàng hơn cho những người dùng khác đang di chuyển. Kiểm tra mã bên dưới , từ AmpProject.

AMP hoạt động như thế nào?

Khung AMP bao gồm ba thành phần cơ bản:
  1. HTMLAMP
  2. AMPJavaScript
  3. Bộ nhớ đệm AMP

HTMLAMP

AMP HTML là HTML có một số hạn chế nhất định để đảm bảo các trang tải nhanh. Nó loại bỏ hoặc sửa đổi một số thành phần và thuộc tính có thể làm chậm trang web. Một tệp HTML đơn giản có thể trông như thế này: Về cơ bản, tài liệu HTML AMP phải:
  • Bắt đầu bằng   (để gửi thông tin đến trình duyệt về loại tài liệu mong đợi)
  •  Bao gồm thẻ  cấp cao nhất 
     (để chỉ ra đó là trang HTML AMP)
  • Bao gồm 
     và 
     gắn thẻ (để xác định nội dung của tài liệu, tức là tiêu đề, đoạn văn, hình ảnh, siêu liên kết, bảng, v.v.)
  • Bao gồm 
     (để chỉ ra phiên bản HTML thông thường của trang hoặc liên kết đến chính nó nếu không có trang thông thường nào tồn tại)
  • Bao gồm một 
     thẻ (để chỉ định mã hóa ký tự)
  • Bao gồm một 
     thẻ (để cung cấp cho trình duyệt hướng dẫn về cách kiểm soát kích thước của trang)
  • Bao gồm một 
pinterest