افزایش سرعت لود صفحات وب در موبایل با فریم ورک AMP

طبق آمار بدست آمده، اکثر مردم از تلفن های همراه خود برای وب گردی استفاده می کنند و این آمار در حال افزایش است در پی همین مسئله گوگل به فکر افزایش سرعت نمایش وب سایتها در تلفن های همراه افتاد و در سال 2016 فریم ورک AMP را معرفی کرد، برای اطلاعات بیشتر درمورد این فریم ورک با ما همراه باشید.

 

AMP چیست؟

AMP یا (Accelerated Mobile Pages)  به معنای افزایش سرعت لود شدن صفحات وب در تلفن های همراه می باشد. AMP یک فریم ورک Open Source است که برای کمک به برنامه نویسان ایجاد شده است تا برنامه نویسان بتوانند صفحات یک وب سایت را به گونه ای بهینه طراحی کنند تا وب سایت با سرعت بیشتری در تلفن های همراه بارگذاری شود. 

کاربران زمانی که از سایتی بازدید می کنند توقع دارند علاوه بر اینکه سایت دارای گرافیک بالایی باشد همچنین محتوایی مانند ویدیو و انیمیشن هم داشته باشد، خب نظر شما چیه؟ تمام این توقعاتی که همه ی کاربران از یک وب سایت خوب دارند میتونه در بارگذاری صفحات اون وب سایت تاثیر بزاره و باعث کند شدن سایت بشه مخصوصا در تلفن های همراه اما تمام این مسائل برای قبل از مطرح شدن AMP بود چون AMP این مشکل را حل کرده است.

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

Michael Bertini، که محقق آژانس دیجیتال iQuanti می باشد می گوید: گوگل نمیخواهد هیچ کاربری برای دیدن سایتی حتی مدت زمان کوتاهی را منتظر بماند.

Rudy Galfi، مدیر پروژه AMP در کنفرانسی که اخیرا برگذار شده بود گفت: وب سایت هایی که در آنها از فریم ورک AMP استفاده شده است، مدت زمان بارگذاریشان در تلفن های همراه 7 ثانیه می باشد. در صورتی که سرعت نمایش یک وب سایت در حالت طبیعی و بدون استفاده از AMP حداقل 22 ثانیه می باشد.

 

AMP چطور کار می کند؟

AMP کدهای HTML را بهینه سازی میکند که در نتیجه این بهینه سازی، سرعت بارگذاری سایت را افزایش می دهد، فریم ورک AMP دارای ساختار و استایل خاصی می باشد که برنامه نویس را مجبور میکند تا فقط از یکسری کدهای HTML، CSS و JavaScript استفاده کند. برای مثال اگر شما یک برنامه نویس هستید اجازه استفاده از تگ های خاصی از HTML را دارید و فقط میتوانید از کدهای ساده و پرکاربرد CSS استفاده کنید همچنین استفاده کردن از کدهای جاوا اسکریپ هم فقط در جاهایی که خود AMP به شما اجازه می دهد امکان دارد.

در زبان های برنامه نویسی مثل asp.net پیاده سازی آن به صورت های مختلفی بیان شده است ، یک نمونه آن گفته شده است که وقتی وب سایت در موبایل اجرا شد به صورت اتوماتیک به یک پوشه مخصوص رفته و برنامه نویسان باید وب سایت طراحی شده را بر اساس ساختار AMP به صورت جدا طراح کنند.


  این نمونه را مشاهده کنید 


 

فرق میان سایت ریسپانسیو و AMP چیست ؟

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


مطلب مرتبط : طراحی سایت ریسپانسیو


نقش AMP در سئو چیست؟

براساس گفته های Richard Gingras، که مدیریت اخبار و محصولات در گوگل را برعهده دارد سایتهایی که از فریم ورک AMP در آنها استفاده شده دارای رتبه بالاتری هستند.

یکی از دلایلی که AMP باعث افزایش رتبه ی یک سایت میشود این است که تعداد کلیکها و بازدیدهای سایت را به دلیل سرعتی که در Load شدن سایت ایجاد می کند افزایش می دهد زیرا این افزایش سرعت، فعالیتی کاربر پسند است و مطمعنا کاربر بعد از یکبار بازدید از سایت به دلیل سرعت بالا مرتبا از سایت بازدید میکند که در این بین محتویات سایت هم تاثیر مستقیمی بر دیدگاه کاربر دارد بنابراین هر روز باید بروزرسانی شوند.

به عنوان یک برنامه نویس بعد از اینکه تصمیم گرفتید سایت خود را براساس استانداردهای AMP طراحی کنید، صفحات AMP سایت خود را بسازید. شما میتوانید با استفاده از Developer Tools  گوگل کروم مطمئن شوید که صفحات سایتتان را براساس AMP استاندارد سازی کرده اید و زمانی که کاربر با تلفن همراه خود از سایت شما بازدید می کند به جای اینکه 22 ثانیه و شاید بیشتر منتظر بماند 7 ثانیه منتظر می ماند تا سایت شما بارگذاری شود.

 



