🧰 ابزارگشایی: آموزش جی تی متریکس + رفع خطاهای GTMetrix

جی تی متریکس سایت چیست و چگونه کار می‌کند؟

گوگل در سال‌های اخیر اعلام کرده است که سرعت صفحۀ سایت یک عامل کلیدی در رتبه‌بندی نتایج جست‌وجو است؛ بدین ترتیب، تأکید بیشتری بر بهینه‌سازی عملکرد سایت شده است. چندین ابزار آنلاین با هزینه‌ها و قابلیت‌های متفاوت وجود دارد که می‌توان از آن‌ها برای افزایش عملکرد سایت استفاده کرد. یکی از بهترین و معروف‌ترین این ابزارها، جی تی متریکس (GTMetrix) است.

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

در این مطلب از وی‌پدیا به آموزش ابزار جی تی متریکس می‌پردازیم و به شما می‌گوییم که چگونه می‌توانید گزارش‌های جی تی متریکس سایت خود را بخوانید و آن‌ها را تجزیه‌و‌تحلیل کنید.

فهرست مطالب
خطاهای جی‌تی متریکس چیست؟

جی تی متریکس چیست؟

جی تی متریکس (GTMetrix) یکی از ابزارهای تست عملکرد وب است که توسط شرکت میزبانی GT.net مستقر در ونکوور کانادا ساخته شده است. شما از طریق تجزیه‌وتحلیل سایت خود با این ابزار، می‌توانید برای بهبود سرعت سایتتان اقدام کنید.

در سال ۲۰۲۰، جی تی متریکس پلتفرم خود را با بزرگ‌ترین تغییر خود تاکنون، به‌روزرسانی کرد و کتابخانه‌های PageSpeed/YSlow را با Lighthouse، پلتفرم استاندارد صنعت وب، جایگزین کرد. با افزودن این فناوری، گزارش‌های جدید جی تی متریکس کاملاً بازطراحی شده است تا داده‌ها و معیارهای لایت‌هاوس را در خود جای دهد.

جی تی متریکس همچنین یک سیستم امتیازدهی جدید ارائه کرد که شامل امتیاز الفبایی جی تی متریکس در کنار امتیازهای عملکرد (Performance) و ساختار (Structure) است. با گزارش جدید جی تی متریکس، می‌توانید از طریق زبانه‌های جدید، تجسم‌ها، نمودارها و بینش‌های عمیق‌تر، اطلاعات بیشتری دربارۀ عملکرد سایت خود کسب کنید.

جی تی متریکس چیستچرا جی تی متریکس سایت مهم است؟

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

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

هدف اصلی جی تی متریکس، تجزیه‌وتحلیل عملکرد سایت و ارائۀ لیستی از توصیه‌های عملی برای بهبود است. همچنین، به ما امکان می‌دهد تا به‌صورت روزانه، هفتگی یا ماهانه، براساس تعدادی معیار کلیدی، از عملکرد سایت خود گزارش‌گیری‌ کنیم. با کمک جی تی متریکس، شما می‌توانید متوجه شوید که سایتتان چه مشکلاتی دارد و آن را به‌راحتی بهبود ببخشید.

چگونه با جی تی متریکس کار کنیم؟

با مراجعه به سایت جی تی متریکس (GTMetrix) می‌توانید از نسخۀ مبتنی بر وب آن‌ استفاده کنید. اما بهتر است ابتدا یک حساب کاربری رایگان جی تی متریکس ایجاد کنید. این کار به شما امکان می‌دهد تست خود را سفارشی کنید و نتیجۀ عملکرد قابل‌ اطمینان‌تری داشته باشید. حساب رایگان، محدود به تعدادی درخواست در روز است.

برای تجزیه‌وتحلیل سرعت بارگذاری یک صفحه با جی تی متریکس، فقط کافی است URL موردنظر خود را وارد کنید و روی دکمۀ Analyze کلیک کنید.

چگونه با جی تی متریکس کار کنیمبا‌این‌حال، برای به‌دست‌آوردن نتایج دقیق‌تر، توصیه می‌شود گزینه‌های تجزیه‌وتحلیل را تغییر دهید و سفارشی کنید. چندین گزینۀ سفارشی‌سازی (منطقۀ آزمایشی سرور، نوع مرورگر و…) تجربۀ جی تی متریکس سایت را کامل‌تر و قابل ‌اعتمادتر می‌کند. به یاد داشته باشید که به‌عنوان کاربر مهمان هم می‌توانید از این ابزار استفاده کنید؛ اما به‌منظور بهره‌گیری از ویژگی‌های بیشتر، ازجمله امکان تغییر مکان سرور، باید برای یک حساب کاربری رایگان ثبت‌نام کنید. ضمن اینکه حساب‌های پولی امکانات پیشرفته‌تری را در اختیارتان قرار می‌دهند.

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

چگونه تست جی تی متریکس خود را سفارشی کنیم؟

همان‌طور که گفتیم، چندین گزینه وجود دارد که می‌توانید آن‌ها را برای سفارشی‌کردن تست جی تی متریکس سایت خود تغییر دهید. این گزینه‌ها شامل موارد زیر است و با کلیک روی منوی بازشوی Analysis Options، قابل پیکربندی است:

چگونه تست جی تی متریکس خود را سفارشی کنیم 1چگونه تست جی تی متریکس خود را سفارشی کنیم 2

A: تنظیمات مکان (منطقۀ آزمایشی) سرور است. اگر روی منوی کشویی کلیک کنید، این امکان را دارید که سرورهای مختلف موجود برای آزمایش را ببینید و از بین آن‌ها انتخاب کنید. درمجموع ۹۷ سرور آزمایشی برای امتحان وجود دارد. اولین قدم برای کسب نتایج قابل ‌اعتماد از تست‌های سرعت، این است که تا حد امکان مکانی را نزدیک به سرور خود انتخاب کنید. این بدان معناست که اگر سرور شما در اروپا قرار دارد، آزمایش سرعت شما از کانادا نتیجۀ گمراه‌کننده‌ای به شما می‌دهد، مگر اینکه مخاطبان کانادایی را نیز هدف قرار دهید و ترافیک زیادی را از آن‌سو جذب کنید. در این مورد، فراموش نکنید که CDN را در سایت خود فعال کنید!

به‌طور پیش‌فرض از سرورهای ونکوور استفاده می‌شود، اما می‌توانید آن را تغییر دهید و سرور دیگری را انتخاب کنید. جی تی متریکس خدمات خود را به دو صورت حساب‌های رایگان و حساب‌های پریمیوم ارائه می‌دهد. تفاوت کلیدی در این است که با حساب‌های پولی به مکان‌ها و سرورهای بیشتری برای تست دسترسی دارید و می‌توانید آزمایش‌های بیشتری را در هفته انجام دهید. با نسخۀ رایگان می‌توانید از بین این ۷ مکان مختلف انتخاب کنید:

  1. ونکوور، کانادا؛
  2. هنگ‌کنگ، چین؛
  3. بمبئی، هند؛
  4. لندن، انگلستان؛
  5. سن آنتونیو، تگزاس، ایالات‌متحدۀ آمریکا؛
  6. سیدنی، استرالیا؛
  7. سائو پائولو، برزیل.

