چگونه عکس های سایت خود را فشرده کنیم؟

چگونه عکس های سایت خود را فشرده کنیم؟
چکیده این مطلب : انتشار : 1395/03/09 16 نظر 7,807 بازدید

در این مقاله به معرفی ابزاری بسیار کاربردی برای کاهش حجم عکس های وب سایت پرداخته شده است تا بتوانید بدون پایین آوردن کیفیت عکس ها آنها را تا حد ممکن فشرده کنید.

اگر شما یک وب سایت دارید قطعا در وب سایت شما عکس های بسیاری وجود دارد که هنوز هم می توانید آنها را فشرده تر کنید! ابزارهای بسیاری برای این کار وجود دارند که در این مقاله به معرفی یکی از بهترین آنها خواهیم پرداخت.

 

چرا باید عکس های وب سایت حجم بهینه داشته باشند؟

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

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

همچنین اگر عکس های سایت بهینه سازی شده باشند در سایت های پربازدید در میزان مصرف پهنای باند فضای میزبانی نیز صرفه جویی بسیاری خواهد شد.

 

چه فرمتی از عکس ها برای انتشار در وب مناسب است؟

معمولا عکس های ثابت وب سایت از فرمت های JPEG و PNG تشکیل شده است زیرا این دو فرمت امکان بهینه سازی بالایی برای انتشار در وب دارند. دقت کنید که کار شما صرفا پایین آوردن حجم عکس نیست! شما باید حجم عکس را طوری بهینه کنید که کیفیت عکس پایدار بماند یا به حد بسیار ناچیزی تغییر کند.
برای این کار می توانید از روشهای مختلفی استفاده کنید، اما دو روش که بیشترین کاربرد را دارند استفاده از فتوشاپ و ابزارهای آنلاین است که در ادامه به توضیح هر دو مورد خواهیم پرداخت.


بهینه سازی عکس های وب سایت با استفاده از فتوشاپ

هر مدیر وب سایتی قطعا می داند که برای فشرده سازی عکس ها در اولین مرحله و بهینه سازی آنها جهت انتشار در وب می تواند از ابزار Save for web در نرم افزار فتوشاپ بهره ببرد.
شما با رفتن به منوی File و انتخاب این گزینه وارد صفحه جدیدی در نرم افزار فتوشاپ خواهید شد که می توانید با انتخاب فرمت و کیفیت عکس مد نظرتان حجم و کیفیت عکس را برای انتشار در وب بهینه کنید. فتوشاپ به شما هر دو فرمت JPEG و PNG را خروجی می دهد و شما می توانید با تنظیم دقیق کیفیت مد نظرتان خروجی نهایی را دریافت کنید.

 

بهینه سازی عکس های وب سایت با استفاده از ابزار آنلاین

هدف از نوشتن این مقاله آشنا کردن مدیر وب سایت ها با ابزار آنلاین کاهش حجم عکس ها بدون تغییر در کیفیت آن است و در این بخش ابزاری که می خواهیم به آن بپردازیم TinyPNG است.
وب سایت TinyPNG یکی از معروفترین ابزارهای آنلاین برای کاهش حجم عکس های شما جهت انتشار در وب سایت خودتان می باشد.
خوشبختانه وب سایت TinyPNG از فرمت PNG و JPEG پشتیبانی می کند و از هر دو دامنه زیر نیز در دسترس است:
https://tinypng.com
https://tinyjpg.com

 

نحوه کار با وب سایت TinyPNG

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


تجربه شخصی کار با سایت TinyPNG

علت معرفی این وب سایت تجربه بسیار خوبی است که سالها در هنگام کار با این سایت کسب کرده ام، هر زمان که یک عکس PNG با کیفیت احتیاج داشته باشید و نیاز شما طوری باشد که عکس باید بدون داشتن پس زمینه باشد، قطعا مشکل شما حجم بالای عکس خروجی است!
اگر از فتوشاپ استفاده می کنید یا باید فرمت PNG 8 را انتخاب کنید تا کیفیت پایین تر و حجم کمتری داشته باشید و یا باید از PNG 24 استفاده کنید که معمولا کیفیت فوق العاده و حجم بالایی خواهید داشت.
مشکل اصلی در بهینه سازی عکس ها برای انتشار در اینترنت معمولا برای فرمت PNG است و همین موضوع همیشه برای شما مشکل ایجاد خواهد کرد.
عکس های بدون پس زمینه یا Transparency باید با فرمت های GIF و PNG ذخیره شوند و اگر عکس شما دارای بخش های ظریف و پیچیده باشد قطعا خروجی کار شما دارای حجم بالایی خواهد بود.
اکنون فقط کافی است که عکس خود را به روی این سایت رها کنید و نسخه با کیفیت عالی و حجم مناسب را دریافت کنید.

 

