Sobes.tech
Intervyu yordami
Resurslar
Intervyuga tayyorgarlik
Resurslar
Ish qidirish
Resurslar
Huquqiy
Savollarga qaytish
Middle

AMP sahifalari nima?

sobes.tech AI

AIdan javob

AMP (Tezlashtirilgan Mobil Sahifalar) Google tomonidan yaratilgan ochiq manba HTML ramkasi bo‘lib, mobil qurilmalarda yaxshi ko‘rsatiladigan tez va moslashuvchan veb-sahifalar yaratish uchun mo‘ljallangan.

AMP ning asosiy tamoyillari:

  • HTML teglarining cheklangan to‘plami: Sahifaning tahlil qilish va render qilishni tezlashtirish uchun HTML ning kichik bir qismi ishlatiladi.
  • Resurslarni asinxron yuklash: Skriptlar, rasmlar va boshqa resurslar asinxron tarzda yuklanadi, asosiy kontentning render qilinishiga to‘sqinlik qilmaydi.
  • Kontentga ustunlik: Optimizatsiya ko‘rsatilgan kontentning tez yuklanishiga qaratilgan.
  • Statik element o‘lchamlari: Ko‘pchilik elementlar oldindan belgilangan o‘lchamlarga ega, bu yuklash paytida "sakrashlar" ni kamaytiradi.
  • AMP Cache dan foydalanish: Tashqi tashkilot (masalan, Google) AMP sahifalarni kechiktirib, o‘z cache dan etkazib berishi mumkin, bu esa darhol yuklashni ta’minlaydi.

AMP ning asosiy komponentlari:

  • AMP HTML: Maxsus AMP komponentlari bilan cheklangan HTML to‘plami.
  • AMP JS: Resurslarni yuklash va interaktivlikni boshqarish uchun JavaScript kutubxonasi.
  • AMP Cache: AMP sahifalarni kechiktirish va etkazib berish uchun proksi tarmoq.

AMP dan foydalanish misoli:

<!doctype html>
<html amp lang="ru">
  <head>
    <meta charset="utf-8">
    <script async src="https://cdn.ampproject.org/v0.js"></script>
    <title>AMP sahifa misoli</title>
    <link rel="canonical" href="https://example.com/обычная-страница.html">
    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
    <style amp-custom>
      /* Sizning CSS uslublaringiz */
    </style>
  </head>
  <body>
    <h1>Salom, AMP!</h1>
    <p>Bu tezkor sahifa.</p>
    <amp-img src="/images/kitten.jpg" alt="Mushukcha" width="100" height="100" layout="responsive"></amp-img>
  </body>
</html>

AMP ning afzalliklari:

  • Yuklash tezligi: Sahifalar juda tez yuklanadi, ayniqsa mobil qurilmalarda.
  • SEO yaxshilangan: Google mobil qidiruv natijalarida AMP sahifalariga ustunlik beradi.
  • Foydalanuvchi tajribasini yaxshilash: Tez yuklash va silliq skroll qilish.

AMP ning kamchiliklari:

  • Dizayn va funksionallikda cheklovlar: Barcha HTML teglar va JavaScript funksiyalari mavjud emas.
  • Joriy qilish murakkabligi: Ajratma ishlab chiqishni yoki mavjud kontentni moslashtirishni talab qiladi.
  • Google ga bog‘liqlik (bir oz): AMP Cache Google nazorati ostida.

AMP keng tarqalgan holda yangiliklar maqolalari, bloglar va mobil qurilmalarda yuklash tezligi muhim bo‘lgan boshqa kontent uchun ishlatiladi.

OldingiKeyingi