در‌حالی‌که با نسخۀ Pro می‌توانید از بین ۲۲ مکان انتخاب کنید. لیست و مکان تمام سرورهای سایت جی تی متریکس را در اینجا مشاهده کنید. اگر ‌سایت شما از یک منطقۀ خاص ترافیک زیادی را جذب می‌کند، داشتن یک حساب پریمیوم می‌تواند به شما کمک کند که با آزمایش‌های بیشتر، سایت خود را به‌لحاظ محلی ارتقا دهید.

B: می‌توانید نوع عامل/دستگاه مرورگر را برای آزمایش تغییر دهید. اگر در حال آزمایش ظاهر سایت خود در iPad یا نوع خاصی از تلفن هستید، این منوی کشویی برای شماست. به خاطر داشته باشید که فقط در صورتی می‌توانید دستگاه دیگری را انتخاب کنید که یک حساب حرفه‌ای داشته باشید.

C: این تنظیم به شما امکان می‌دهد اتصال را قطع کنید تا بتوانید بارگذاری سایت خود را در نوع خاصی از اتصال، مانند dialup یا ۳G/4G موبایل تجربه کنید.

D: این تنظیم به شما امکان می‌دهد با مشاهدۀ دقیق نحوۀ بارگیری صفحه در محیط آزمایش، مشکلات بارگذاری صفحه را اشکال‌زدایی کنید. جی تی متریکس ویدئویی ضبط می‌کند که در آن صفحۀ شما ۴ برابر کندتر بارگذاری می‌شود، بنابراین تشخیص مشکلات احتمالی بارگذاری آسان‌تر خواهد بود.

E: با استفاده از تنظیمات AdBlock Plus، می‌توانید ببینید که آیا قوانین پلاگین معروف AdBlock Plus بر عملکرد صفحۀ شما یا بارگذاری CSS/asset تأثیر می‌گذارد یا خیر. همچنین، اگر در سایت خود تبلیغات دارید، می‌توانید ببینید که بارگذاری سایتتان بدون تبلیغات چگونه است.

F: اگر سایتی که در حال محک‌زدن آن هستید به احراز هویت HTTPS نیاز دارد، در اینجا باید آن را وارد کنید.

G: با گزینۀ Only Allow URL، می‌توانید تعیین کنید که جی تی متریکس فقط منابعی را بارگیری کند که با یک یا چند URL در لیست مطابقت دارند.

H: اگر صفحاتی را آزمایش می‌کنید که نیاز به ورود کاربر دارند (مانند صفحۀ پرداخت)، می‌توانید برای شبیه‌سازی آن، کوکی و شناسۀ سشن را در اینجا وارد کنید.

I: با ویژگی Block URL، می‌توانید از بارگیری منابعی که با یک یا چند URL در لیست مطابقت دارند جلوگیری کنید.

ویژگی Block URLبدین ترتیب، سایت شما با استفاده از ابزارهای موجود تجزیه‌وتحلیل می‌شود و درنهایت، یک گزارش کامل از وضعیت صفحۀ وب موردنظر به شما نمایش داده می‌شود. با تفسیر بخش‌های مختلف این گزارش‌ و عمل‌کردن به اشکال‌ها و پیشنهادات مطرح‌شده، می‌توانید عملکرد سایت خود را بهینه کنید.

نحوۀ تفسیر نتایج جی تی متریکس

گزارش‌هایی که جی تی متریکس تولید می‌کند بسیار مفید و البته پر از جزئیات‌ است؛ درنتیجه درک آن‌ها تا حدودی چالش‌برانگیز است. در ادامه به معرفی بخش‌های مختلف این گزارش‌ها می‌پردازیم.

نحوۀ تفسیر نتایج جی تی متریکسبه‌طور کلی، گزارش جی تی متریکس سایت شامل ۳ دستۀ اصلی می‌شود:

  1. جزئیات مربوط به امتیاز‌دهی سایت در جی تی متریکس (GTmetrix Grade)؛
  2. آمارهای حیاتی سایت در جی تی متریکس (Web Vitals)؛
  3. زبانه‌های مربوط به تحلیل تخصصی بخش‌های مختلف سایت در جی تی متریکس.

در ادامه، به معرفی جزئیات هریک از بخش‌های گزارش جی تی متریکس سایت خواهیم پرداخت.

برای کسب اطلاعات بیشتر، پیشنهاد میکنیم بعد از خواندن این مطلب، مطلب راهنمای گام‌‌به‌‌گام برای ایجاد تغییرات تأثیرگذار در سئو از بلاگ صباویژن را ازدست ندهید.

۱) امتیاز جی تی متریکس (GTmetrix Grade)

سیستم امتیازدهی مورد استفاده در گزارش جی تی متریکس تا حدی براساس سیستم امتیازدهی لایت هاوس (Lighthouse) است. با این حال، این سیستم توسط پیکربندی اختصاصی خود جی تی متریکس بهبود یافته و کمی بهینه‌سازی شده است. GTmetrix Grade یک نمرۀ وزنی است که به‌صورت الفبایی از A تا F (بهترین تا بدترین) درجه‌بندی می‌شود. این نمره، از نتایج نمرات جدید Performance و Structure که جایگزین نمرات قدیمی PageSpeed و YSlow از گزارش‌های قدیمی شده‌اند، به دست می‌آید. امتیاز جی تی متریکس میانگین وزنی دو امتیاز مبتنی بر درصد است:

  1. امتیاز عملکرد، که ۷۰٪ از کل امتیاز را شامل می‌شود.
  2. امتیاز ساختار، که ۳۰٪ باقی‌مانده از کل امتیاز را شامل می‌شود.

به خاطر داشته باشید که آنچه بیان می‌شود، پیکربندی فعلی برای محاسبۀ امتیاز جی تی متریکس است که از نوامبر ۲۰۲۰ اعمال شده است. جی تی متریکس به‌طور دائم فرمول‌های خود را تغییر می‌دهد و به‌روزرسانی می‌کند و با گذشت زمان آن‌ها را تکامل خواهد داد.

امتیاز جی تی متریکسامتیاز عملکرد (Performance)

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