نمونه فشرده سازی های انجام شده توسط TinyPNG

این نمونه ای است که در سایت TinyPNG منتشر شده است و میزان کاهش حجم و عدم تغییر در کیفیت عکس را به وضوح نشان می دهد.

 

فشرده سازی عکس با ابزار آنلاین TinyPNG برای بهینه سازی و انتشار عکس در اینترنت

 

مشاهده نسخه PDF مقاله: چگونه عکس های سایت خود را فشرده کنیم؟

 

دوستانی که این مطلب را مطالعه کرده اند، از محصولات زیر نیز استقبال کرده اند

25 اشتباه بزرگ در بازاریابی اینترنتی (فایل صوتی)

25 اشتباه بزرگ در بازاریابی اینترنتی (فایل صوتی)

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

دوستانی که این مطلب را مطالعه کرده اند، از مطالب زیر نیز استقبال کرده اند

چرا پیج رنک گوگل صفر شد؟

چرا پیج رنک گوگل صفر شد؟

سوالی که این روزها ذهن مدیران وب سایت ها را مشغول کرده است دلیل صفر شدن پیج رنک گوگل و یافتن جایگزینی برای آن است! در این مقاله دلیل صفر شدن پیج رنک گوگل و جایگزین آن معرفی می شود.
 

30 نکته مهم در بهبود طراحی سئو دوستانه

30 نکته مهم در بهبود طراحی سئو دوستانه

طراحی مهمترین و کلیدی ترین عامل موفقیت است. اغلب مردم به اشتباه باور دارند که طراحی های سئو دوستانه خیلی کارآمد نیست. موتورهای جستجوی استاندارد بهترین راه برای فهمیدن اهمیت طراحی خوب برای کاربران است.  

آیا گوگل پلاس آینده سئو خواهد بود؟

آیا گوگل پلاس آینده سئو خواهد بود؟

سرویس گوگل پلاس یا همان شبکه اجتماعی گوگل چقدر در سئو یک وب سایت اهمیت دارد و حضور در آن را چقدر باید جدی گرفت، آیا نظر افراد با تجربه در این زمینه تاکید بر حضور در این شبکه اجتماعی دارد؟

ارتباط بازاریابی محتوا با سئو دقیقا چیست؟

ارتباط بازاریابی محتوا با سئو دقیقا چیست؟

در این مقاله ما به بررسی «سئو» و «بازاریابی محتوا» می پردازیم و‌ می‌خواهیم بدانیم این دو، در چه زمینه‌هایی با هم تفاوت دارند و کجاها همکار یکدیگر می‌شوند.

نقشه سایت (sitemap) چیست؟

نقشه سایت (sitemap) چیست؟

در سئوی سایت شما نکاتی حائز اهمیت هستند که باتوجه به آنها می توانید سایت خود را بهینه سازی کنید در این مطلب به شما سایت مپ که یکی از ابزار های سئو است را آموزش خواهیم داد.

آیا JavaScript و CSS می تواند بر روی ایندکس شدن در گوگل تأثیر بگذارد؟

آیا JavaScript و CSS می تواند بر روی ایندکس شدن در گوگل تأثیر بگذارد؟

بروزرسانی جدید وبمستر تولز گوگل و سیستم روبات های خزنده آن تغییراتی داشته است و طبق گفته وبلاگ گوگل مسدودسازی استفاده از JavaScript و CSS می تواند بر روی ایندکس شدن ها تأثیر بگذارد!  

نظرات

