طراحی سایت با AMP

تاریخ ارسال : 1400/02/05

AMP رو میشه اینجوری تعریف کرد که بهینه سازی صفحات وب برای گوشی موبایل هست  و باعث میشه صفحات با سرعت بیشتری بارگذاری بشن . و گوگل هم از سال 2016 به بعد این صفحات رو به شکل ویژه نشون میده...

طراحی سایت با AMP

 

AMP رو میشه اینجوری تعریف کرد که بهینه سازی صفحات وب برای گوشی موبایل هست  و باعث میشه صفحات با سرعت بیشتری بارگذاری بشن . و گوگل هم از سال 2016 به بعد این صفحات رو به شکل ویژه نشون میده.

 

 

 

لزوم طراحی سایت  AMP و مزیت های اون

 

 طراحی سایت  AMP این قابلیت رو ایجاد می‌کنه که دستورات اضافی در سایت‌ها حذف بشن، در نتیجه با سرعت بالاتری روی گوشی‌های تلفن همراه بارگذاری میشن . کد های ای ام پی سنگین نیستن و در واقع چند برچسب و محدودیت به کدهای html اضافه می کنن که با استفاده از این برچسب‌ها و محدودیت‌ها سایت‌ها سریعتر روی گوشی‌های تلفن همراه اجرا میشن. در این حالت محتواهای تبلیغاتی از روی سایت‌ها حذف شده و محتواهای متنی سریعتر لود میشن.

 

برای طراحی سایت با  AMP  باید طبق مراحل زیر پیش رفت :

 

  •   ساختن صفحه AMP Html

 

قطعه کد‌های AMP در کنار کدهای html قرار می‌گیرن. ممکنه کد‌هایی که برای هِدِر سایت نوشته میشن کمی بیشتر باشه، اما این کدها دیده نمی‌شن.

 

  •   ساختن تگ تصویر

 

با استفاده از اکثر تگ‌های html میشه تگ‌های amp html را بازسازی و پیاده سازی کرد؛ اما ساختن تگ‌های تصاویر ممکنه کمی متفاوت باشه، البته تگ‌های خاصی از تصویر در ای ام پی ممنوع هستن، اما مابقی تگ‌ها  رو میشه به راحتی با تگ های ای ام پی جایگزین کرد.

 

  • اصلاح  لایه ها

 

برای طراحی بخش ظاهری سایت‌ها، عموما از Css استفاده میشه. در این حالت عناصر کلاس‌ها و موارد مشابه در هِدِر سایت استفاده و شکل ظاهری سایت‌ها را تشکیل میدن، اما در طراحی سایت  AMP  هر صفحه سایت باید یک Stylesheet جداگانه داشته باشه.

 

  •  پیش نمایش صفحات و بررسی اعتبار آنها

 

بعد از اینکه تغییرات در صفحات داده شد می‌تونید به راحتی صفحات رو بارگذاری کنید و اونها رو به صورت پیش نمایش مورد بررسی قرار بدید. ممکنه در طراحی سایت  AMP بخشی‌هایی از سایت و یا صفحات با مشکل روبرو بشن، برای همین بهتره که صفحات در ابتدا به صورت پیش نمایش نشون داده بشن تا در صورت بروز خطا رفع کردن اونها ساده باشه.

 

  •  آماده کردن صفحات برای بررسی و کشف کدهای  AMP

 

ممکنه بخواید یه مقاله تو وب سایت‌تون منتشر کنین، در این صورت سایت شما دارای یک صفحه برای انتشار مقاله به صورت فرمت اصلیه. حالا اگه بخواید این مقاله به صورت amp هم منتشر بشه، در این صورت سایت شما یک بخش دیگری هم داره که مقاله رو به صورت amp نشون میده. اگر گوگل صفحه اصلی رو پیدا کنه برای اینکه به کاربرا نشون بده نسخه دیگه‌ای به صورت amp هم وجود داره، باید صفحات شما را به‌ هم لینک بده که  این کار با استفاده از کدهایی  که در صفحات نوشته شده امکان پذیره.

 

 انتشار صفحه بر اساس AMP

 

حالا که صفحه‌ها ساخته شدن، میشه به راحتی اونها رو روی بستر اینترنت منتشر کرد. این نکته را باید به یاد داشته باشید که AMP یک تکنولوژی نوپا و نوظهوره و خیلی از شرکت ها  هنوز با اون آشنایی ندارن. برای اینکه بتونید فرآیند طراحی سایت  AMP را خوبی انجام  بدید باید با شرکت‌هایی همکاری کنید که مدتیه با این تکنولوژی کار می‌کنن و به خوبی با اون آشنا هستند. 

اگر قصد دارید تا وب سایت خودتون با استفاده از AMP طراحی کنید، کافیه با مشاوران و کارشناسان ما تماس بگیرید تا راهنماییتون کنن. 

 

چرا باید طراحی سایت  AMP داشته باشیم؟

 

 امروزه گوشی‌های تلفن همراه هوشمند رشد بسیار بالایی دارن و طبیعتا کاربرهای زیادی رو هم با خودشون همراه کردن. یکی از قابلیت‌های این گوشی‌های هوشمند استفاده از خطوط اینترنت پرسرعته که با استفاده از اون به راحتی میشه از اینترنت استفاده کرد و به وب سایت‌های مختلف سر زد. در حال حاضر سایت‌هایی که از ای ام پی استفاده نمی‌کنن روی گوشی های تلفن همراه به کندی اجرا میشن و به خاطر همین زمان لود بالایی که دارن، ممکنه تعداد زیادی از کاربراشون رو از دست بدن. در واقع آمار نشان میده که اگر سایتی در 3 ثانیه بارگذاری نشه، ممکنه کاربر اون رو ترک کنه.

 

 

منبع: رویش نوین