logo

گروه فناوری اطلاعات ارسان

گروه فناوری اطلاعات ارسان با بهره گیری از یک تیم خلاق و پویا در زمینه طراحی انواع سایت این امکان را برای شما فراهم می آورد تا فعالیتهای خود را به گونه ای متفاوت ارائه دهید. هدف ما ارائه راهکارهای نوین به منظور افزایش کارایی حرفه شما در سطح داخلی و بین المللی می باشد
info@orsanweb.ir
09356255505

بهینه سازی تصاویر استاتیک برای وب سایت

بهینه سازی تصاویر

بهینه سازی تصاویر استاتیک برای وب سایت

بکارگیری مناسب تصاویر و بهینه سازی تصاویر در طراحی سایت یکی از مهم ترین قسمت ها، برای طراحی یک سایت حرفه ای است.پس باید بیاموزیم که چگونه تصاویر را در وب سایت خود مدیریت نماییم.مخصوصا در وب سایت های داینامیک و محتوایی ، مدیریت تصاویر بسیار حائز اهمیت است.به  این دلیل که روز به روز مطالب جدید همراه آن تصاویر مربوطه بر روی وب سایت بارگذاری می شود و در نهایت حجم زیادی از این جور وب سایت ها را تصاویر شامل می شود.

بهینه سازی تصاویر وب سایت

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

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

بهینه سازی آیکن ها

در رابطه با آیکون ها روش های مختلفی وجود دارد.چون تعداد آیکون ها می تواند زیاد باشد و به همین دلیل برای هر عکس باید یک درخواست از مرورگر کاربر به سرور ارسال میشد تا فایل آیکون مربوطه دریافت شود در روشی به نام Image Sprite همه آیکون ها کنار هم و در یک فایل تصویر قرار داده می شدند و با استفاده از خصوصیت Position قسمت مربوط از تصویر خوانده و نمایش داده میشد.مشکل این روش آماده کردن تصویر اصلی ، عدم امکان رنگ پذیری تصاویر، مشکل در اندازه و خواندن موقعیت هر آیکون بر روی تصویر بود.

در روش دیگری که هم اکنون بهینه ترین روش در نمایش آیکون ها به شمار می رود استفاده از فونت آیکون ها است .فونت آیکون های معروفی وجود دارد که آیکون های پراستفاده و عمومی را کنار هم به صورت یک فونت ارائه می دهند.مثلا در فونت آیکون fontawesome  اگر نیاز به آیکن خانه داشته باشید می توانید از کلاس fa fa-home برای نمایش دادن آیکن خانه استفاده نمایید.فونت آیکون های مزیت های فرآوانی  دارند.شما دقیقا مانند یک نوشته با آنها برخورد می کنید.یعنی می توانید به آن اندازه و رنگ دلخواه بدهید.پس برای آیکون ها بهترین روش استفاده از فونت آیکون ها می باشد.

بهینه سازی تصاویر

 

بهینه سازی تصاویر ثابت

حالا به سراغ تصاویر ثابت مانند لوگو و دیگر تصاویر ثابت وب سایت می رویم.این تصاویر را آماده نمودیم ولی شاید حجم آنها هنوز بهینه نشده باشد و خود نیز براحتی نتوانیم این کار را انجام دهیم.وب سایت هایی در این زمینه سرویس دهی می کنند که حجم تصاویر را به خوبی کاهش می دهند بدون اینکه کیفیت قابل لمسی را از تصویر بکاهند مانند وب سایت compressjpeg.com و نمونه های دیگر که تصویر شما را گرفته و به نسبت خوبی کاهش می دهند.

بدون دیدگاه

ارسال دیدگاه

دیدگاه
نام
ایمیل
وبسایت