امتیاز عملکرد در ابزار جی تی متریکسامتیاز عملکرد، درواقع امتیاز عملکرد لایت‌هاوس شماست که توسط تست‌های جی تی متریکس، با استفاده از هر گزینه‌ای که در سفارشی‌سازی آزمایش مشخص کرده‌اید (مرورگر، کدهای سخت‌افزاری و نرم‌افزاری مانند AdBlock، سرعت اتصال و…) به دست آمده است. امتیاز عملکرد از چند معیار کلیدی با وزن‌های زیر تشکیل شده است:

  • عملکرد بارگذاری (Loading performance)، که ۵۵٪ از امتیاز عملکرد را تشکیل می‌دهد. این امتیاز به شرح زیر است:
    • بارگذاری اولین محتوا (First Contentful Paint) با وزن ۱۵٪. این معیار تعیین می‌کند که بازدیدکنندگان با چه سرعتی می‌توانند اولین محتوای مشخص سایت شما (مانند متن، تصویر، ویدئو و…) را مشاهده کنند.
    • شاخص سرعت (Speed Index) با وزن ۱۵٪. این معیار اندازه‌گیری می‌کند که صفحۀ شما از نظر بصری چقدر با چه سرعتی برای کاربر نمایش داده می‌شود.
    • بارگذاری بزرگ‌ترین محتوا (Largest Contentful Paint) با وزن ۲۵٪. این معیار عملکرد در سال ۲۰۲۰ توسط لایت‌هاوس برای اندازه‌گیری بهتر تجربۀ بارگیری درک‌شده توسط کاربران معرفی شد. این معیار، یکی از معیارهایی است که Web Vitals Google را تشکیل می‌دهد و معرف مدت‌زمانی است که طول می‌کشد تا بزرگ‌ترین المان صفحۀ شما لود شود.
  • تعامل (Interactivity) که ۴۰٪ از امتیاز عملکرد را تشکیل می‌دهد. این امتیاز به شرح زیر است:
    • زمان تعامل (Time to Interactive) با وزن ۱۵٪. یک معیار عملکرد است که میزان پاسخ‌گویی صفحۀ شما را می‌سنجد و به شناسایی موقعیت‌هایی کمک می‌کند که به نظر می‌رسد صفحه کاملاً بارگذاری شده و یک صفحۀ تعاملی است، اما درواقع این‌طور نیست و هنوز مواردی وجود دارند که در حال لودشدن‌ هستند. این موارد می‌تواند یک ویدئو، یک عکس بزرگ، یک بنر و یا حتی آیکون‌های کنار متن شما باشد.
    • زمان کل مسدود‌کردن (Total Blocking Time)، با وزن ۲۵٪. یک معیار عملکرد از لایت‌هاوس است که در سال ۲۰۲۰ معرفی شد. این نیز یکی از معیارهای Web Vitals گوگل است. این معیار نشان‌دهندۀ مدت‌زمانی است که اسکریپت‌های سایت امکان استفاده از خدمات سایت را به کاربر نمی‌دهند.
  • ثبات بصری (Visual Stability) که ۵٪ از امتیاز عملکرد را تشکیل می‌دهد. این امتیاز به شرح زیر است:
    • تغییر چیدمان تجمعی (Cumulative Layout Shift) با وزن ۵%. یکی دیگر از معیارهای Web Vitals گوگل است که در سال ۲۰۲۰ توسط لایت‌هاوس معرفی شد. این معیار، ثبات بصری درک‌شده هنگام بارگذاری صفحه یا به‌ عبارتی میزان تغییر غیرمنتظرۀ عناصر وب در هنگام بارگذاری صفحه را اندازه‌گیری می‌کند.

هریک از این معیارها اندازه‌گیری و به‌عنوان یک امتیاز محاسبه می‌شوند، سپس با یک آستانه (حد نصاب) مقایسه می‌شوند و نتیجۀ کل، با وزن‌دهی مناسب، امتیاز نهایی عملکرد را تشکیل می‌دهد. یافته‌های مربوط به امتیاز عملکرد در زبانۀ Performance گزارش جی تی متریکس موجود است.

امتیاز عملکرد 2امتیاز ساختار (Structure)

امتیاز ساختار، نشان‌دهندۀ ارزیابی انحصاری جی تی متریکس برپایۀ ممیزی‌های مشخصی است و به شما می‌گوید که صفحۀ موردنظرتان برای عملکرد بهینه چه ساختاری با چه امتیازاتی دارد. این ممیزی‌ها براساس معیارهای مختلف جی تی متریکس صورت می‌گیرد و در کنار آن، توصیه‌هایی درجهت بهینه‌سازی عملکرد سایت ارائه می‌شود.

درواقع، جی تی متریکس برای هر ممیزی معیارها و مقادیر مشخصی را در نظر دارد و براساس آن، عملکرد سایت شما از نظر ساختار را ارزیابی می‌کند. این امتیاز نشان می‌دهد که سایت شما تا چه اندازه از نظر ساختار برای موتورهای جست‌وجو بهینه شده است.

امتیاز ساختار۲) آمارهای حیاتی (Web Vitals)

گزارش جی تی متریکس به ما امکان می‌دهد امتیازات صفحۀ خود را براساس معیارهای Web Vitals نیز مشاهده کنیم. Web Vitals یا Core Web Vitals معیارهایی هستند که توسط گوگل در سال ۲۰۲۰ برای ارزیابی تجربۀ کاربر در یک سایت معرفی شدند. گوگل معیارهای Web Vitals را به‌عنوان معیارهای اصلی برای ارائۀ یک سایت/برنامۀ وب سریع، معرفی کرد.

اطلاعاتی که در بخش Web Vitals نمایش داده می‌شود، ارزیابی عملکرد سایت شما درزمینۀ بارگذاری، تعامل و لذت‌بخش‌بودن آن برای کاربران است.

آمارهای حیاتیبخش Web Vitals جی تی متریکس شامل ۳ بخش اصلی است:

  1. بارگذاری و نمایش بزرگ‌ترین محتوا (LCP): LCP اندازه‌گیری مدت‌زمانی است که بزرگ‌ترین عنصر محتوای شما نمایش داده می‌شود.
  2. زمان کل مسدودکردن (TBT): TBT مقدار زمان مسدودشده توسط اسکریپت‌ها در طول بارگذاری صفحه را اندازه‌گیری می‌کند.
  3. تغییر چیدمان تجمعی (CLS): CLS نشان می‌دهد که کاربر هنگام بارگیری سایت/برنامۀ وب شما، با چه میزان تغییر غیرمنتظره در چیدمان عناصر صفحه مواجه می‌شود. تغییر چیدمان تجمعی معیاری مهم و کاربرمحور برای سنجش پایداری بصری به شمار می‌آید.

اگر عملکرد سایت شما در این معیارها خوب باشد، بیانگر این است که شما یک تجربۀ سریع به بازدیدکنندگان سایت خود می‌دهید؛ همان تجربه‌ای که گوگل آن را «تجربۀ لذت‌بخش» نامیده است.

۳) گزارش عملکرد جی تی متریکس

