آموزش سایت جی تی متریکس(gtmetrix)

آموزش کلی جیتیمتریکس(gtmetrix)

training-gtmetrix/ ‎

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

خوب قسمت Additional tips:

این قسمت به نکات سیستم محتوا اشاره میکند و بعضی مواقع که سرور سرعت لودش پایین باشد نشان میدهد.

اموزش gtmetrix در سئو سایت بخش امتیازات سایت Performance Scores:

در این قسمت دو بخش وجود دارد PageSpeed Score امتیاز سرعت سایت است که بین 0 تا 100 است و از 85 به بالا خوب است البته بهترین ان نزدیک صد است و دیگری YSlow Score امتیاز منابع مختلف توضیح میدهد .

چزییات سایتPage Details:

Page Load Time این قسمت سرعت لود سایت را البته از سرور کانادا میگه که سرعت زیر 2 ثانیه بکر است اما کلا از نظر سئو نباید سرعت سایت بالای 4 ثانیه باشد Total Page Size حجم صفحه سایتتون میگه که هرچی از عکس ها و اسکریپ ها کمتر استفاده شود بهتر است چرا که وقتی ربات جستجوگر وارد سایت شما میشود زمان زیادی باقی نمیماند اگر شما از منابع زیادی استفاده کنید نمیتواند درست لینک ها و مطالب سایت را ایندکس کند من یک سایت با قالب خودش صفحه 3 بود قالبشو عوض کردم و بهینه کردن 2 صفحه رتبه اش بالاتر امد لینک اخر صفحه اول پس باور کنید سرعت سسایت خیلی تاثیر داره مخصوصا در شروع سایت.

gtmetrix استفاده شده ها Using:

این قسمت اطلاعات مرورگر و سرعت به دست امده با همین مرورگر نشون میده.

Test Server Region:

به شما میگه که این اتصال از کانادا است و شاید از جاهای مختلف فرق داشته باشد.

Optimize images بهینه سازی عکس:

training-gtmetrix

شما از طریق این قسمت میتوانید درصد بهینه شدن عکس را ببینید و نسخه بهینه شدی عکس خود را با مقدرا درصد بهینه شده با کلیک روی لینک ان دانلود کرده و در سایت خود جایگزین کنید این روش کمک خوبی به کاهش حجم قالب که بین 300 تا 500 کیلو بایت از نظر سئو مفید است برسید وسواس به خرج ندید مثلا باری 1 درصد عکس های که مثلا 50 درصد بهینه سازی است زا دانلود و جایگزین کنید به عکس زیر نگاه کنید.

قسمت انالیز جاوا اسکریپت Defer parsing of JavaScript:

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

اموزش سایت gtmetrix فایل های کش شده Specify a cache validator:

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

آموزش سئو

قرار گیری مناسب فایل جاوا اسکریپت و استایل Optimize the order of styles and scripts:

این قسمت شما باید دقت کنید این قسمت به شما اموزش میده که فایل سی اس اس(css) بالاتر و قبل از فایل های جاوا اسکریپت قرار دهید.

گزینه وجود علامت های در بخش های استاتیکی Remove query strings from static resources:

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

بررسی خواندن فایل های سی اس اس  Avoid CSS @import:

