در اموزش بعدی به بهینه سازی اولیه عکس های سایت میپردازیم
با توجه به عکس پیش میرید و تقریبا برای همه سایت ها این وضعیت کم یا زیاد هستش
با کلیک کردن رو گزینه optimize images مواردی رو به این شکل برای شما نشان میده که بستگی به تعداد عکس و مشکلاتش هستش
در فلش شماره دوم آدرس عکس فعلی که رو سایت شما هستش رو نشون میده و در فلش شماره سه عکس بهینه شده رو به شما میده
مثلا الان برای سایت میلاد جان اولین عکس رو میتونید ببینید و بهینه شده اش رو
حجم عکس فعلی حدود 60 کیلوبایت و بهینه شده اش فکر کنم 35 کیلوبایت بودش و نکته مهمش این هستش که کیفیت عکس هیچ افتی نکرده و قابل تشخیص هم نیستش
حالا یه حساب ساده بکنید که اگه ده تا عکس به این شکل باشه و ترمیم بشه چقدر تو سرعت سایت شما میتونه تاثیر بزاره
در help خود این سایت گفته شده که اولویت همیشه به png هستش و بیشتر عکس ها رو با این فرمت یا jepg به شما میده که میتونید تغییر بدید و اگه عکس قالب هستش میتونید اپلود بکنید با همون اسم آدرس اصلی و در قالب پسوند عکس رو مثلا از gif به png تبدیل بکنید و نتایج رو ببینید
هر دفعه هم میتونید بگید این سایت براتون دوباره انالیز بگیره و ببینید که کدوم عکس ها هنوز میتونن تغییر بکنن
به شخصه از این بخش خیلی بهره بردم و حجم عکس های سایتم رو از حدود 300 کیلوبایت به 180 کیلوبایت رسوندم و میگن قطره قطره جمع میشه
یه نکته هم هستش که همیشه ادرس اولین آنالیز خودتون رو نگه دارید و در اخر که کارها رو انجام میدید با اولیه مقایسه کنید و لذت ببرید
موفق باشید
---------- Post added at 12:40 AM ---------- Previous post was at 12:37 AM ----------
امیدوارم سر فرصت و با حوصله موارد قبلی رو انجام بدید
این آموزش یکی از چیزهای هستش که ممکنه اولش همه شک کنند و یا فکر کنن سر کاری هستش اما وقتی خودم تست کردمش به نتیجه بسیار عالی اون پی بردم
در این آموزش به این اشاره میشه که برای عکس ها حتما طول و عرض مشخص بشه
حتی برای عکس های که با اندازه واقعی خودشون دارن اجرا میشن
مثلا عکسی باطول و عرض 16 * 16 هستش و در قالب هم با همین اندازه استفاده شده و به نوعی resize نشده هم باید توسط کد های مخصوص طول و عرض براش تعیین بشه
بعضی دوستان میفرمائید که این کار باعث حجیم تر شدن حجم قالب در کد نویسی مبشه
اما چیز که در عمل اجرا میشه واقعا بر عکس این گفته هستش و سرعت لود بسیار بهتر میشه
بنده بارها عرض کردم که برنامه نویسی بلد نیستم و در این مورد صحبتی هم نمیکنم و همیشه بر اساس تجربه و چیزی که میبینم نظر میدم
نتیجه ای که با این کار من دیدم به این شکل بودش که برای بعضی از عکس های سایتم طول و عرض انتخاب کردم و به بقیه دست نزدم
نتیجه این شد که هر وقت سایت باز میشدش و یا ctrl + f5 زده میشد عکس های که طول و عرض براشون مشخص شده بسیار سریعتر باز میشدن
و نکته جالبتر اینکه اگه طول و عرض مشخص نشده باشه و شما سایت رو باز کنید مروگر شما لحظه ای اونجا صبر میکنه تا عکس باز بشه و بعد سراغ کدها و عکس های دیگه میره که زمان نسبتا زیادی رو صرف میکنه
در صورتی که با این روش کل سایت بخش بخش و به سرعت باز میشه و در ادامه اون عکس ها باز میشن
با این توضیح به عکس زیر توجه بفرمائید
با توجه به شکل به گزینه مورد نظر رفته و میتونید عکس های که تو صفحه شما هستش و طول و عرض ندارن رو ببینید و این سایت طول و عرض مورد استفاده عکس رو هم براحتی سهولت در کار در اختیار شما قرار میده و تعداد دفعاتی هم که اون عکس در سایت شما هستش هم اعلام میکنه
ذکر این نکته ضروری هستش که اگه با کدنویسی آشنا نیستید حتما قبل از ویرایش از قالب و ... خود پشتیبانی داشته باشید که اگه خراب کردید بتونید براحتی عوض کنید
برای خیلی از موارد در قالب ها میتونید از ادیتور خود نیوک هم کمک بگیرید و کدهای طول و عرض رو وارد کنید
امیدوارم در این مرحله هم موفق باشید
---------- Post added at 12:41 AM ---------- Previous post was at 12:40 AM ----------
اموزش بعدی قرار گرفتن کدهای ریدایرکت هستش که چه در سایت شما باشه و یا در سایت های دیگه که تو وب شما داره فراخوانی میشه
در این تصویر مشاهده می فرمائید که چه آدرس های داره بر اساس کد 404 به صفحه اول ریدایرکت میشه که داخل فایل htaccess قرار گرفته است
و به این معنی هستش که اون آدرس ها در سایت شما وجود نداره ولی داره فراخوانی میشه !
که باعث این میشه در ساده ترین حالت که اگه عکس یا fram باشه داخل خودش یک بار دیگر سایت شما رو باز بکنه و لود سایت شما رو شدیدا کاهش میده
در این تصویر یک مورد آموزشی هم هستش که در تاپیک های قبل بهش اشاره کرده بودم
آدرس عکسی که با فلش نشان داده شده را اگر ببینید متوجه میشید که کد ریدایرکتی که در سایت های دیگر لحاظ شده و شما استفاده میکنید هم چقدر میتونه تو لود شما تاثیر گذار باشه
یک بار دیگه به عکسی که در تاپیک های اول نشان دادم دقت بکنید که همین کد ریدایرکت چقدر تو زمان باز شدن شما تاثیر منفی میتونه داشته باشه
خط یکی مانده به اخری ک همان عکس هستش و حدودا 6 ثانیه از 14 ثانیه کلی سایت مربوط به تنها همین عکس هستش
---------- Post added at 12:42 AM ---------- Previous post was at 12:41 AM ----------
قدم بعدی برای بهینه سازی ، آرایش درست کد های جاوا شما هستش
یکی از قابلیت های جالب این سایت این است که کد های جاوا شما را بهینه میکنه و مقدار درصدی که مشکل داره رو بر اساس الگوریتم خودش میگه
بنده این بخش و کدهای که برای جایگزینی به شما ارائه میدهد را تست کردم و صد در صد و بدون مشکل کار کرده و شما هم میتونید با گرفتن پشتیبان از فایل هاتون اونها رو تست کنید و اگه مشکلی نبودش استفاده کنید و بعد از گذاشتن کد های پیشنهادی این سایت اون قابلیت ها رو در سایتتون تست کنید و ببینید که بدون ایراد کار خواهد کرد
تنها مشکلی که بعضا پیش میاد پشتیبانی نکردن کد ارائه شده این سایت با زبان فارسی هستش ( اونم نه در تمام موارد )
البته کدهای که ما هم استفاده میکنیم عموما انگلیسی هستن و فارسی نداره که مشکل داشته باشه
و مطمئنا دوستانی که برنامه نویسی بلد هستن میتونن راهنمایی کنن که چه کاری برای تکمیلش باید انجام داد
با توجه به تصویر میتونید عمل کنید
مشخص هستش که ادرس کد جاوا شما کدوم ها هستن و کد بهینه شده کدام است
البته قابل ذکر هستش که تا میتوانید از گذاشتن کد های جاوا داخل سایت پرهیز کنید و مثلا برای گذاشتن یک امکانات بیخود که سالی یک بار هم بدرد نمیخوره چندین کد جاوا و بعضا سنگین داخل سایت قرار ندید
موضوع بعدی هم که در help این سایت بودش ( با انگلیسی دست و پا شکسته ترجمه شدش ) اموزش این نکته بود که کد های جاوا و.. رو ته قالب و سورس قرار بدید که مانع باز شدن سایت نشه
نکته جالی بودش که نمیدونم بدرستی در سایت های بزرگ اجرا میشه یا نه
---------- Post added at 12:43 AM ---------- Previous post was at 12:42 AM ----------
گزینه بعدی برای بهینه سازی css سایت هستش
با توجه به تصویر انالیزی از css های مورد دار شما قرار داده میشه و نسخه بهینه شده رو هم تحویلتون میده که میتونید باز هم عرض میکنم با گرفتن نسخه پشتیبان از سایت اونها رو ازمایش بکنید
و الان مثلا در این مثال اولین موردی که گفته شده چون کاملا فارسی هستش نسخه بهینه شده درست نیستش
اما بقیش قابل استفاده هستش
---------- Post added at 12:44 AM ---------- Previous post was at 12:43 AM ----------
این آموزش تخصصی هستش و عزیزانی که با کد نویسی css آشنایی دارن میتونن کمک کنن
در این مرحلهT این سایت ایرادات css شما رو از نظر کد های اضافی مورد بررسی قرار میده
برای مثال به عکس زیر دقت بفرمائید
به معنی ساده تر کد ها و خط های اضافی که در css شما وجود داره اما جای استفاده نمیشه به شما معرفی میشه
برای مثال در این عکس گفته شده که 2.2 کیلوبایت از 10 کیلوبایت فعلی اضافی هستش و خط های اون هم گفته شده که میتونید پیگیری کنید و نتیجه اش رو ببینید
---------- Post added at 12:45 AM ---------- Previous post was at 12:44 AM ----------
اگه دوست داشتین بگید ادامه بدم