الرئيسية
AMP

التعرف على AMP HTML ، ما المقصود بـ AMP؟

بدر الدين وجيه تعليقان (2)

AMP أو Accelerated Mobile Pages هو مشروع مفتوح المصدر يُستخدم لتوفير صفحات الويب التي يتم تحميلها بشكل أسرع على الأجهزة المحمولة ، تم إصداره في أكتوبر 2015 بهدف تحسين تجربة المستخدم وخاصة الناشرين في تحسين صفحات الجوال الأفضل.

تم تصميم AMP HTML باستخدام هياكل الويب الموجودة ولكنه يحد من CSS و HTML و Javascript بحيث يمكن الوصول إلى مواقع الويب بسرعة أكبر.

كيف يعمل AMP HTML؟

يعمل AMP HTML بإضافة مكتبات AMP JavaScript ولا يغير الهيكل الرئيسي للويب. أضافت بنية الويب كالمعتاد مكتبة AMP JS فقط بحيث تكون كافية لمواصفات AMP HTML. رمز بسيط من موقع ويب به AMP HTML مثل هذا:


<!doctype html>
<html amp='amp' dir='rtl' lang='ar'>
  <head>
    <meta charset='utf-8'>
    <link rel='canonical' href='hello-world.html'>
    <meta name='viewport' content='width=device-width,minimum-scale=1,initial-scale=1'>
    <style>body {opacity: 0}</style><noscript><style>body {opacity: 1}</style></noscript>
    <script async='async' src='https://cdn.ampproject.org/v0.js'></script>
  </head>
  <body>Hello World!</body>
</html>

بإضافة مكتبة AMP JS ، ستتضمن:
  2. مكتبة AMP JS ، التي تدير تحميل الموارد الخارجية لضمان عرض الصفحات بشكل أسرع.
  3. مدقق AMP يوفر طريقة لمطوري الويب للتحقق بسهولة من أن شفرتهم تستوفي مواصفات AMP HTML.
  4. تسهل بعض العناصر المخصصة ، التي تُسمى مكونات AMP HTML ، الأنماط الشائعة على التنفيذ.

مكتبة AMP JS

تحتوي مكتبة AMP JS بالفعل على مكونات مثبتة (amp-ad و amp-video و amp-img و amp-pixel) بحيث لا تكون هناك حاجة إلى نصوص برمجية إضافية لتسريع العرض.

مدقق AMP

يسمح مدقق AMP لمطوري الويب بتحديد ما إذا كانت صفحة الويب لا تلبي مواصفات AMP HTML بسهولة.
ستؤدي إضافة كلمة "# depelopment = 1" إلى عنوان URL لصفحة AMP HTML إلى تسهيل عثور المطورين على أخطاء بنية AMP HTML.

مكونات AMP HTML

مكونات AMP HTML هي سلسلة من العناصر المخصصة الإضافية أو تحل محل وظيفة عناصر HTML5.

  • يستبدل عناصر HTML5 التي لا يُسمح بمواصفاتها مثل amp-img و amp-video.
  • تنفيذ محتوى تابع لجهة خارجية ، مثل amp-youtube و amp-ad و amp-twitter.
  • أضف تصميمات أخرى ، مثل amp-lightbox و amp-carousel.
  • تبسيط تقنيات إنشاء الويب ، مثل amp-anim ، والتي تسمح لمطوري الويب بعرض الصور المتحركة ، سواء الصور (GIF) أو ملفات الفيديو (WebM أو MP4) بناءً على توافق المتصفح.

تعليقان (2)

  1. تجربة
  2. اشطا