یکی از جذابیت‌های اصلی این ابزار، امکان دسترسی سریع و آسان به شاخص‌های کلیدی عملکرد (KPI) است. بعد از اینکه جی تی متریکس تجزیه‌وتحلیل سایت شما را کامل کرد، یک گزارش عملکرد برای سایتتان نمایش می‌دهد. با دریافت این اطلاعات مفید، می‌توانید از جی تی متریکس برای به‌دست‌آوردن درک کاملی از عملکرد سایت خود استفاده کنید و سپس براساس اطلاعات مطرح‌شده، سایت خود را بهینه کنید.

۶ بخش مختلف گزارش‌های GTmetrix سایت

گزارش‌های جی تی متریکس سایت به ۶ بخش مختلف (در قالب ۶ زبانه) تقسیم می‌شوند:

  1. خلاصه (Summary)
  2. عملکرد (Performance)
  3. ساختار (Structure)
  4. آبشار (Waterfall)
  5. ویدئو (Video)
  6. تاریخچه (History)

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

۱) زبانۀ خلاصه (Summary)

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

زبانۀ خلاصهاین گزارش شامل بخش‌هایی به شکل زیر است:

  • تجسم سرعت (Speed Visualization): در بالای گزارش، Speed Visualization قرار دارد که یک ترسیم بازه‌ای از بارگذاری صفحه با پرچم‌هایی است که معیارهای مختلف امتیاز عملکرد را هنگام بارگیری سایت شما مشخص می‌کند. این نشانگر بصری، مراحل بارگذاری صفحه را نشان می‌دهد و به شما می‌گوید کدام بخش از صفحه در یک زمان معین بارگذاری می‌شود. بنابراین، یک ایده به شما می‌دهد که صفحۀ موردنظرتان در هنگام بارگیری کامل، برای بازدیدکنندگان چگونه ظاهر می‌شود.

زبانۀ خلاصه 2

  • موضوعات برتر (Top Issues): ممیزی‌های فهرست‌شده در اینجا تأثیر مهمی بر عملکرد سایت/برنامۀ وب شما دارد. رفع این موارد، تأثیر بزرگی بر سایر ممیزی‌های ساختار دارد و می‌تواند به‌طور چشمگیری نمرۀ کلی جی تی متریکس و عملکرد/امتیازات ساختار شما را بهبود بخشد. بنابراین، ابتدا باید برای رفع این خطاها اقدام کنید. با بهبود موارد برجسته‌شده در این بخش و آزمایش مجدد صفحه، موارد موجود در این بخش تغییر خواهند کرد. این به شما امکان می‌د‌هد موارد اصلاحی را براساس تأثیر بر عملکرد صفحۀ خود اولویت‌بندی کنید.
  • جزئیات صفحه (Page Details): بخش جزئیات صفحه نموداری از نوع درخواست‌های صفحۀ شما، ازجمله تعداد درخواست‌ها برای بارگیری صفحه/برنامۀ وب و اندازۀ بایت آن‌ها را نشان می‌دهد.

زبانۀ خلاصه 3

این بخش همچنین برای تشخیص اینکه آیا صفحۀ وب شما برای امکاناتی مانند جاوا اسکریپت، CSS و تصاویر بسیار سنگین است یا خیر، بسیار مفید است.

زبانۀ خلاصه 4اگر ماوس را روی بخش خاصی از نمودار نگه دارید، اطلاعات بیشتری درمورد آن نوع درخواست مشاهده خواهید کرد.

اطلاعات بیشتر از جی تی متریکس (More from GTmetrix)

نکاتی که در اینجا نمایش داده می‌شود براساس آن چیزی است که جی تی متریکس در طول آزمایش صفحۀ وب/برنامه تشخیص می‌دهد. این ابزار ممکن است نکات و راهنمایی‌هایی را براساس پلتفرم شما ارائه دهد؛ مثلاً اگر از وردپرس استفاده می‌کنید، پیشنهاداتی درمورد چگونگی بهبود عملکرد نصب وردپرس، نوع افزونه‌هایی که می‌توانید استفاده کنید و موارد دیگر ارائه می‌دهد.

زبانۀ خلاصه 5۲) زبانۀ عملکرد (Performance)

این زبانه، معیارهای امتیاز عملکرد شما را با جزئیات بسیار زیاد نشان می‌دهد!

زبانۀ عملکرد 1هر معیار در زبانۀ عملکرد همراه با یک توضیح است؛ به این ترتیب شما با نگاهی سریع متوجه می‌شوید که چه معنایی دارد. علاوه‌بر‌این، معیارها برای نشان‌دادن میزان موفقیت شما در آن معیار، رنگی هستند. معنی کدهای رنگی به ترتیب زیر است:

امتیاز عملکرد 2در زیر بخش معیارهای امتیاز عملکرد، زمان‌بندی مرورگر قرار دارد که هیچ تأثیری بر امتیاز عملکرد شما ندارد، اما اطلاعات بیشتری درمورد عملکرد صفحه یا برنامۀ شما ارائه می‌دهد که قطعاً ارزش دیدن دارد.

امتیاز عملکرد 3۳) زبانۀ ساختار (Structure)

در نسخۀ جدید جی تی متریکس، زبانۀ Structure جانشین PageSpeed و YSlow از گزارش‌های Legacy شده است که شامل ممیزی‌های لایت‌هاوس مبتنی بر ساختار و بهترین روش‌ها برای عملکرد بهینۀ ‌سایت/برنامۀ وب است.

زبانۀ ساختاردر این زبانه، در قالب یک جدول، ممیزی‌هایی دربارۀ سایت شما ارائه می‌شود که نیاز به بهبود دارند و براساس میزان رعایت آن‌ها سازمان‌دهی شده‌اند. بدترین عملکرد در بالای جدول نمایش داده می‌شود. در نسخۀ جدید جی تی متریکس، میزان تأثیر اعمال هر ممیزی بر امتیاز عملکرد سایتْ محاسبه و به‌شکل زیر نشان داده می‌شود:

زبانۀ ساختار 2مجموع تأثیرات صفحۀ موردنظر شما از هر ممیزی، محاسبه شده و مطابقت داده می‌شود تا امتیاز کلی ساختار صفحه به‌ دست بیاید. با کلیک روی منوی کشویی کنار هر ممیزی، آن منو باز می‌شود و نتایجی که به تأثیر ممیزی کمک کرده‌اند، نمایش داده می‌شود.

زبانۀ ساختار 3۴) زبانۀ آبشار (Waterfall)

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

زبانۀ آبشاربرای هر درخواست، شما زمان بارگیری آن را دارید، که با نوارهای افقی نشان داده می‌شود: هرچه نوار طولانی‌تر باشد، دانلود/اجرای درخواست کندتر انجام می‌شود. مشاهدۀ آبشار به ما این امکان را می‌دهد که ابتدا ترتیب بارگذاری عناصر صفحه را درک کنیم. همچنین، در یک نگاه ببینیم که کدام عناصر بیشترین زمان بارگیری را دارند و چگونه می‌توان آن‌ها را بهینه کرد.

۵) زبانۀ ویدئو (Video)

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

