درود طبق عکسهایی که ارسال کردم در جی تی متریکس میخوام فردی این عکسها را با تکنیک CSS Sprite راهنمایی کنه البته من هر کاری کردم طبق راهنمایی سایت وب سیما نتونستم اون قسمت که وارد سایت sprite me بوک مارک رو بزنم نمیدونم چرا عمل نمیکنه در کل میخوام اگر فردی میتونه برام انجامش بده ممنون میشم چنانچه هزینه هم داشته باشه در خدمتم هزینه رو برام اعلام کنه
naghmesra
January 21st, 2017, 00:20
سلام و درود
بدون آدرس سایت نمیشه کاری کرد.
pixco
January 21st, 2017, 00:50
درود در عکسی که قرار دادیم کاملا واضح می باشد
لینکها به شرح زیر میباشد
http://bazrco.ir/modules/dmtnews/views/img/arrows-1.png
http://bazrco.ir/themes/leo_emarket/img/default/bg-cart.png
http://bazrco.ir/themes/leo_emarket/img/default/icon-call.png
http://bazrco.ir/themes/leo_emarket/img/modules/appagebuilder/images/%D8%A7%D8%B1%D8%B3%D8%A7%D9%84%20%D8%B1%D8%A7%DB%8 C%DA%AF%D8%A7%D9%86%20%DA%A9%D8%A7%D9%84%D8%A7.png
http://bazrco.ir/themes/leo_emarket/img/modules/appagebuilder/images/%D8%A7%D8%B1%D8%B3%D8%A7%D9%84%20%D8%B3%D8%B1%DB%8 C%D8%B9%20%DA%A9%D8%A7%D9%84%D8%A7.png
http://bazrco.ir/themes/leo_emarket/img/modules/appagebuilder/images/%D8%AA%D8%B6%D9%85%DB%8C%D9%86%20%D8%A8%D9%87%D8%A A%D8%B1%DB%8C%D9%86%20%D9%82%DB%8C%D9%85%D8%AA.png
http://bazrco.ir/themes/leo_emarket/img/modules/appagebuilder/images/%D8%AA%D9%85%D8%A7%D8%B3%20%D8%A8%D8%A7%20%D9%85%D 8%A7.png
http://bazrco.ir/themes/leo_emarket/img/modules/appagebuilder/images/%D8%B6%D9%85%D8%A7%D9%86%D8%AA%20%D8%A7%D8%B5%D9%8 4%20%D8%A8%D9%88%D8%AF%D9%86%20%DA%A9%D8%A7%D9%84% D8%A7.png
naghmesra
January 21st, 2017, 01:09
درود
درود در عکسی که قرار دادیم کاملا واضح می باشد
لینکها به شرح زیر میباشد
http://bazrco.ir/modules/dmtnews/views/img/arrows-1.png
http://bazrco.ir/themes/leo_emarket/img/default/bg-cart.png
http://bazrco.ir/themes/leo_emarket/img/default/icon-call.png
http://bazrco.ir/themes/leo_emarket/img/modules/appagebuilder/images/%D8%A7%D8%B1%D8%B3%D8%A7%D9%84%20%D8%B1%D8%A7%DB%8 C%DA%AF%D8%A7%D9%86%20%DA%A9%D8%A7%D9%84%D8%A7.png
http://bazrco.ir/themes/leo_emarket/img/modules/appagebuilder/images/%D8%A7%D8%B1%D8%B3%D8%A7%D9%84%20%D8%B3%D8%B1%DB%8 C%D8%B9%20%DA%A9%D8%A7%D9%84%D8%A7.png
http://bazrco.ir/themes/leo_emarket/img/modules/appagebuilder/images/%D8%AA%D8%B6%D9%85%DB%8C%D9%86%20%D8%A8%D9%87%D8%A A%D8%B1%DB%8C%D9%86%20%D9%82%DB%8C%D9%85%D8%AA.png
http://bazrco.ir/themes/leo_emarket/img/modules/appagebuilder/images/%D8%AA%D9%85%D8%A7%D8%B3%20%D8%A8%D8%A7%20%D9%85%D 8%A7.png
http://bazrco.ir/themes/leo_emarket/img/modules/appagebuilder/images/%D8%B6%D9%85%D8%A7%D9%86%D8%AA%20%D8%A7%D8%B5%D9%8 4%20%D8%A8%D9%88%D8%AF%D9%86%20%DA%A9%D8%A7%D9%84% D8%A7.png
احتیاجی به اسپریت نیست.
عکس ها رو در اینجا (http://b64.io/) به کد Base64 تبدیل کنید و کد را جایگزین آدرس عکس کنید.
5 عکس انتهایی سایت هم چون مربوط به قالب سایت هست باید از طریق css به صفحه اضافه شود نه با تگ img.
موفق باشید
hamid1101
January 21st, 2017, 01:44
توی سایت زیر اگر بروید خیلی راحت تر از بقیه سایتها هست
کافیه عکسهای خودتون را آپلود کنید و بعدش هم به شما فایل sprite را میده و هم فایل css که مختصات هرکدوم از تصاویر نشون داده میشه
http://spritegen.website-performance.org/
همچنین میتونید اندازه و محل قرار گرفتن تصاویر توی sprite را هم خیلی راحت تغییر بدهید
pixco
January 21st, 2017, 01:52
ممکنه اینکارو برام انجام بدید اگر لازم باشه هزینشم میدم خدمتتون
naghmesra
January 21st, 2017, 03:12
درود
ممکنه اینکارو برام انجام بدید اگر لازم باشه هزینشم میدم خدمتتون
دسترسی رو پ.خ کنید انجام بدم براتون.
AtrafNet
January 21st, 2017, 07:49
درود
احتیاجی به اسپریت نیست.
عکس ها رو در اینجا (http://b64.io/) به کد Base64 تبدیل کنید و کد را جایگزین آدرس عکس کنید.
5 عکس انتهایی سایت هم چون مربوط به قالب سایت هست باید از طریق css به صفحه اضافه شود نه با تگ img.
موفق باشید
جسازتاً روش Base64 برعکس باعث کاهش سرعت میشه چون دقت کنید الان در حالت معمول که فایل ها جدا هستند مرورگر تمام اونا رو می تونه به صورت جدا Cache و ذخیره کنه و بعدش با هر بار لود صفحه فقط HTML رو بخونه ولی وقتی شما تصاویر هم عضوی از خود کد های HTML میکنید دیگه مرورگر با هر لود صفحه مجبوره دوباره تصاویر هم لود کنه مگر اینکه در htaccess. تعیین کنید که کد های HTML هم توسط مرورگر Cache بشه که اشتباهه و در این صورت مطالب جدید رو کاربری که از قبل وارد سایت شده تا خودش Ctrl+F5 نزنه یا کش رو پاک نکنه نمی تونه ببینه.
به نظر من همون CSS Sprite رو که gtmetrix.com بهشون پیشنهاد داده استفاده کنن خیلی بهتره.
دلیل پیشنهاد CSS Sprite هم که همه می دونن فقط برای کم شدن Request مرورگر به فایل های متعدد هستش وگرنه حتی ممکنه حجم تصویر Sprite معادل حجم جداگونه تصاویر باشه ولی چون مرورگر برای تعدادی عکس فقط یک درخواست می فرسته و یک پاسخ میگیره لود سایت کمی سریع تر میشه.
naghmesra
January 21st, 2017, 10:45
سلام و درود
جسازتاً روش Base64 برعکس باعث کاهش سرعت میشه چون دقت کنید الان در حالت معمول که فایل ها جدا هستند مرورگر تمام اونا رو می تونه به صورت جدا Cache و ذخیره کنه و بعدش با هر بار لود صفحه فقط HTML رو بخونه ولی وقتی شما تصاویر هم عضوی از خود کد های HTML میکنید دیگه مرورگر با هر لود صفحه مجبوره دوباره تصاویر هم لود کنه مگر اینکه در htaccess. تعیین کنید که کد های HTML هم توسط مرورگر Cache بشه که اشتباهه و در این صورت مطالب جدید رو کاربری که از قبل وارد سایت شده تا خودش Ctrl+F5 نزنه یا کش رو پاک نکنه نمی تونه ببینه.
استفاده از روش Base64 مستقیم در فایل HTML به خاطر همین موضوع Cache که شما میگید توصیه نمیشه و اگر قراره Base64 داشته باشیم باید در فایل CSS استفاده بشه چون فایل CSS کش میشه.
5 عکس انتهایی سایت هم چون مربوط به قالب سایت هست باید از طریق css به صفحه اضافه شود نه با تگ img.
اگر دقت کنید اینجا اشاره کردم که 5 عکس پایین سایت هم باید وارد CSS بشه دلیلش همین بود.
در هر صورت هر دو روش قایل استفاده است و تفاوت چندانی بین این روش مشاهده نمیشه البته اگر Base64 برای عکس های درون CSS استفاده بشه نه برای عکس های درون HTML.
موفق باشید
pixco
January 22nd, 2017, 20:34
توی سایت زیر اگر بروید خیلی راحت تر از بقیه سایتها هست
کافیه عکسهای خودتون را آپلود کنید و بعدش هم به شما فایل sprite را میده و هم فایل css که مختصات هرکدوم از تصاویر نشون داده میشه
http://spritegen.website-performance.org/
همچنین میتونید اندازه و محل قرار گرفتن تصاویر توی sprite را هم خیلی راحت تغییر بدهید
درودخدمتتونپیامدادممیهشان کاروانجامبدیدبرام