به مطلب ارائه شده امتیاز بدهید


منبع : cio

Arun
غزاله شریفی لیسانس برنامه نویسی تحت وب، دارای مدرک تخصصی زبان فنی کامپیوتر ، علاقه مند به حوزه تکنولوژی و فن آوری ، مترجم و نویسنده مقالات کارناوب

  • مطلب چه طور بود؟ سوالی در این باره دارید؟ در بخش نظرات مطرح نمایید.

خدمات طراحی سایت
مقالات طراحی وب سایت
اخبار کارناوب
نظر سنجی

به نظر شما به جز محتوای خوب چه چیزی بیشتر باعث می شود کاربران دوباره به سایت برگرند؟(12رای )


نمایش نتیجه ها




پروژه های در حال انجام

طراحی سایت گروه رویش

(25%)


طراحی سایت خرید فروش خودرو

(25%)


سئوی سایت بانه کالا

(50%)


طراحی اپلیکیشن دالینو

(55%)


سئوی سایت آناهید

(60%)


طراحی سایت فروشگاه سازه

(60%)


اپلیکیشن IOS کارناوب

(80%)


اپلیکیشن اندروید تولید ایرانی

(90%)


فروشگاه و اپلیکیشن هپی مپی

(90%)


بـاغ ویـلای پرند

(95%)


Open Source چیست ؟
Open Source چیست ؟ شما در سیستم های بسته مثل سیستم های نرم افزاری و سخت افزاریه apple کارهایی رو میتونین به عنوان کاربر انجام بدین، ولی به عنوان یک توسعه دهنده دسترسی به محتوای اصلی اونها ندارین، یعنی اینکه شما نمیتونین از هسته اصلی سیستم Mac استفاده کنین و یک سیستم عامل بهتر توزیع کنید، Open source میگه که نه این کار درست نیست و شما نمیتونین آدمها رو محدود کنین، هر شخصی باید بتونه به هر شکلی که دلش میخواد از سیستم های نرم افزاری و سخت افزاری استفاده کنه، چون ممکنه افراد مختلف اطلاعاتی داشته باشن که بتونه به پیشرفت این سیستمها کمک کنه.
1 0
html5 چیست ؟
html5 چیست ؟ زبانی برای ساختن و ارائهٔ محتوا برای شبکه جهانی وب است، این پنجمین تجدید نظر از استاندارد اچ‌تی‌ام‌ال است (در سال ۱۹۹۰ ایجاد و در سال ۱۹۹۷ به عنوان HTML4 استاندارد شده‌است) و تاکنون همچنان در دست توسعه‌است. اهداف اصلی اچ‌تی‌ام‌ال۵ بهبود این زبان به صورتی است که از جدیدترین فناوری‌های چند رسانه‌ای پشتیبانی کند در حالی که هم به راحتی توسط انسان‌ها قابل خواندن باشد وهم به طور مداوم توسط رایانه‌ها و دستگاه‌ها (مرورگرهای وب، تجزیه کننده‌ها و غیره) قابل درک باشد. اچ‌تی‌ام‌ال۵ در نظر دارد نه تنها HTML4 بلکه XHTML۱ و ۲HTML را نیز پشتیبانی کند.
2 0
بیشتر بدانید : ویکی پدیا
CSS3 چیست ؟
CSS3 چیست ؟ CSS3 مانند html5 یک استاندارد مدرن است. CSS در سه نسخه عرضه شده است که CSS3 آخرین نسخه از محدوده های طراحی وب سایت است که توانسته بهترین قابلیتها را برای طراحان وب سایت ایجاد کند.
2 0
جاوا اسکریپت چیست؟
جاوا اسکریپت چیست؟ جاوا اسکریپت یک زبان برنامه نویسی است که درون کدهای HTML قرار می گیرد، جاوا اسکریپت تغییر در المانهای نمایش داده شده را برعهده دارد درواقع از این زبان برای داینامیک یا پویا ساختن وب سایت استفاده میشود.
0 0
asp.net
asp.net ASP.NET نسل بعدی Active Server Pages یا ASP است که توسط شرکت میکروسافت ارائه شده است. این محصول توسط میکروسافت بعنوان شاخص اصلی فناوری در ساخت سایتهای وب در نظر گرفته شده است. با استفاده از ASP.NET می توان هم اینترانت کوچک یک شرکت را ساخت و هم یک سایت وب تجاری خیلی بزرگ را طراحی و پیاده سازی نمود. مهمترین نکاتی که در طراحی این محصول در نظر گرفته شده است راحتی استفاده و بالا بودن کارائی و قابلیت آن می باشد
1 0
ریسپانسیو چیست ؟
ریسپانسیو چیست ؟ ریسپانسیو به معنای پاسخ گرا یا واکنشی می باشد. به این معنا که سایت در دستگاه ها و ابزارهای مختلف به درستی نمایش داده می شود برای مثال زمانی که شما با گوشی و یا تبلت یک سایتی را تماشا میکنید ساختار ظاهری سایت به همان شکلی خواهد بود که آن را در کامپیوترتان تماشا می کنید.
3 0