با استفاده از ویژگی پخش ویدئو، بارگذاری با یک‌چهارم سرعت اصلی پخش می‌شود تا ما بتوانیم مشکلات و تأخیرهای پیش‌آمده در بارگیری محتوای خاص را درک کنیم. این ویدئو یک کمک بصری در اختیار ما قرار می‌دهد که پاسخ پرسش‌های زیر را برایمان روشن می‌کند:

  • چه مدت‌زمانی طول می‌کشد تا سایت به کاربر نمایش داده شود؟
  • آیا سایت در زمان بالا آمدن، به‌هم‌ریختگی و آشفتگی بصری دارد؟
  • آیا تمرکز طرح سایت شما روی آن نقطه‌ای است که کاربر را مجاب به استفاده و تعامل با سایت بکند؟
  • آیا تمام ویژگی‌هایی که برای سایت طراحی کرده‌اید به همان اندازه که انتظار داشته‌اید کاربردی به نظر می‌رسد؟
  • آیا سایت شما امکان یک تجربۀ کاربری لذت‌بخش را برای کاربران فراهم می‌کند؟
زبانۀ ویدئو۶) زبانۀ تاریخچه (History)

یکی از توصیه‌های مهم برای به‌دست‌آوردن بهترین نتایج در هنگام انجام تست سرعت، انجام چندین تست در زمان‌های مختلف است. جی تی متریکس امکان مشاهدۀ آمار تاریخچۀ سایت در گذر زمان را فراهم کرده است. اگر یک صفحه را دست‌کم دو بار تست کرده باشید، گزارش تاریخچۀ آن صفحه تولید و ذخیره می‌شود.

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

نمودارهای تاریخچه را می‌توان بزرگ‌نمایی و جابه‌جا کرد یا روی یک بازۀ زمانی تنظیم کرد تا پیشرفت را در یک دورۀ زمانی خاص نشان دهد و امکان تجزیه‌وتحلیل داده‌های تاریخچه را فراهم آورد. علاوه‌بر‌این، می‌توان هشدارهای ایمیلی را تنظیم کرد تا در صورت عملکرد ضعیف بخشی از سایت، به شما اطلاع داده شود.

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

زبانۀ تاریخچه

طرح‌های قیمت‌گذاری جی تی متریکس

این ابزار طرح‌های قیمت‌گذاری پایه و رایگان (Basic) را به ‌همراه طرح‌های پیشرفته (Pro) در ۳ قالب زیر ارائه می‌دهد:

  1. Individual
  2. Business
  3. Custom

طرح‌های قیمت‌گذاری جی تی متریکس 1

طرح‌های قیمت‌گذاری جی تی متریکس 2برای مشاهدۀ جزئیات ویژگی‌ها و خدمات هریک از طرح‌های قیمت‌گذاری، به سایت جی تی متریکس مراجعه کنید. توجه داشته باشید که دسترسی به نسخۀ رایگان این ابزار برای کاربران ایرانی راحت‌تر است و برای استفاده از خدمات گزینه‌های پولی، چالش‌هایی را پیش روی خود خواهید داشت.

خطاهای جی‌تی متریکس چیست؟

GTmetrix وضعیت سایت شما را در هریک از فاکتورهای مدنظر موتورهای جست‌وجو تجزیه‌وتحلیل می‌کند و گزارشی کامل به شما ارائه می‌دهد. با تفسیر بخش‌های مختلف این گزارش‌، عمل‌کردن به پیشنهادهای مطرح‌شده و رفع خطاهای جی‌تی متریکس، می‌توانید عملکرد سایت خود را بهبود بخشید.

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

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

۱) رفع خطاهای عکس در جی‌تی متریکس

خطاهای مربوط به عکس، از مهم‌ترین خطاهای جی‌تی متریکس است که تأثیر زیادی بر سرعت سایت می‌گذارد. عکس‌ها و تصاویر برای جذب مخاطب به یک سایت، از اهمیت بسیاری برخوردارند. اما آنچه نباید نادیده گرفت، بهینه‌سازی این تصاویر به‌لحاظ حجم، اندازه و سئو است. رفع خطاهای عکس در جی‌تی متریکس به شما کمک می‌کند تا سایت پرسرعت‌تری داشته باشید.

رفع خطای Image Optimize

این خطا مربوط به بهینه‌نبودن تصاویر سایت شماست و اولویت بسیار بالایی دارد. رفع خطای Image Optimize بسیار ساده است و می‌تواند با روش‌های زیر صورت بگیرد:

  • می‌توانید از تصاویر بهینه‌شدۀ GTmetrix استفاده کنید. در ادامۀ نام هر تصویر یک عبارت Optimized Version (نسخۀ بهینه‌شده) دیده می‌شود؛ یعنی خود GTmetrix نسخۀ بهینه‌شدۀ تصویر را در اختیارتان گذاشته است. کافی است روی لینک کلیک کنید و تصویر مناسب را دانلود کنید (البته نام تصویر تغییراتی کرده است و باید آن را ویرایش کنید). سپس، آدرسی را که جی‌تی متریکس برای عکس معرفی کرده دنبال ‌کنید و این عکس را به‌جای عکس قبلی آپلود ‌کنید.
  • روش دیگر، استفاده از برنامۀ فتوشاپ است. تصویر موردنظر را در این برنامه باز کنید و این‌ بار Save for Web را انتخاب ‌کنید. این نسخۀ جدید از تصویر را در همان آدرسی که GTmetrix نشان داده، جایگزین عکس قبلی کنید. گزینۀ RE-Test را در جی‌تی متریکس بزنید و با شرایط قبلی مقایسه کنید. احتمالاً با این کار خطا رفع می‌شود.
  • در‌صورتی‌که سایت شما وردپرس است، می‌توانید افزونۀ Smush را نصب کنید تا هر تصویر را قبل از بارگذاری بهینه کند.

همچنین، استفاده از ویرایشگرهای آنلاین تصویر می‌تواند در تغییر فرمت، اندازه و کاهش حجم به شما کمک ‌کند:

در نظر داشته باشید که برای رفع این خطا ‌باید علاوه ‌بر بهینه‌سازی تصاویر از نظر حجم (با حفظ بهترین کیفیت)، رزولوشن و اندازۀ تصاویر را نیز بهینه کنید. همچنین، عوامل سئوی تصویر مانند متن جایگزین، فرمت، عنوان و… را مدنظر داشته باشید. جی‌تی متریکس پیشنهاد می‌کند به‌جای استفاده از کد برای تغییر اندازۀ تصاویر، از همان ابتدا عکس را در سایز مناسب آپلود کنید.

رفع خطای Properly Size Images

خطای Properly size images همان خطای قدیمی Serve scaled images در جی‌تی متریکس است و هردو یک راه‌حل دارند. این خطا مربوط به اندازۀ تصاویر مورد استفاده در سایت است. برای رفع خطا کافی است تصویر را به یکی از روش‌‌هایی که در بخش قبل گفتیم ویرایش، و در اندازۀ درست آپلود کنید. استفاده از ابزارهای آنلاین مانند Image Resizer نیز مفید است.

