GTmetrix

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

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

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

یک توصیه بسیار مهم

GTmetrix با استفاده از گوگل PageSpeed و یاهو YSlow، دو ابزار عمده تجزیه و تحلیل سرعت، به عملکرد سایت شما و ارائه توصیه های عملی برای رفع این مسائل بصورت حرفه ای میپردازد و حتی می توانید با این ابزار مچ افرادی را که شمارا تیغ می زنند و روی سایت شما کار نمی کنند را به راحتی بگیرد .

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

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

در این سایت از PageSpeed ​​و YSlow بعنوان نیمی از نبرد برای زشد سایت و بالا رفتن میزان بازدید یاد شده که متاسفانه اکثر افرادی که در زمینه وب و توسعه دهنده و به اصلاح سئو کار هستند از این مسائل بویی نبرده اند

بهینه سازی حرفه ای سایتی برای بهینه سازی واقعا حرفه ای
نمرات PageSpeed ​​و YSlow به شما دقیقا  می گوید که چگونه و چطور باید برای زمان بارگذاری و محدوده های زمانی بارگذاری و سایر عوامل تعیین کننده در سایت شما که احیانا بسیار ضعیف است و….
راهنمای شروع به کار

به GTmetrix خوش آمدید!

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

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

در این جا ما پنج بخش را برای شما آورده ایم که در هر قسمت بخشی از GTmetrix را برایتان تشریح می نماییم:

بخش اول: summaey و Breakdown

GTmetrix  چه می باشد؟

یک سایت آنالیزگر حرفه ای می باشد که سایت ها را از لحاظ شکل و سرعت بارگذاری آنالیز می نماید.  GTmetrix سایت ها را با معیار های مفید و کاملی پارامترهای اصلی که بر سرعت بارگذاری  موثر می باشند را بررسی می نماید.

بعد از ورود به سایت در بخش “Analyze Performance of” آدرس سایت مورد نظر را در این بخش وارد نمایید و بعد از آن بر روی دکمه “Go” بزنید تا آنالیز آغاز گردد. پس از چند دقیقه صفحه ای به صورت زیر باز می گردد و نتایج را نمایش خواهد داد.

صفحه تازه باز شده شامل دو قسمت می باشد: Breakdown و Summary.

۱٫Summary:

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

Page Speed Grade: درصد آماری میزان بهینگی را در بخش Breakdown را نشان خواهد داد.

YSlow Grade: در این بخش نیز مثل بخش قبل درصدی آماری نمایش خواهد داد با این فرق که استاندارد های یاهو را مد نظر دارد.

Page load time:  مدت زمان بارگذاری سایت را بر طبق ثانیه نشان خواهد داد.

Total page size: حجم صفحه بارگذاری شده را نشان خواهد داد.

Total number of requests: تعداد درخواست هایی که به سرور جهت بارگذاری عناصر متفاوت سایت فرستاده گشته را نشان خواهد داد.

نکته: هرچه قدر که رقم این تعداد پایین تر گردد سرعت سایت بالاتر می رود.

۲٫Breakdown :

از چهار بخش زیر متشکل گردیده است.

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

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

Timeline: در این بخش بررسی هایی که بر روی سایت صورت گرفته را مقایسه و به صورت یک نمودا ر نشان خواهد داد.

History: در این بخش نمودار هایی موحود می باشد که زمان بارگذاری هر بخش را نشان خواهد داد.

بخش دوم: زیر شاخه هایPage Speed چیست؟

 Specify image dimensions: با پاک کردن احتیاجات غیر ضروری به reflows و repaintsعرض و ارتفاع  تصاویر را طوری مشخص می نماید تا رندر سریعتر عمل نماید.

Defer parsing of JavaScript: مرورگر می بایست همه ی محتویات <اسکریپت> تگ ها را تچزیه نماید که این بر زمان باراگذاری صفحه اضافه می کند. با به حداقل رساندن مقدار کد جاوا اسکریپت جهت رندر صفحه و به تاخیر انداختن تجزیه جاوا اسکریپت های غیر ضروری تا زمانی که احتیاجی به اجرا آن ها نمی باشد، قادرند زمان بارگذاری اولیه صفحه را کم نمود.

Optimize images:

کم شدن زمان بارگزاری صفحه با بارگذاری عکس هایی که اندازه مناسب را دارا می باشند.