فرشاد حسین‌زاده
۱۳۹۶/۰۶/۱۹۰۰
پاسخسلام
مشکلی که با فشرده کردن عکس وجود داره اینه که رزولوشن صفحه نمایش دستگاه ها روز به روز در حال افزایش هست. و اگر یک عکس فشرده داشته باشیم و سایتمون روی یک موبایل با رزولوشن 1080 باز بشه عکسمون به شدت تار و بی کیفیت نمایش داده میشه و این اصلاً خوب نیست.
راه حل استفاده از lazyload هست. عکس با کیفیت پایین بعنوان پیشفرض قرار بگیره و عکس اصلی با رزولوشن و کیفیت بالاتر در صورت لزوم توسط lazyload لود بشه.
احمد
۱۳۹۶/۰۱/۱۸۰۰
پاسخاز بامیلو نخرید. یک میلیون تومنم یک ماهه دست بامیلو مونده، جوابگو هم نیستن
سعید ارزومند
۱۳۹۵/۱۰/۲۱۰۰
پاسخجالب بود تشکر
عباس مجرد
۱۳۹۵/۰۵/۲۲۰۰
پاسخسلام من سایت digiamol.ir و سایت amol-ads.ir را مدیریت میکنم البته نمایندگی شرکت فروتل هستم که با دادن پنل به هر فروشنده داریم کار میکنیم من سایت ها رو چطور پر بازدید کنم فروش را بالا ببرم با توجه به نماینده بودن نمیتونیم قالب زیباتری بگذاریم چون چند پنله هستیم تا چند وقت دیگر قالب بهتر میگذاریم میخوام کل بازار امل رو مجازی کنم کمکم کنید چه کنم تا زود راه بیفته سعی میکنم مانند شاگرد از راهنمایی شما بهره ببرم سپاس
میثم طریقی
۱۳۹۵/۰۴/۲۵۰۰
پاسخسلام برای سایت های ورد پرس بهترین فرمت عکس چیه ؟
png یا jpeg یا ...
زارعی
۱۳۹۵/۰۳/۱۸۰۰
پاسخسلام
آقای منصوری فر
ممنونم از شما
مهران
۱۳۹۵/۰۳/۱۲۰۰
پاسخآقای منصوری
ممنونم از شما
مهدی گران
۱۳۹۵/۰۳/۱۲۰۰
پاسخسلام
برای فشرده سازی عکس یه سری ابزارهای برنامه نویسی هم هست. مثلا یکی از ابزارهای ساخته شده برای nodeJS ( فریم ورک جاوا اسکریپتی) به نام GulpJS هست که میتونید مسیر عکس ها رو به اون بدید و تنها با وارد کردن یک دستور عکسهای فشرده شده رو تو مسیری که مشخص کردید تحویل بگیرید.
GulpJS یک ماژول برای Automate کردن فرآیند release وب سایت هست که کارهای تکراری فرآیند release رو میشه در قالب task براش نوشت تا اتوماتیک انجام بشه. کارهایی مثل :
فشرده کردن و ادغام کردن فایلهای جاوا اسکریپت
فشردن کردن فایلهای css
فشرده سازی عکس ها
و خیلی از کارهای دیگر به امکانات این ماژول برنامه نویسی به راحتی میشه انجام داد.
مهدی گران
۱۳۹۵/۰۳/۱۲۰۰
پاسخسلام
برای فشرده سازی عکس یه سری ابزارهای برنامه نویسی هم هست. مثلا یکی از ابزارهای ساخته شده برای nodeJS ( فریم ورک جاوا اسکریپتی) به نام GulpJS هست که میتونید مسیر عکس ها رو به اون بدید و تنها با وارد کردن یک دستور عکسهای فشرده شده رو تو مسیری که مشخص کردید تحویل بگیرید.
GulpJS یک ماژول برای Automate کردن فرآیند release وب سایت هست که کارهای تکراری فرآیند release رو میشه در قالب task براش نوشت تا اتوماتیک انجام بشه. کارهایی مثل :
فشرده کردن و ادغام کردن فایلهای جاوا اسکریپت
فشردن کردن فایلهای css
فشرده سازی عکس ها
و خیلی از کارهای دیگر به امکانات این ماژول برنامه نویسی به راحتی میشه انجام داد.
شهاب بشیری
۱۳۹۵/۰۳/۱۱۰۲
پاسخبا سلام و تشکر از مطالب خوبتون
خیلی عالی بود و چند تا عکس رو با همین روش کاهش حجم دادم که نزدیک 80 درصد حجمشون کاهش یافته بود بدون اینکه کیفیت اون تغییر کنه ، ممنون از شما
و پیشنهاد میکنم مقاله ای نیز درباره قالب استاندارد برای قرار دادن عکسها در سایت قرار بدین که بشه تمام عکسها ، با یه قالب استاندارد یا با طول و عرض یکسان در سایت قرار بگیرند
ممنون و تشکر از مطالب مفیدو کاربردیتون
میرزاییان
۱۳۹۵/۰۳/۱۰۰۱
پاسخ