رفع خطای Sprites Combine Images Using CSS

این خطا مربوط به تعداد زیاد تصاویر در هنگام لود سایت است که هریک درخواست جداگانه‌ای را به سرور می‌فرستند. این Requestهای متعدد، سبب کاهش سرعت سایت می‌شود.برای رفع این خطا می‌توانیم از ابزارهای آنلاین مانند Toptal.com کمک بگیریم. این ابزار، چندین تصویر را با روش CSS sprites با هم ترکیب می‌کند و در قالب یک تصویر (و درنتیجه یک درخواست) به سرور می‌فرستد. البته، کاربر همچنان می‌تواند هریک از آن تصاویر را به‌صورت جداگانه ببیند.

در سایت Toptal.com در قسمت Choose Files تصاویر موردنظر را انتخاب کنید، سپس فایل تصاویر ترکیب‌شده را دانلود کنید و در جایی که جی‌تی متریکس مشخص کرده قرار ‌دهید.

۲) رفع خطاهای جاوا اسکریپت در جی‌تی متریکس

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

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

رفع خطای Minify Javascripts

Minify کردن به‌معنای کوچک‌کردن یا فشرده‌کردن است. گاهی‌ سرعت سایت به ‌علت حجم زیاد کدهای Javascript کاهش می‌یابد که برای سئوی سایت بسیار مضر است. این خطا را می‌توانیم به ۲ روش رفع کنیم:

روش اول: جایگزینی کدهای قبلی با نسخۀ بهینۀ ارائه‌شده توسط جی‌تی متریکس

در انتهای آدرس مشخص‌شده توسط جی‌تی متریکس گزینۀ Optimaized Version مشاهده می‌شود. به‌راحتی می‌توانید این فایل را دانلود کنید و سپس در قسمت File Manager هاست خود، وارد Public-html شوید و فایل بهینۀ دانلودشده را در همان مسیری که جی‌تی متریکس به شما نشان داده، جایگزین و سپس ذخیره کنید.

box

فیلیمو


آشنایی با تبلیغات ویدئویی در فیلیمو
کلیک کنید

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

روش دوم: استفاده از ابزار آنلاین JSCompress

کدهای Javascript را کپی و در سایت بالا Paste کنید. گزینۀ Compress را بزنید و نسخۀ بهینه‌شده را دانلود و جایگزین کدهای موجود در سی پنل کنید.

رفع خطای Combine External JavaScript

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

رفع خطای Defer Parsing of JavaScript

بهترین راهکار برای رفع این خطا، ایجاد تعویق در لودکردن فایل‌های Javascript است. قراردادن این کدها در فوتر باعث دیرتر اجرا شدن آن‌ها و افزایش سرعت لود سایت می‌شود. راهکار دیگر، استفاده از اتربیوت‌های defer و async در برخی تگ‌هاست. این دو اتربیوت به مرورگر دستور می‌دهند که منتظر لودشدن کامل فایل‌های Javascript نماند و هم‌زمان باقی المان‌های صفحه را بارگذاری کند. درصورتی‌که سایت شما وردپرسی است، روش اول پیشنهاد می‌شود و بهتر است با استفاده از افزونه‌های وردپرس به رفع این خطا بپردازید:

  • افزونۀ autoptimize
  • افزونۀ Speed Booster Pack

رفع خطای Inline Small CSS و Inline Small JavaScript

این دو خطا بسیار شبیه هم‌ هستند و به شما می‌گویند فایل‌های کوچکی (استایل یا جاوا اسکریپت) را که در خارج از Head فراخوانی می‌شوند به داخل Head منتقل کنید.

رفع خطای Remove Duplicate JavaScript and CSS

این خطا زمانی رخ می‌دهد که فایل‌های CSS و JS به هر دلیلی از دو آدرس مختلف لود می‌شوند. برای رفع این خطا کافی است منشأ مشکل را شناسایی و یکی از فایل‌ها را حذف کنید. انجام این کار نیازمند مهارت در کدنویسی است؛ بنابراین اگر در کدنویسی مهارت ندارید، بهتر است از یک کدنویس کمک بگیرید.

رفع خطای Optimize the Order of Styles and Scripts

این خطا مربوط به چیدمان نادرست کدهای CSS و کدهای JavaScripts در کنار هم است. چینش درست این‌گونه است که ابتدا کدهای CSS در چند خط نوشته می‌شود و بعد کدهای Js در چند خط دیگر. به‌عبارتی، برای افزایش سرعت سایت باید فایل‌های استایل، قبل از فایل‌های جاوا اسکریپت خوانده شوند.

برای رفع این خطا می‌توان به‌طور دستی ترتیب گفته‌شده را اصلاح و یا از افزونۀ WP Scripts & Styles Optimizer استفاده کرد.

رفع خطای Make JavaScript and CSS external

۳ روش کلی برای استفاده از کدهای CSS و JS در یک سند Html وجود دارد: Inline ،Internal و External که هریک در شرایط گوناگون مزایا و معایب خود را دارند. این خطا به لود فایل‌های CSS و JS از منابع خارجی (External) اشاره دارد و به شما می‌گوید که تا جای ممکن این فایل‌ها را به‌طور مستقیم از هاست خودتان لود کنید و از آدرسی غیر از دامنۀ سایت خود نخوانید.

البته اگر حجم فایل خارجی (External) شما خیلی کم است، به‌منظور رعایت خطای Inline Small CSS و Inline Small JavaScript بهتر است به‌شکل Inline درج شود.

رفع خطای Avoid document.write

document.write تابعی است در JavaScript که می‌توانید با استفاده از آن، یک فایل جاوا اسکریپت خارجی را در سایت خود فراخوانی کنید.

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

رفع خطای Avoid long main-thread tasks

استفاده از فایل‌های جاوا اسکریپتی که اجرای آن‌ها زمان زیادی طول می‌کشد، باعث بروز این ارور می‌شود و رفع آن به مهارت بالای کدنویسی نیاز دارد. برای رفع این خطا باید فایل‌های JavaScript و CSS را که باعث بروز این مشکل می‌شوند شناسایی و بهینه‌سازی کنید.

رفع خطای Reduce JavaScript execution time

هرچقدر فایل‌های JavaScript حجم بیشتری داشته باشند، لودشدن صفحه با سرعت پایین‌تری انجام می‌شود. به‌طور کلی، برای رفع این ارور باید کدها را Minify کنید. انجام اقدامات زیر نیز می‌تواند به شما کمک کند:

  • حذف کدهای بی‌استفاده؛
  • به‌تعویق‌انداختن کدهای غیرضروری در لود اولیۀ صفحه؛
  • کاهش حجم فایل‌های جاوا اسکریپت؛
  • بهینه‌کردن کدهای JavaScript.