1. کم شدن اندازه فایل عکس بر طبق مکان و جایی که عکس ها درآن نشان داده می شوند.
2. عوض نمودن اندازه فایل های تصویری themeselves بوسیله CSS.
3. طبق نوع کاربر تصاویر در فرمت مناسب ذخیره گردند.

Serve scaled images:  قادر است بسیاری از بایت داده ی تصاویر را به طور صحیح ذخیره نماید.

Remove query strings from static resources:

بسیاری از پروکسی ها حتی مهمترین آن ها که Squid نسخه ۳، منابعی که علامت “؟” در URL آن ها موجود می باشد ا کش نمی نمایند حتی اگر دستور Cash-Control تعریف گردد. جهت راه اندازی کش پروکسی برای این منابع query string ها را در منابع استاتیک حذف نمایید و در عوض آن ها پارامترها را با نام فایل آنها رمزگذاری نمایید.

Serve resources from a consistent URL:

جهت جلوگیری از دانلود بایت تکراری و RTTs اضافی می بایست برای منایع از یک URL جداگانه استفاده نمایید.

Specify a Vary : Accept-Encoding header:

بعضی از اشکالات در پروکسی های عمومی به این علت می باشد که پروکسی  ها محتویات  سایت را فشرده می نمایند و به مرورگر کاربر که از نسخه ی فشرده شده پشتیبانی نمی نماید ارسال می نماید. تعریف  Vary: Accept Encoding سبب می گردد که پروگسی هر دو نسخه فشرده و غیر فشرده را ذخیره و پشتیبانی کند.

Enable gzip compression:

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

Leverage browser caching:

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

Minify HTML:

فشرده سازی کد های HTML از جمله کد های جاوا اسکریپت و CSS موجود در آن سبب صرفه جویی در فرستادن داده به شبکه و بالا رفتن سرعت بارگذاری صفحات سایت می گردد.

Minify JavaScript:

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

Avoid bad requests:

پاک نمودن لینک های شکسته و یا در خواست هایی که باعث بروز خطای ۴۰۴/۴۱۰ می گردند. بعلاوه از تولید درخواست های بیهوده خوداری  نمایید.

Avoid a character set in the meta tag:

استفاده از character set در یک meta tag سبب توقف دانلود داده در مرورگر IE8 می گردد. جهت بهتر نمودن دانلود موازی منابع خوب می باشد از character set به بخش HTTP در  Response Header انتقال یابد

Avoid landing page redirects:

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

Enabele keep-Alive:

با فعال سازی HTTP Keep-Alive ویا Connections   HTTP Peresistentبه TCP اجازه متصل شدن جهت فرستادن و گرفتن اطلاعات داده می شود تا درخواست های متعددHTTP را صورت بخشد و در نتیجه سبب کم شدن تاخیر اجرای درخواست های بعدی می گردد.

Inline small CSS:

استفاده ننمودن از CSS داخلی و ذخیره سازی همه ی کدهای CSS در یک فایل style.

Inline small JavaScript:

ذخیره سازی فایل های کوچک جاوا اسکریپت در یک فایل.

Minify CSS:

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

Minimize redirects:

به حداقل رساندن تغییر مسیر HTTP  از یک آدرس به آدرس دیگری سبب کم شدن RTTs اضافی و زمان انتظار می گردد.

Minimize request size:

کوچک نگهداشتن کوکی ها و در خواست ها تا حد امکان سبب می گردد یک درخواست HTTP را بتوان در یک بسته اطلاعاتی فرستاد.

Optimize the order of styles and scripts:

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

Put CSS inthe socument head:

منتقل نمودن بلوک CSS داخلی و اجزای <link> از بخش body  به بخش head چرا که سبب بالا رفتن سرعت عمل سایت می گردد.

Specify a cach validator: تمامی منابع می بایست آخرین اصلاح یا  Etag هدر را دارا گردند. این کار به مرورگرها اجازه خواهد داد که از مزیت های کامل کش استفاده نمایند.

Specify a character set early:

تنظیم مجموعه کاراکتر در سطح سرور پردازش مرورگر را کم می نماید.

Avoid CSS @import:

استفاده از دستور  CSS@import در یک style sheet بیرونی قادر می باشد تاخیرهای اضافی در حین بارگذاری صفحات سایت ایجاد نماید.

Combine image using CSS sprites:

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

Prefer asynchronous resources:

جذب منابع asynchronously  مانع از مسدود نمودن بارگذاری صفحه می گردد.

بخش سوم: زیر شاخه های YSlow چیست؟

Compress components with gzip:

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

Make fewer HTTp requests:

کم شدن در خواست های HTTP با تلفیق کردن فایل ها و بلوک بندی و CSS امکان پذیر می باشد.

(Use a Content Delivery Network (CDN:

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

Add Expires headers:

برای کنترل چگونگی کش سایت می توان  از Expire header در مرورگر کاربران استفاده نمود.

Reduce the number of DOM elements:

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

Minify JavaScript and CSS:

غیر فعال نمودن کاراکتر های غیر ضروری در جاوا اسکریپت و CSS جهت بالا بردن سرعت بارگذاری.

Use cookie-free domains:

اندازه کوکی ها را تا حد ممکن کوچک نگه دارید تا سبب کوچک شدن اندازه سرآیند گردد.

: Reduce lookups  DNS

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

Avoid URL redirects:

از تغییر مسیر URL جلوگیری نمایید به این علت که سبب افزودن یک تاخیر به لود یک صفحه می گردد.

Avoid empty src or href:

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

Make AJAX cacheable:

با فعال سازی قابلیت cache درخواست های AJAX می توان از تاخیر در بارگذاری سایت ممانعت نمود.

Put CSS at the top:

گذاشتن و نگهداشتن style sheetها در سر صفحه جهت اطمینان خاطر از روند رندر شدن.

Remove duplicate JavaScript and CSS:

فایل های تکراری  جاوا اسکریپت وCSS  با بوجود آوردن در خواست های غیر ضروری از HTTP سبب بروز اختلال در عملکرد اینترنت اکسپلورر (IE) و اجرای بیهوده جاوا اسکریپت در  Firefox و IE می گردد.

Put JavaScript at bottom:

جهت آنکه به سایر اجزا کد اسکریپت اثر مخرب نگذارد آن را به آخر کد منتقل نمایید.

Avoid AlphaImageLoader filter:

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

Avoid HTTP 404 (NOT Found) error:

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

Do not scale image in HTML:

مقیاس نمودن تصاویر در HTML سبب بوجود آمدن اشکال در بارگذاری تصاویر برزگ و بوجود آمدن پهنای باند غیر ضروری می گردد.

Use GET for AJAX requests:

استفاده ازGET  جهت درخواست های AJAX به جای POST برای تطبیق دادن هدر و داده.

Avoid CSS expressions:

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

Reduce cookie size:

با کوچک نمودن اندازه هدر HTTP تا آنجایی که امکان دارد کوکی ها را کوچک نگهدارید.

Make favicon small and cacheable:

بوجود آوردن favicon  کوچک و پیکربندی آن به صورتی که قابلیت کش شدن را دارا گردد.

Configure entity tags-Etags:

جهت جلوگیری از نشان دادن خطای ۳۰۴ چندین سرور را با استفاده از تنظیمات Etag راه اندازی نمایید.

Make JavaScript and CSS external:

بوجود آوردن جاوا اسکریپت وCSS  خارجی به جهت بهره برداری از کش مرورگر.

بخش چهارم:Timeline چیست؟

در Timeline شما قادر می باشید نموداری از بررسی های انجام شده بر روی سایت و مقایسه آنها را به صورت یک نمودار ببینید.

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

با کلیک بر علامت + شما می توانید جزئیات بیشتری را ببینید.

بخش پنجم: History چیست؟

در بخش History نمودار هایی موجود می باشد که زمان بارگذاری هر بخش را نشان خواهد داد.

در نمودار اول (page load time)سرعت بارگذاری را  در بازه زمانی دلخواه قادر می باشید ببینید.

در نمودار دوم (Page sizes and request counts) اندازه صفحه و تعداد درخواست را در بازه زمانی دخلواه می بینید.

در نمودار سوم (Page Speed and YSlow Scores) نموداری بر اساس درصدPageSpeed  و رتبه های Yslow در بازه زمانی دلخواه موجود می باشد.

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

مازیارمیرمشاوروتحلیلگر