Tối ưu AMP cho website

09
11-2016
thietkeweb3t

Hiện tại google đã đưa ra công nghệ AMP mới giúp cải thiện tốc độ website trên thiết bị di động, vậy chúng ta hãy cùng tìm hiểu sơ qua thông tin về công nghệ mới này và cách tối ưu AMP cho website hiệu quả nhé.

AMP là gì? Công nghệ mới hay rủi ro mà bạn phải chọn lựa để được làm đứa con cưng với bộ áo cái bang (khi đã từ bỏ javacript) hay làm tội đồ với thời gian load khủng long cùng với những hiệu ứng khủng bố.

Accelerated Mobile Pages một bộ API mới của google nhằm cho các trang web tải nhanh và có giao diện đẹp trên thiết bị di động, thậm chí khi mạng internet kết nối chậm. Bạn sẽ trở thành con cưng của google nếu như bạn sử dụng AMP cho website , quá tuyệt phải không nào ?

Ưu điểm:

  • Bạn sẽ làm con cưng của google (Tuyệt phải không nào)
  • Tốc độ load sẽ nhanh hơn (Lại một chữ tuyệt nữa)

Khuyết điểm:

  • Thư viện còn non trẻ (nếu bạn là một coder thì sẽ khá khó chịu)
  • Từ giã javacript
  • từ giã http (khi bạn nhúng iframe)

1 . Bước đầu dễ dàng ?

<meta charset="utf-8">
    <script async src="https://cdn.ampproject.org/v0.js"></script>
    <title>Hello, AMPs</title>
    <link rel="canonical" href="http://example.ampproject.org/article-metadata.html" />
    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
    <script type="application/ld+json">
      {
        "@context": "http://schema.org",
        "@type": "NewsArticle",
        "headline": "Open-source framework for publishing content",
        "datePublished": "2015-10-07T12:02:41Z",
        "image": [
          "logo.jpg"
        ]
      }
    </script>
    <style amp-boilerplate>body{-webkit-animation:-amp-start ...</style></noscript>

Copy những dòng code bắt buộc để khai báo AMP

2 . Tối ưu hình ảnh ?

Thay tất cả các thẻ img thành img-amp (Lưu ý : buộc phải có chiều cao và chiều rộng)

Ví dụ:

<img src="welcome.jpg" alt="Welcome" height="400" width="800"></img>
<amp-img src="welcome.jpg" alt="Welcome" height="400" width="800"></amp-img>

2 . Tối ưu IFRAME ?

Bạn phải thêm thư viện iframe trước  :

<script async custom-element="amp-iframe" src="https://cdn.ampproject.org/v0/amp-iframe-0.1.js"></script>

Sau đó đơn giản là :

<iframe src="..." height="400" width="800"></img>
<amp-iframe src="..." height="400" width="800"></amp-iframe>

2 . Còn không ?

Còn nhiều thứ lắm nhưng để chúng tôi hướng dẫn bạn cách tối ưu AMP cho website đã chuẩn chưa !

Cách 1 : Truy cập link

Cách 2 : Sử dụng plugin chorme AMP Validator

Chúc bạn thành công !

Mọi thắc mắc xin liên hệ với chúng tôi

INCOMING SEARCH TERMS

Tối ưu amp

Toi uu amp

Tối ưu AMP cho website

Toi uu AMP cho website

  1. Tại sao phải thiết kế lại website? - thiết kế web 3t
    15 November, 2016 at 6:09 am

    […] Tối ưu AMP cho website […]

  • Ngày đăng : 21-01-2017 Người đăng : betraining.org
    21
    01-2017

    kiếm tiền online tại nhà uy tín

    Thiết kế web 3t xin hướng dẫn các bạn những cách kiếm tiền online đơn giản nhất cho những bạn mới bắt đầu I. Giới thiệu MMO 1. MMO là gì? MMO là từ viết tắt của (Make Money Online), sở hữu tức là kiếm tiền trên mạng, kiếm tiền trực tuyến, hay kiếm tiền […]

  • Ngày đăng : 18-10-2016 Người đăng : betraining.org
    18
    10-2016

    Xây dựng một trang web bán hàng

    LÀM THẾ NÀO ĐỂ CÓ MỘT WEBSITE CHẤT LƯỢNG? Hiện tại, việc sở hữu một trang web bán hàng đẹp không còn là điều khó khăn. Tuy nhiên, để xây dựng một dự án trang web có sức ảnh hưởng, và đạt hiệu quả thật sự là một điều khó khăn bởi nó phải đáp […]

  • Ngày đăng : 12-01-2017 Người đăng : betraining.org
    12
    01-2017

    MMO là gì , tâm sự của một người từng trải

    MMO là gì cùng với những khó khăn gặp phải – Có thể các bạn đến với MMO một cách tự nguyện. Nhưng với tôi thì KHÔNG. Tôi đến bằng MMO vì thế bị hoàn cảnh xô đẩy. Nó không tương tự như việc các bạn ham thích một môn thể thao cùng với luyện […]

  • Ngày đăng : 21-11-2016 Người đăng : betraining.org
    21
    11-2016

    Thiết kế website bán hàng ở đâu uy tín?

    Thiết kế website bán hàng ở đâu uy tín là câu hỏi được rất nhiều người đang có nhu cầu muốn thực hiện thiết kế website phục vụ cho nhu cầu bán hàng đặt ra với mục đích muốn tìm cho mình một địa chỉ thiết kế website chất lượng. Thiết kế website bán hàng […]

  • Ngày đăng : 18-01-2017 Người đăng : betraining.org
    18
    01-2017

    Top 10 web bán hàng thời trang uy tín nhất Việt Nam

    Hôm nay thiết kế web 3t sẽ giới thiệu cho các bạn những website bán hàng thời trang uy tín nhất.Giả dụ bạn ko với rộng rãi thời kì và thích an toàn cũng như muốn được khuyến mại phổ quát hơn thì sắm tìm online là sự chọn thấp nhất cho bạn. có tương […]

  • Ngày đăng : 30-11-2016 Người đăng : betraining.org
    30
    11-2016

    Thiết kế website 3 triệu trọn gói chất lượng là hàng đầu

    🎯 💼 Việc thiết kế website trong những năm gần đây không còn đơn giản là cung cấp đủ thông tin, đủ chức năng mà người dùng cần có. Thiết kế web 3t đưa ra dịch vụ thiết kế web 3 triệu trọn gói nhằm đáp ứng nhu cầu giá cả và chất lượng cao […]