رفع خطای Remove duplicate modules in JavaScript bundles

این خطا زمانی رخ می‌دهد که یک‌سری کدهای تکراری JavaScript در سایت ما وجود داشته باشد. برای برطرف‌کردن این خطا، به‌ویژه در سایت‌هایی که به‌طور اختصاصی کدنویسی شده‌اند، ‌باید از یک متخصص برنامه‌نویسی کمک بگیرید.

۳) رفع خطاهای CSS در جی‌تی متریکس

زبان CSS که مخفف Cascading Style Sheets است، زبانی است که نحوۀ نمایش عناصر HTML را در صفحۀ وب مشخص می‌کند. درواقع، ما به کمک HTML ساختمان و اسکلت سایت را بنا می‌کنیم و سپس به کمک کدهای CSS ظاهر و نمای سایت را طراحی می‌کنیم.

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

رفع خطای Minify Css

همانند ارور Minify Javascripts باید حجم کدهای CSS را کم کنید. خود سایت GTmetrix کدهای بهینه را در بخش Optimized Version در اختیار شما می‌گذارد که می‌توانید آن‌ها را جایگزین کدهای قبلی درون هاست کنید. روش دیگر، استفاده از ابزار آنلاین Clean CSS است. کدهای CSS را کپی و در سایت فوق Paste ‌کنید. گزینۀ Compress را بزنید، نسخۀ بهینه‌شده را دانلود و جایگزین کدهای موجود در سی پنل کنید.

رفع خطای Avoid CSS @import

این خطا نشان می‌دهد که متد import@ یک فایل CSS را درون فایل CSS دیگر فراخوانی می‌کند و جی‌تی متریکس اعلام می‌کند که باید از این وضعیت اجتناب کنید. import@های متعدد برای بارگذاری فایل‌های CSS به‌صورت تو در تو به این شکل است که برنامه‌نویس‌ها یک فایل را به‌عنوان فایل اصلی CSS انتخاب می‌کنند و باقی فایل‌های CSS را درون این فایل اصلی بارگذاری می‌کنند. این کار باعث کندشدن سرعت سایت می‌شود.

برای برطرف‌کردن این خطا، بهتر است فایل‌هایCSS را جداگانه و به‌صورت تگ لینک در قسمت هدر سایت تعریف کنید.

رفع خطای Combine External CSS

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

در حالت کلی، طبق استانداردهای گوگل بهتر است از ۲ و حداکثر ۳ فایل برای CSS سایت خود استفاده کنید.

رفع خطای Put CSS in the Document Head

این خطا زمانی نمایش داده می‌شود که CSS از بخشی خارج از Head فراخوانی شود؛ یعنی کدهای مربوط به استایل به هر دلیلی در جایی خارج از تگ Head قرار گرفته‌اند. برای رفع این خطا کافی است آن بخشی از CSS را که جی‌تی متریکس مشخص کرده، به داخل تگ Head ببریم.

رفع خطای Remove Unused CSS

این خطا برای سایت‌های وردپرسی زیاد اتفاق می‌افتد؛ زیرا قالب‌های آمادۀ وردپرس به ‌دلیل وجود امکانات زیاد، دارای فایل‌های CSS سنگینی هستند که معمولاً کاربردی ندارند. برای اینکه بفهمید کدام فایل‌های‌ CSS سایت شما بدون استفاده‌اند به سایت UnusedCSS مراجعه کنید. سپس، با حذف آن کدها، فایل نهایی را جایگزین فایل قبلی کنید.

اگر از وردپرس استفاده می‌کنید می‌توانید با نصب افزونۀ Autoptimize، خطای Remove Unused CSS را رفع کنید. با توجه به اینکه رفع این ارور پیچیده است، توصیه می‌کنیم که از یک متخصص کدنویسی کمک بگیرید.

۴) رفع خطاهای Structure

در نسخۀ جدید جی‌تی متریکس، نمرات Performance و Structure جایگزین نمرات قدیمی PageSpeed و YSlow شده‌ است.در بخش Structure، جی‌تی متریکس براساس معیارها و مقادیر مشخصی، عملکرد سایت شما را از نظر ساختار ارزیابی می‌کند. امتیازهای پایین جدول، خطاهای Structure است که می‌بایست اصلاح شوند.

رفع خطای Avoid enormous network payloads

این خطا مربوط به حجم بالای منابع مورد استفاده (تصاویر، ویدئوها، فایل‌های CSS و JavaScript و…) به‌ هنگام لود‌شدن صفحه است. برای رفع این خطا ‌باید ابتدا گزارش GTmetrix را به‌ دقت بررسی کنیم تا متوجه شویم چه منابعی حجم بالایی دارند و بعد برای هریک روشی متناسب با آن‌ را به‌ کار ببریم.

رفع خطای Avoid long main-thread tasks

این خطا زمانی رخ می‌دهد که برای مرورگر وظایف (Tasks) طولانی تعریف شده باشد. استفاده از فایل‌های CSS یا جاوا اسکریپتی که اجرای آن‌ها زمان زیادی طول بکشد، باعث درگیرشدن طولانی‌مدت main thread و بروز این خطا می‌شود. برای رفع این خطا باید فایل‌های JavaScript و CSS مشکل‌دار را شناسایی و بهینه‌سازی کرد. رفع این خطا نیازمند مهارت بالای برنامه‌نویسی است. 

رفع خطای Keep request counts low and transfer sizes small

این خطا نشان می‌دهد که میزان درخواست‌های مرورگر از سرور برای بارگذاری عکس‌ها، فایل‌های CSS، جاوا اسکریپت و… زیاد است و‌ باید کاهش پیدا کند. این ارور مربوط به چندین ارور (مواردی همچون بهینه‌سازی تصاویر، کدهای CSS، Js و…) است و برای رفع آن باید برخی خطاهای دیگر که در این مطلب به آن‌ها اشاره شد، رفع شود.

رفع خطای Combine Images Using CSS Sprites، رفع خطای Inline Small CSS and JavaScript و رفع خطای Defer Parsing of JavaScript از آن جمله است.

رفع خطای Use a Content Delivery Network (CDN)

این پیغام در جی‌تی متریکس بیانگر آن است که برای افزایش سرعت سایت از CDN (شبکۀ توزیع محتوا) استفاده کنید. CDN باعث می‌شود درخواست‌های مرورگر به سرورهای متعدد منتقل گردد و درنتیجه پاسخ‌های سریع‌تری دریافت شود.اگر GTmetrix از شما بخواهد که برای برخی فایل‌های خاص از CDN استفاده کنید، منظورش استفاده از شبکه‌های توزیع محتوای عمومی مانند کتابخانه‌های عمومی CDN JQuery ،CDN Microsoft ،CDN Google و… است که انواع فایل‌های JS، CSS، فونت‌ها و… را به‌طور عمومی ارائه می‌دهند.

اما اگر GTmetrix استفاده از CDN برای کل سایت را پیشنهاد دهد، به این معناست که باید از شبکۀ CDN شرکت‌هایی مانند کلودفلر (ClouadFlare)، MaxCDN و… استفاده کنید که در این حالت کل سایت روی سرورهای CDN قرار خواهد گرفت.

رفع خطای Avoid bad requests

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

دلایل مختلفی برای خطای Avoid bad requests وجود دارد. خطای ۴۰۴، خطای ۵۰۰ یا فراخوانی فایل از سایت‌های دیگر که حالا به هر دلیلی آن فایل‌ها یا سایت‌ها در دسترس نیستند، از آن جمله است. برای رفع این خطا باید ابتدا منبع آن را پیدا کنید. سپس آن خط کدی را که در حال فراخوانی فایل ناموجود است حذف کنید یا برای آن فایل جایگزین مناسبی لحاظ کنید. گاهی نیز با پاک‌کردن کش (بعد از حذف یک تصویر یا تغییر فونت) مشکل حل می‌شود.

۵) رفع خطاهای ریدایرکت

ریدایرکت چیست؟ ریدایرکت روشی است که یک مرورگر وب به کمک آن، کاربر را از یک آدرس به آدرس دیگر هدایت می‌کند، بدون آنکه لازم باشد کاربر روی لینکی کلیک کند یا آدرس ورودی خاصی را وارد کند. از متداول‌ترین انواع ریدایرکت، ۳۰۱ و ۳۰۲ است که هریک هدف خاصی را دنبال می‌کنند. تعداد ریدایرکت‌ها هرچقدر کمتر یا حتی صفر باشد، سایت شما سرعت بیشتری خواهد داشت.

خطاهای Avoid Landing Page Redirects و Minimize Redirects و Avoid URL Redirects هر ۳ به یک موضوع اشاره می‌کنند. Minimize Redirects (به‌حداقل‌رساندن تغییر مسیرها) و Avoid URL Redirects (اجتناب از آدرس ریدایرکت‌شده) به تمام صفحات در سایت اشاره دارند و خطای Avoid Landing Page Redirects مربوط به جلوگیری از ریدایرکت صفحات فرود است.

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

۶) رفع خطای Largest Contentful Paint (LCP)

LCP مدت‌زمانی است که طول می‌کشد تا بزرگ‌ترین محتوای سایت از نظر حجمی (مثلاً اسلایدر سایت)، به‌طور کامل لود شود و برای بازدیدکنندگان قابل رؤیت باشد. LCP یکی از معیارهایی است که بیشترین تأثیر را روی Performance سایت دارد. این خطا یکی از مهم‌ترین خطاهای جی‌تی متریکس است.

این زمان هرچه پایین‌تر باشد، بهتر است و تجربۀ کاربری مطلوب‌تری را برای مخاطب فراهم می‌کند. برای داشتن یک تجربۀ کاربری عالی، LCP باید کوچک‌تر یا مساوی ۱.۲ ثانیه باشد. برای کاهش زمان LCP باید بزرگ‌ترین محتوای موجود در نیمۀ بالایی صفحه‌ را شناسایی و آن را بهینه‌سازی کنیم. بزرگ‌ترین محتوا را می‌توانید در سربرگ Structure و قسمت Largest Contentful Paint Element ببینید. تگ‌های img، video و… می‌توانند بزرگ‌ترین محتوای صفحه محسوب شوند.

یکی از موارد بهینه‌سازی این بخش، ترکیب عکس‌ها با متد CSS Sprites، بهینه‌سازی و فشرده‌سازی عکس‌ها، استفاده از فرمت‌های جدید برای تصاویر مانند Jpg XR و فرمت ویدئویی مناسب به‌جای GIF است.

۷) رفع خطای Cumulative Layout Shift (CLS)

امتیاز CLS میزان تغییرات لی‌اوت هنگام بارگذاری سایت را نشان می‌دهد؛ به این معنا که کاربر هنگام بارگیری سایت شما با چه میزان تغییر غیرمنتظره در چیدمان عناصر صفحه مواجه می‌شود. بعضی مواقع در هنگام بارگذاری سایت، المان‌های صفحه جابه‌جا می‌شوند. این عناصر می‌توانند تصاویر، فونت‌ها، دکمه‌های تماس و… باشند. امتیاز CLS هرچه پایین‌تر باشد بهتر است؛ تا ۰.۱ خوب محسوب می‌شود و تا ۰.۱۵ قابل قبول است.

برای بهبود این امتیاز، ابعاد عکس‌ها و ویدئوها را مشخص کنید، مواردی که باعث شیفت در صفحه می‌شوند مثل تبلیغات یا آی‌فریم‌ها را به انتهای صفحه منتقل کنید، توجه ویژه به سرعت لود انیمیشن‌ها داشته باشید، فونت سایت در انتها لود شود و… .

۸) رفع خطای (SI) Speed Index

شاخص SI نشان می‌دهد که بخش بالایی سایت یا همان above the fold چقدر سریع لود می‌شود. منظور، بخشی از سایت است که بدون اسکرول‌کردن در همان وهلۀ اول بارگذاری می‌شود و توسط کاربر قابل مشاهده است. این معیار، ۱۵% از امتیاز عملکرد (Performance) را به خود اختصاص می‌دهد و مقدار آن باید کمتر از ۱.۳ ثانیه یا حداکثر ۱.۷ ثانیه باشد.

برای بهبود SI، می‌توان زمان اجرای فایل‌های JavaScript را کاهش داد، فایل‌های JS بدون استفاده را حذف کرد و کتابخانه‌های JS را بهینه‌سازی کرد. ضمن اینکه بیشتر بهینه‌سازی‌هایی که روی LCP انجام می‌شود، باعث بهبود Speed Index نیز می‌شود.

نتیجه

اگر به دنبال ابزاری هستید که بتواند تجزیه‌وتحلیل جامعی از عملکرد سایت شما ارائه دهد، مقاله آموزش جی تی متریکس خوراک شماست. این ابزار، ارزیابی عمیقی از نحوۀ عملکرد سایت شما انجام می‌دهد و لیست بلندبالایی از توصیه‌ها را درمورد چگونگی بهبود آن ارائه می‌دهد. با ابزار GT Metrix می‌توانید عملکرد سایت خود را ببینید، دلیل کندبودن آن را بیابید و فرصت‌های بهینه‌سازی را کشف کنید.

ابزارهای نظارتی به جی تی متریکس این امکان را می‌دهند که بخشی ضروری از استراتژی عملکرد آنلاین شما باشد. پس، هرچه سریع‌‌تر برای استفاده از آن اقدام کنید.

۵/۵ | (۹ امتیاز) امتیازت با موفقیت ثبت شد!
مطالب پیشنهادی ما:

نظر شما چیست؟

آدرس ایمیل شما منتشر نخواهد شد.