باسلام و احترام محضرتان تشکر بابت مطالب زیبا بازم بسیار قدرتمند ظاهر شدید سایت بسیار زیبایی دارید. http://modireweb.com قطعا یکی از سایت های موفق در آینده نزدیک خواهید بود... افتخار ما آشنایی با شماست

امیر
۱۳۹۵/۰۳/۱۰۰۱
پاسخسلام
مقاله خوبی بود
فقط ذکر یک نکته خالی از لطف نیست ، اونم این که توی وردپرس (با توجه به فراگیر بودنش بین وبمستر های ایرانی) افزونه های زیادی هستند که این کار رو به صورت خودکار انجام می دن ، مثل wp smush و ...
خود وردپرس هم این قابلیت رو داره و با چند خط ساده می تونید تنظیمات اون رو ویرایش کنید ، توی آموزش زیر می تونید مشاهده کنید :
http://8theme.ir/how-to-change-wordpress-jpeg-image-compression
در ضمن تجربه ثابت کرده که اگه از وردپرس استفاده می کنید ، تا جایی که امکان داره تصاویر شاخصتون رو با فرمت PNG آپلود نکنید . تنها در صورتی از این فرمت استفاده کنید که اندازه اصلی تصویر رو توی سایتتون نمایش بدید . (چرا که وردپرس بعد از اپلود فایل PNG اونو فشرده می کنه و متاسفانه در بیشتر موارد نتیجه برعکس داره و حجم تصویر به شدت افزایش پیدا می کنه )
موفق باشید
شبنم خسروی
۱۳۹۵/۰۳/۱۰۰۱
پاسخ,واقعا مفید و کاربردی
ممنون
موذنی
۱۳۹۵/۰۳/۱۰۰۱
پاسخسلام خدمت شما
این آموزش خوبی بود و بسیار کاربردی
اکثرا سایت ها خیلی عکس دارند این روش ها بسیار برای بلابردن سرعت سایت مفید است و تاثیر خوبی دارد .
با تشکر
موذنی
آرش بیدختی
۱۳۹۵/۰۳/۱۰۰۳
پاسخبا سلام و احترام خدمت شما آقای مهندس منصوری فر عزیز.من همین الان مقاله بسیار عالی تونو خوندم و بلافاصله یک عکس png و یک عکس jpeg رو داخل سایتی گفتین انجام دادم و واقعا هم حجم عکس تا 80% کاهش پیدا کرد و هم جالبیش به اینجا بود که من هیچ تغییری در کیفیت عکس ندیدم.واعا ممنونم از انتشار مقاله بسیار خوبتون مثل همیشه
رضا جهانی
۱۳۹۵/۰۳/۱۰۰۱
پاسخباتشکر مطالب خوبی داخل سایت قرارمی دهید

به این مطلب امتیاز دهید

تعداد کل امتیازات این مطلب 14

به چه موضوعی علاقه مندید؟

محصولات پیشنهادی مرتبط

25 اشتباه بزرگ در بازاریابی اینترنتی (فایل صوتی)

25 اشتباه بزرگ در بازاریابی اینترنتی (فایل صوتی)

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

تبلیغات

عضویت در خبرنامه

با عضویت در خبرنامه می توانید از جدیدترین مقالات، اخبار و محصولات سایت در ایمیل خود با خبر شوید...

به جمع کاربر ما بپیوندید