برای این قسمت اگر مدیران وب سات ها چند فایل استایل خارجی داشتن اصلی  رو در سمت HTML سایت فراخوانی میکنن و بقیه با دستور “(“import url(“your file adress.css@” از داخل اون فایل استایل اصلی بارگزاری میکنن. اینکار یکی از اشتباهاتی هست. برای رفع این مشکل کافیه به آدرسی که GTMetrix داده برین و اون بخش مربوط به @import رو حذف کنین و فایل رو ذخیره کنید. بعد به Head سایتتون برین و با دستور زیر اون هارو جداگانه فراخوانی کنین و یا اینکه اگه امکانش بود با هم ادغام کنین.

بخش های استایل خرد Inline small CSS and  Inline small JavaScript:

ففایل های استایل و جاوا اسکریپت خارجی شما اگر خرد یا کوچک باشد این بخش  میگوید که محتوای آنها را کپی و در بخش head سایت قرار دهید .

کم کردن حجم های جاوا اسکریپت و سی اس اس Minify CSS و Minify JavaScript:

با حذف بخش توضیحات اضافی قالب را بهینه کنید.سایت در بخش optimized version مقابل هر آدرس, آدرسی برای دریافت کدهای بهینه شده را هم به شما نشان می دهد ,  بهتره از فایل های خود یک بک آپ بگیرید و بعد این نسخه های بهینه شده را جایگزین آنها نمایید.

کم کردن حجم فایل اچ تی ام ال Minify HTML:

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

 اموزش جی تی متریکس بخش های که نیست Avoid bad requests:

با این ابزار میتوانید فایل ها یا تصاویری که در سایت استفاده کرده اید ولی وجود ندارند را ببینید و درست نمایید.

 فقدان فهمیدن مدل فایلAvoid a character set in the meta tag :

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

 فقدان تشخیص ریدایرکت مناسبAvoid landing page redirects :

وقتی این مورد در سایت هایی دیده می شود که بارگزاری سایتتان را به بدون www به کمک فایل .htaccess بسته و قفل کرده اید.

درصد وجود علملیات فشرده سازی Enable gzip compression

قابلیت “جی زیپ”  فایلهایی که از سمت سرور به مرورگر ارسال میشه به صورتفشرده کرده شده و  ان را به مرورگر ارسال میکنه و میزان حجمی که در مرورگر کاربر باید لود شه کمتر میشه .میتوانین از افزونه های “gzip” یا wp rocket  استفاده کنید.خیلی مهم است.

پویا بودن یک هاست برای سایت Enable Keep-Alive:

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

حفظ بخش های مختلف ثابت در کش Leverage browser caching :

در این بخش جی تی متریکس لیستی از فایلهایی که بهتر در مرورگر ذخیره شود رو نشون میده.

بهینه سازی ریدایرکت هاMinimize redirects

شما بهتره که ریدایرکت هایی که تو سایت انجام دادین رو به کمترین مقدار برسونین. بهتر یشتر مواقع در هنگام استفاده از فرم تماس با ما در سایت ها می بینین نوشته بعد از چند ثانیه  به صفحه بعد منتقل میشین،باید از این نوع استفاده نکند یا ریدایرکت های صفحات 404 که بسیار زیاد است.

اموزش gtmetrix کاهش اتصالات از سرورMinimize request size :

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

خواندن فایل سی اس اس خارج از هد Put CSS in the document head :

شما میتوانید به وسیله این اخطار  که فایل استایل خودتان را در بخشی خارج ازهد سایتتان بخوانیدبرای حل این مشکل کافی است بخشی را که اخطار داده است را به قسمت هد سایت منتقل کنید.

بخش های یکسان اما  ادرس های مختلف Serve resources from a consistent URL :

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

مشکل در سایز تصاویر Serve scaled images :

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

فقدان در مشخص کردن مدل کاراکتر در فایل ها Specify a Vary: Accept-Encoding header :

وقتی که یا نوع کاراکتر فایل نشان داده شده ، درج نشده باشه و یا اینکه از چند نوع متفاوت به صورت یکجا قرار گرفته باشد.

مشخص کردن مدل کاراکتر در فایل هاSpecify a character set early :

میگوید نوع کاراکتر را مشخص نکرده اید. مثلا برای سایتهای فارسی کد بالا را به فایلهایی که نشان می دهد بیافزاید.

 مخلوط کردن تصاویر  در استایل Combine images using CSS sprites :

با این بخش لیست تصاویری که ابعاد کوچکی دارند یا حجم آنها کم می باشد را نشان می دهد.

همبستگی در خواندن فایل ها.Prefer asynchronous resources :

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

خوب بخش yslow  را توضیح میدهم:

اموزش gtmetrix استفاده بهینه از Use a Content Delivery Network (CDN):

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

لود فایل کش Add Expires headers در سئو سایت:

این گزینه میزان لود شدن فایل کش میگه.با زدن روی اون میتوانید بفهیمد چه فایلی در کش مزوزگز ثبت نمیشود یا دیرتر لود میشود این قسمت همیشه باید جایگاه ها فونت ها را درست کنید.

مخلوط بخش های یکسان Make fewer HTTP requests

در این جا به شما میگه که تا جایی که ممکنه فایلهای یکسان مخلوط کنید. بهترین افزونه برای این بخش افزونه autoptimize که بروی روی سرعت سایت اثر خوبی دارد.البته با بعضی افزونه کر نمیکند مثل wp rocket.

عدم داشتن مقدار صفحه ها Avoid empty src or href :

به شما میگه که وقتی از تگهایی مثل a یا img تو کدهاتون استفاده کردین مقدار صفت لینک و یا مقدار آدرس اونها رو بدون مقدار ول نکنید.

بهینه کردن با جی زیپ Compress components with gzip :

این هم در قسمت اول توضیح داده شد مشابه است.

Minify JavaScript and CSS این قسمت توضیح داده شد.

کاهش ریدایرکت Avoid URL redirects در سئو :  

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

کش اجاکسMake AJAX cacheable :

در این قسمت برای اینکه از لود کردن  پیج برای بارگزاری اطلاعات عصبی شدین و رو به استفاده از اجاکس تو جی کوئری آوردین , این گزینه به شما میگه این کدها رو هم در کش مرورگر  ثبت کنیدباعث افزایش سرعت میشه

خواند استایل به بیشترین حد خود Put CSS at the top : 

در این جا GTMetrix  خواندنی که برای بارگزاری فایل های استایل انجام میدید رو به بخش هد سایت منتقل کنیند.

تغییر خواند جاوا اسکریپ در اخر Put JavaScript at bottom :

در این جا میگه فایلهای جاوا اسکریپت رو در اخر  بالای تگ </html> انتقال بده. با وجوئ این تغییر  ابتدا سایت بارگزاری بشه بعد بره سراغ فایلهای جاوا اسکریپتکه این خیلی خوب است

پاک کردن کدهای یکسان Remove duplicate JavaScript and CSS : 

جی تی متریکس برای کاهش حجم ابتدا فایل های یکسان استایل ,جاوا اسکریپت توابع یکسان داخل اونها رو پاک کنید.

استفاده نکردن از این فیلتر Avoid AlphaImageLoader filter :

در این جا gtmetrix فیلتر AlphaImageLoader  جایگاهشو جایی میدونه که  بخواهد از تصاویر شفاف  استفاده کند.

پاک کردن  404 ادرس های Avoid HTTP 404 (Not Found) error

این قسمت میگه بخش های که پاک شدن باید کلا remove بشن است سایت و گوگل وبمستر تولز.

اموزش سایت جی تی متریکس کاهش این قابلیت Reduce the number of DOM elements

gtmetrix سعی کنید کمتر از dom استفاده کنید.

استفاده نکردن از کم یا زیاد کردن اندازه تصویر با HTMLDo not scale images in اچ تی ام ال : 

با کمک اچ تی ام ال سایز تصاویر خودتون مشخص نکنید چون این قابلیت ندارد.

کم کردن حجم کوکیReduce cookie size و Use cookie-free domains : 

gtmetrix استفاده بی رویه از کوکی ها در سرور نه تنها با افزایش سرعت نمیشود باعث کاهش نیز میشود.

آموزش gtmetrix اسفاده از گت برای آجاکس Use GET for AJAX requests :

اگر با آجاکس کار میکنید و درخواستی رو ارسال میکنید  از متد GETاستفاده کنید.

 استفاده نکردن از  سی اس اس به خاطر بهینه کردن برای مرورگرها Avoid CSS expressions :

شما از عباراتی که در سی اس اس برای ببهینه سازی سایت با مرورگر ها مخصوصا اینترنت اکسپلور وجود داررد کمک نگیرید.

اندازه درست ایکون سایتMake favicon small and cacheable : 

استفاده کنید از یک ایکون استاندارد برای favicon سایتتون که بهتر است.

اووووف بالاخره تموم شد امیدوارم یک دید کلی جالب و خوبی از سایت gtmetrix  گرفته باشید اگه غلط املایی یا اشتباهی دیدید به بزرگی خودتون ببخشید موفق باشید.

2 دیدگاه در “آموزش سایت جی تی متریکس(gtmetrix)

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

  • با سلام و احترام

    بنده این ارور رو دارم
    اما راه حل کردنش رو نمیدونم

    Specify a Vary: Accept-Encoding header

    اگه امکانش هست توضیح بدید

    به این فایل گیر میده :
    The following publicly cacheable, compressible resources should have a “Vary: Accept-Encoding” header:

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *