اول از همه برای شروع سایت زیر را باز کنید: http://gtmetrix.com بعد از ورود با سایت آدس سایت خود را مانند مانند نمونه وارد کنید و دکمه Go را بزنید. حالا منتظر بمونید سایتتون داره آنالیز میشه!حاا صفحه ی اطلاعات بهینه سازی باز شد! در قسمت Summary دو قسمت هست: 1-Page Speed Grade 2-YSlow Grade مهمترین این دوتا گزینه بالا گزینه ی 1 هست! در جلوی این دو گزینه 3 تا گزینه ی دیگه هم هست! Page load time: نشاندهنده زمان لود صفحه اصلی وب شماست که ممکن است بر اساس سرور های جی تی متریکس هر بار یک زمان را نشان دهد پس زیاد اهمیتی ندارد! Total page size: که نشاندهنده حجم صفحه اول شماست که بسیار مهم بوده و با انجام فرآیندهای بهینه سازی سایت باید حجم را کاهش دهید! Total number of requests: نشاندهنده تعداد درخواست های انجام شده برای بالا آمدن صفحه اصلی سایت شماست! این سایت حدود 30 بخش برای بهینه سازی گفته که باید نک تک برسی کنید و مشکلاتشونو برطرف کنید!(30 بخش در page speed) فعلا میریم سر قسمت اول مثل این تصویر [TABLE="class: ncode_imageresizer_warning, width: 700"] [TR] [TD="class: td1, width: 20"][/TD] [/TR] [/TABLE] خوب یکی یکی از قسمت ها را که پشت سر هم دیگه هست معرفی میکنم و میگم که هرکردوم چیه به چه درد میخوره! RECOMMENDATION: 1-Combine images using CSS sprites: در این بخش از شما خواسته میشه تا عکس های موجود در فایل های css را را با یکدیگر میکس و مخلوط کنید و به جای چند عکس از یک لینک عکس استفاده کنید! این بخش یکی از سخت ترین بخش ها و وقت گیر ترین بخش های بهینه سازی سایته که برای برطرف کردن این خطا شما نیاز به فتوشاپ و همچنین مهارت در کدنویسی css دارید اما میتوانید از سایت زیر برای اینکار کمک بگیرید که عکس ها را به طور اتوماتیک یکی کرده و تغییرات لازم در فایل های css را نیز به شما نشان میدهد.(البته دیگه من نتونستم با این سایت کار کنم ببینم شما میتونید یا نه ) http://spriteme.org 2-Specify image dimensions: در این بخش از شما میخواهد که برای تمامی عکس های سایتتون طول و عرض تعریف کنید. 3-Leverage browser caching: این یکی برای کسانی هست که سایت دارند به درد شما نمیخوره 4-Enable Keep-Alive: اینم بدردتون نمیخوره 5-Optimize images:در این بخش نیز gtmetrix از شما میخواهد تا عکس های بهینه شده توسط این سایت را جایگزین لینک عکس های خود بکنید برای این کار نیز در جلوی لینک هر عکس بر روی گزینه optimized version کلیک کرده و سپس عکس داده شده توسط gtmetrix را بر روی سیستم خود ذخیره کنید و سپس با همان نام و همان پسوند عکس اصلی در همان آدرسی که عکس اصلی شما قرار داشت آپلود کنید! 6-Minify CSS: در این بخش باید با استفاده از optimized version که در این قسمت هست یک css را دریافت کنید که این css همان css سایت خودتونه ولی بهینه شده البته از css فعلی سایت خودتون قبل از این کار یک پشتیبان بگیرید یعنی css فعلی را داشته باشید! 7-Minify HTML: این قسمت از شما میخواهد که فایل html که داده را با قالب خودتون جایگزین کنید اینو بگم که این کارو اصلا نکنید چون بدبخت میشید و این قسمت هم رها کنید! 8-Avoid bad requests: این قسمت هم از شما میخواهد که فایل هایی که در قالب هستند و آپلود نشدند یا ارور not found میدهند را حذف کنید مثلا آدرس یک عکس داخل سایته و آپلود نشده یا خراب شده! 9-Avoid a character set in the meta tag: این قسمت هم معمولا از همه 100 هست! 10-Avoid landing page redirects: این هم معمولا 100 هست! 11-Defer parsing of JavaScript: این قسمت هم میخواهد از شما که کد های جاوا اسکریپت قالب خودتونو تجزیه و کوچک نکنید! 12-Enable gzip compression: این هم بدرد شما نمیخره برای سایته 13-Inline small CSS: این بخش از شما میخواهد که css هایی که کوچک هستند را از داخل فایل css در بیارید و به صورت مستقیم در سایت نشون بدید برای این کار css را بین کد زیر قرار بدید و در head فالب در کنار فایل css قرار دهید! کد: <styleکد شما</style> 14-Inline small JavaScript: این قسمت میگوید که یک فایل جاوا اسکریپت (js) در قالبتون وجود داره که کوچک هست!برای این کار کد جاوا اسکریپت کوچک را با استفاده از کد زیر در head به صورت مستقیم نشان دهید: کد: <script>کد شما</script> 15-Minify JavaScript: این بخش از شما میخواهد که فایل js داده شده را با فایل js سایت خودتون عوض کنید!به نظر من این کارا نکنید بهتره!ببعضو وقتا هم خیلی خوب میشه!فایل js فعلی قالبتونو نگه دارید اگه میخواید js را عوض کنید! 16-Minimize redirects: این بخش میگه که اگر قسمتی از سایتتون وجود داره که ریدایرکت میشه را حذف کنید یعنی جایی نباشه که انتقال بده سایتو به جایی دیگه! (redirect) 17-Minimize request size: این قسمت هم معمولا 100 درصد هست! 18-Optimize the order of styles and scripts: این بخش از شما یخواهد که استایل ها و جاوا اسکریپت ها را بهینه و کوتاه کنید! 19-Put CSS in the document head: این بخش از شما میخواهد که استایل ها و جاوا اسکریپت ها را در بخش head قرار دهید! 20-Remove query strings from static resources: این بخش هم حذف منابع و کپی هاست! 21-Serve resources from a consistent URL: این بخش هم میگه لینک های سایت و لینک های خروجی باید سالم باشند! 22-Serve scaled images: این بخش از شما میخواهد که عکس هایی که طول و عرضان را معلوم کردید طول و عرض را اندازه عکس واقعی کنید یا عکس واقعی را اندازه طول و عرض کدتون کنید!مثلا شما عکس دارید با اندازه 250*150 و اندازه طول و عرض را با کد معلوم کردید که 350*50! این دو باید یکی باشند سایز کد و عکس شما! 23-Specify a cache validator: اینم بیخیال شید 24-Specify a Vary: Accept-Encoding header: این بخش از شما میخواهد که هدر سایتتون را رمز گذاری کنید!(در css قرار دهید یا رمز گذاری کنید!) 25-Specify a character set early: اینم بیخیال شید 26-Avoid CSS @import: این قسمت هم منظورش css های مشکل دار هست فکر کنم!(این قسمتو مشکل داشتم ولی خودش 100 بود ) 27-Prefer asynchronous resources: این قسمت هم مربوط به js هست که اگر بهینه نباشد درصدش کم میشود! پایان!
