آموزش و نحوه کار با وب سایت gtmetrix قسمت دوم

ما در قسمت اول آموزش  سایت gtmetrix  به موارد پایه اشاره کردیم. لینک این مقاله در زیر قرار دارد و اگر اطلاعات کافی ندارید ابتدا این مقاله را مطالعه نمایید.

قسمت اول آموزش gtmetrix

در قسمت قبل تا  تب های اطلاعات پیش رفتیم و در عکس زیر به نمایش قرار میدیم که کدام قسمت مدنظر ماست

آموزش جی تی متریکس

Pagespeed : جزئیات سرعت سایت و مواردی که بررسی شده اند و نیز مواردی که نقص دارند و باید برطرف بشه را نمایش می دهد.

Yslow : جزئیات سرعت سایت طبق فاکتورهای yslow . مواردی که در این روش مورد بررسی قرار میگیرد، از دیدگاه سایت یاهو است.

Watefall : این مورد مواردی را که در سایت شما به ترتیب باز میشه و زمانی که میبره تا باز بشه را بررسی کرده. با استفاده از این قسمت می توانید بررسی کنید کدام قسمت سایت زمان بیش از حدی می برد و آن بخش را  اصلاح نمایید.

Timing : این مورد نیز با یک نمودار به شما می گوید چقدر زمان برده تا مرحل بارگذاری سایت سپری شود. اگر سرور شما مناسب نباشد از این بخش می توان این مورد را بررسی نمود اما نمی توان به قطعیت گفت سرور شما مشکلی دارد یا خیر.

Video :در این بخش یک فیلم از مراحل بارگذاری سایت شما گرفته و نمایش داده می شود تا ببینید جزئیات آن چگونه است. اگر قبلا این گزینه را فعال نکرده اید می توانید روی گزینه enable video  کلیک کنید تا آنالیز مجدد همراه با فیلم برای شما انجام گردد. استفاده از این فیلم برای سایتهایی که سرعت بارگذاری بالایی دارند و البته زمان بارگذاری کوتاه مثل سایت 7سئو، نیاز نیست اما برای کسانی که سایت آنها سرعت مناسبی ندارد کمک کار مناسبی است.

History : در این بخش تاریخچه ای از نتایج آنالیز های قبلی سرعت سایت را خواهید دیدکه بصورت نمودار نمایش داده می شود و می توانید تغییراتی که در سایت داده اید را نسبت به قبل بسنجید.

از مواردی که در بالا گفته شد، مهمترین قسمت page speed score است که دیدگاه گوگل به سایت شما است. پس به بررسی جزئیات این قسمت و راه حل برای تک تک مشکلات آن خواهیم پرداخت.

 

Leverage browser caching

 همانطور که میدانید مرورگرها برای تسریع در باز شدن سایت، برخی موارد را کش می کنند یعنی داخل خود ذخیره می کنند تا برای دفعات بعد لازم به دانلود آنها نباشد. این گزینه نیز فایلهایی را نشان میدهد که می توانیم به مرورگر دستور کش کردن آنها را بدهیم. برای برطرف کردن این مشکل می توانید کد زیر را در فایل .htaccess سایت خود قرار دهید.

## EXPIRES CACHING ##

ExpiresActive On
ExpiresByType image/jpg "access plus 1 year"
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType image/gif "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
ExpiresByType text/css "access plus 1 month"
ExpiresByType application/pdf "access plus 1 month"
ExpiresByType text/x-javascript "access plus 1 month"
ExpiresByType application/x-shockwave-flash "access plus 1 month"
ExpiresByType image/x-icon "access plus 1 year"
ExpiresDefault "access plus 2 days"

## EXPIRES CACHING ##

 

Optimize the order of styles and scripts

یکی از راههای افزایش سرعت بارگذاری سایت، باز شدن فایلهای css پیش از فایل های js است. برای برطرف کردن مشکل در این بخش کافی است فایلهای css را در کدنویسی سایت بالاتر از js قرار دهید تا مشکل برطرف شود.

Prefer asynchronous resources

اگر جی تی متریکس در اینجا به شما مسکلی نشان می دهد، بدلیل این است که بین فایلهای جاوا اسکریپت شما ناهماهنگی وجود دارد. برای حل این مشکل باید فایلهای جاوااسکریپت به ترتیب و با فاصله لود بشوند.

Defer parsing of JavaScript

این گزینه اشاره به فایلهای جاوا اسکریپت سایت شما دارد و می گوید شما باید فایلهای جاوا اسکریپت خود را در انتها بارگذاری نمایید. برای حل این موضوع باید کدهای فرخوانی فایل های js را به انتهای صفحه ببرید. برطرف کردن این مشکل ممکن است به قیمت به هم ریختگی سایت شما تمام شود.

Specify image dimensions

این گزینه به معنی تعیین اندازه تصاویر سایت هست. یعنی در کد html  سایت خود بنویسیم که طول و عرض تصویر چقدر است. البته این موضوع در سرعت سایت دارای اهمیت متوسط است. نمونه صحیح کد را در زیر ببینید

 

Minify CSS

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

قسمت سوم آموزش gtmetrix

فرم ارسال نظر