آموزش بهینه سازی سایت به روشی ساده
بیاید
GTmetrix | Website Speed and Performance Optimization
آدرس سایتتون ر وبدین
بعد در قسمت اول سرعت لود سایت رو نشونتون میده و زیرش ایراد هارو میگه بهتون
مثلا در مورد سایت دانلود من
این شکلیه
Latest Performance Report for: http://www.downloadpersian.com/ | GTmetrix
حالا کافیه
مثلا برید
Optimize images
تمام تصاویری که حجمشون بالاست رو با تصاویر اصلاح شدشو گذاشته میتونید جایگزین کنید درون هاست خودتون
و بعد قسمت های دیگه هم داره واسه کم حجم کردن فایل های css و ...
و بعد قسمتی دیگر برای اینکه چک کنید آیا اروری داره یا نه
ملا چیز خوبیه
خیلی ها با همین سایت سئو میکنند
اولین کاری که میتونید انجام بدید و نتیجه خوبی رو معمولا بگیرید
رفتن به تب timel line هستش
دوستان توجه داشته باشن که نمیشه صد تا عکس از هر بخش گذاشتش و خودتون هم باید پیگیری بکنید
و فقط مهم ها و سر فصل ها گفته میشه و اگه کمی تلاش کنید به موارد بسیاری میرسید
این قسمت که اموزش داده میشه یکی از مهمتری بخش ها هستش که تاثیر عملی اون واقعا زیاد هستش
به این عکس ها توجه بفرمائید و مقدار زمان لود سایت رو هم ببینید
در مرحله بعد به خاطر راحتی در مایش صفحه به مانند شکل زیر عمل کنید
این بخش مهمترین بخش هستش که معمولا اکثریت سایت ها مورد دارند
برای دیدن بهتر عکس روش کلیک کنید
این صفحه را با دقت فروان نگاه کنید
تعداد ری***ت های سایت شما در اینجا قرار داره
موارد قرمز یعنی این آدرس اصلا وجود نداره و فقط داره جلوی لود سایت شما رو میگیره
در این صفحه مثلا نمونه ای از این آدرس میبینید که برای تبلیغات گذاشته شده و لود صفحه رو واقعا گرفته و برای خودم با سرعت 512 چند ثانیه طول کشید تا باز بشه
http://ashiyane.org/banner/navid.gif
البته ممکنه بعضی مواقع هم سریع باز بشه و به سرعت سایت و داون های سایت های مختلف بستگی داره
پس گام اول شناسایی عکس ها و کد های رنگ قرمز و بهینه کردنشون
اگه در این صفحه به جز خط اول آدرس صفحه اول سایت خودتون یا جای دیگه بودش بدونید که داره ریدایرکت میشه
یعنی مثلا وقتی سایت شما داره باز میشه انگار که سایت خود شما یا دیگری توش داره چند بار باز یشه و بازدید کننده بیچاره اندازه باز شدن چند سایت و صفحه باید تحمل کنه
به خاطر همین عرض کردم که فعلا کد 404 رو از سایت خودتون بردارید
در اینجا قرار دادن کد های تبلیغاتی و خصوصا جاوا از سایت های دیگه خیلی تاثیر داره
باز هم عرض میکنم که با دقت فراوان کل این صفحه رو ببینید و آدرس ها رو چک کنید
ممکنه ادرس های باشه که خودتون هم خبر ندارید و بعضا تو قالب هم نباشه اما تو فلان فایل جاوا هستش و از اونجا فراخوانی میشه اما باز نمیشه و لود سایت شما رو میگیره
در این مرحله انشاءالله موفق باشید
---------- Post added at 01:22 AM ---------- Previous post was at 01:20 AM ----------
در اموزش بعدی به بهینه سازی اولیه عکس های سایت میپردازیم
با توجه به عکس پیش میرید و تقریبا برای همه سایت ها این وضعیت کم یا زیاد هستش
با کلیک کردن رو گزینه optimize images مواردی رو به این شکل برای شما نشان میده که بستگی به تعداد عکس و مشکلاتش هستش
در فلش شماره دوم آدرس عکس فعلی که رو سایت شما هستش رو نشون میده و در فلش شماره سه عکس بهینه شده رو به شما میده
مثلا الان برای سایت میلاد جان اولین عکس رو میتونید ببینید و بهینه شده اش رو
حجم عکس فعلی حدود 60 کیلوبایت و بهینه شده اش فکر کنم 35 کیلوبایت بودش و نکته مهمش این هستش که کیفیت عکس هیچ افتی نکرده و قابل تشخیص هم نیستش
حالا یه حساب ساده بکنید که اگه ده تا عکس به این شکل باشه و ترمیم بشه چقدر تو سرعت سایت شما میتونه تاثیر بزاره
در help خود این سایت گفته شده که اولویت همیشه به png هستش و بیشتر عکس ها رو با این فرمت یا jepg به شما میده که میتونید تغییر بدید و اگه عکس قالب هستش میتونید اپلود بکنید با همون اسم آدرس اصلی و در قالب پسوند عکس رو مثلا از gif به png تبدیل بکنید و نتایج رو ببینید
هر دفعه هم میتونید بگید این سایت براتون دوباره انالیز بگیره و ببینید که کدوم عکس ها هنوز میتونن تغییر بکنن
به شخصه از این بخش خیلی بهره بردم و حجم عکس های سایتم رو از حدود 300 کیلوبایت به 180 کیلوبایت رسوندم و میگن قطره قطره جمع میشه
یه نکته هم هستش که همیشه ادرس اولین آنالیز خودتون رو نگه دارید و در اخر که کارها رو انجام میدید با اولیه مقایسه کنید و لذت ببرید
موفق باشید
---------- Post added at 01:24 AM ---------- Previous post was at 01:22 AM ----------
امیدوارم سر فرصت و با حوصله موارد قبلی رو انجام بدید
این آموزش یکی از چیزهای هستش که ممکنه اولش همه شک کنند و یا فکر کنن سر کاری هستش اما وقتی خودم تست کردمش به نتیجه بسیار عالی اون پی بردم
در این آموزش به این اشاره میشه که برای عکس ها حتما طول و عرض مشخص بشه
حتی برای عکس های که با اندازه واقعی خودشون دارن اجرا میشن
مثلا عکسی باطول و عرض 16 * 16 هستش و در قالب هم با همین اندازه استفاده شده و به نوعی resize نشده هم باید توسط کد های مخصوص طول و عرض براش تعیین بشه
بعضی دوستان میفرمائید که این کار باعث حجیم تر شدن حجم قالب در کد نویسی مبشه
اما چیز که در عمل اجرا میشه واقعا بر عکس این گفته هستش و سرعت لود بسیار بهتر میشه
بنده بارها عرض کردم که برنامه نویسی بلد نیستم و در این مورد صحبتی هم نمیکنم و همیشه بر اساس تجربه و چیزی که میبینم نظر میدم
نتیجه ای که با این کار من دیدم به این شکل بودش که برای بعضی از عکس های سایتم طول و عرض انتخاب کردم و به بقیه دست نزدم
نتیجه این شد که هر وقت سایت باز میشدش و یا ctrl + f5 زده میشد عکس های که طول و عرض براشون مشخص شده بسیار سریعتر باز میشدن
و نکته جالبتر اینکه اگه طول و عرض مشخص نشده باشه و شما سایت رو باز کنید مروگر شما لحظه ای اونجا صبر میکنه تا عکس باز بشه و بعد سراغ کدها و عکس های دیگه میره که زمان نسبتا زیادی رو صرف میکنه
در صورتی که با این روش کل سایت بخش بخش و به سرعت باز میشه و در ادامه اون عکس ها باز میشن
با این توضیح به عکس زیر توجه بفرمائید
با توجه به شکل به گزینه مورد نظر رفته و میتونید عکس های که تو صفحه شما هستش و طول و عرض ندارن رو ببینید و این سایت طول و عرض مورد استفاده عکس رو هم براحتی سهولت در کار در اختیار شما قرار میده و تعداد دفعاتی هم که اون عکس در سایت شما هستش هم اعلام میکنه
ذکر این نکته ضروری هستش که اگه با کدنویسی آشنا نیستید حتما قبل از ویرایش از قالب و ... خود پشتیبانی داشته باشید که اگه خراب کردید بتونید براحتی عوض کنید
برای خیلی از موارد در قالب ها میتونید از ادیتور خود نیوک هم کمک بگیرید و کدهای طول و عرض رو وارد کنید
امیدوارم در این مرحله هم موفق باشید
---------- Post added at 01:25 AM ---------- Previous post was at 01:24 AM ----------
اموزش بعدی قرار گرفتن کدهای ریدایرکت هستش که چه در سایت شما باشه و یا در سایت های دیگه که تو وب شما داره فراخوانی میشه
در این تصویر مشاهده می فرمائید که چه آدرس های داره بر اساس کد 404 به صفحه اول ریدایرکت میشه که داخل فایل htaccess قرار گرفته است
و به این معنی هستش که اون آدرس ها در سایت شما وجود نداره ولی داره فراخوانی میشه !
که باعث این میشه در ساده ترین حالت که اگه عکس یا fram باشه داخل خودش یک بار دیگر سایت شما رو باز بکنه و لود سایت شما رو شدیدا کاهش میده
در این تصویر یک مورد آموزشی هم هستش که در تاپیک های قبل بهش اشاره کرده بودم
آدرس عکسی که با فلش نشان داده شده را اگر ببینید متوجه میشید که کد ریدایرکتی که در سایت های دیگر لحاظ شده و شما استفاده میکنید هم چقدر میتونه تو لود شما تاثیر گذار باشه
یک بار دیگه به عکسی که در تاپیک های اول نشان دادم دقت بکنید که همین کد ریدایرکت چقدر تو زمان باز شدن شما تاثیر منفی میتونه داشته باشه
خط یکی مانده به اخری ک همان عکس هستش و حدودا 6 ثانیه از 14 ثانیه کلی سایت مربوط به تنها همین عکس هستش
---------- Post added at 01:26 AM ---------- Previous post was at 01:25 AM ----------
قدم بعدی برای بهینه سازی ، آرایش درست کد های جاوا شما هستش
یکی از قابلیت های جالب این سایت این است که کد های جاوا شما را بهینه میکنه و مقدار درصدی که مشکل داره رو بر اساس الگوریتم خودش میگه
بنده این بخش و کدهای که برای جایگزینی به شما ارائه میدهد را تست کردم و صد در صد و بدون مشکل کار کرده و شما هم میتونید با گرفتن پشتیبان از فایل هاتون اونها رو تست کنید و اگه مشکلی نبودش استفاده کنید و بعد از گذاشتن کد های پیشنهادی این سایت اون قابلیت ها رو در سایتتون تست کنید و ببینید که بدون ایراد کار خواهد کرد
تنها مشکلی که بعضا پیش میاد پشتیبانی نکردن کد ارائه شده این سایت با زبان فارسی هستش ( اونم نه در تمام موارد )
البته کدهای که ما هم استفاده میکنیم عموما انگلیسی هستن و فارسی نداره که مشکل داشته باشه
و مطمئنا دوستانی که برنامه نویسی بلد هستن میتونن راهنمایی کنن که چه کاری برای تکمیلش باید انجام داد
با توجه به تصویر میتونید عمل کنید
مشخص هستش که ادرس کد جاوا شما کدوم ها هستن و کد بهینه شده کدام است
البته قابل ذکر هستش که تا میتوانید از گذاشتن کد های جاوا داخل سایت پرهیز کنید و مثلا برای گذاشتن یک امکانات بیخود که سالی یک بار هم بدرد نمیخوره چندین کد جاوا و بعضا سنگین داخل سایت قرار ندید
موضوع بعدی هم که در help این سایت بودش ( با انگلیسی دست و پا شکسته ترجمه شدش ) اموزش این نکته بود که کد های جاوا و.. رو ته قالب و سورس قرار بدید که مانع باز شدن سایت نشه
نکته جالی بودش که نمیدونم بدرستی در سایت های بزرگ اجرا میشه یا نه
---------- Post added at 01:27 AM ---------- Previous post was at 01:26 AM ----------
گزینه بعدی برای بهینه سازی css سایت هستش
با توجه به تصویر انالیزی از css های مورد دار شما قرار داده میشه و نسخه بهینه شده رو هم تحویلتون میده که میتونید باز هم عرض میکنم با گرفتن نسخه پشتیبان از سایت اونها رو ازمایش بکنید
و الان مثلا در این مثال اولین موردی که گفته شده چون کاملا فارسی هستش نسخه بهینه شده درست نیستش
اما بقیش قابل استفاده هستش
این آموزش تخصصی هستش و عزیزانی که با کد نویسی css آشنایی دارن میتونن کمک کنن
در این مرحلهT این سایت ایرادات css شما رو از نظر کد های اضافی مورد بررسی قرار میده
برای مثال به عکس زیر دقت بفرمائید
به معنی ساده تر کد ها و خط های اضافی که در css شما وجود داره اما جای استفاده نمیشه به شما معرفی میشه
برای مثال در این عکس گفته شده که 2.2 کیلوبایت از 10 کیلوبایت فعلی اضافی هستش و خط های اون هم گفته شده که میتونید پیگیری کنید و نتیجه اش رو ببینید
---------- Post added at 01:37 AM ---------- Previous post was at 01:27 AM ----------
Parallelize downloads across hostnames
برای موارد بالای 80 درصد نیاز نیستند
اما تحقیق میکنم و حتما همینجا کاراییشو میذارم
---------- Post added at 01:38 AM ---------- Previous post was at 01:37 AM ----------
کل سی اس اس ها رو بریز توی additional.css بقیه css ها رو کلاً پاک کن در وی بی . البته این کار اصلاً اصلاً درست نیست .
پاسخ با نقل قول
نوشته اصلی توسط vbsupport
