چگونه تصاویر را بهینه کنیم؟
به ما اعتماد کنید، نمی خواهید گوگل از وب سایت شما متنفر باشد. خوشبختانه، شما می توانید اندازه فایل های تصویر خود را کاهش دهید تا به بهبود عملکرد وب سایت خود کمک کنید.
یکی از مشکلات قالب‌بندی آنها این است که تغییرات اغلب کیفیت آنها را کاهش می‌دهند (که به نوبه خود ممکن است باعث نفرت بازدیدکننده از وب‌سایت شما شود). این چیز بدی نیست تا زمانی که آنها را زشت نکنید.
ترفندها و تکنیک هایی وجود دارد که به شما امکان می دهد اندازه فایل تصویر را کاهش دهید و همچنان آنها را به اندازه کافی زیبا نگه دارید تا با افتخار در وب سایت خود نمایش دهید.
بنابراین بیایید نگاهی به نحوه قالب بندی تصاویر خود بدون زشت کردن و همچنین نحوه بهینه سازی تصاویر برای وب و عملکرد بیندازیم.
بهینه سازی تصاویر به چه معناست؟
تصاویر بزرگ باعث کاهش سرعت صفحات وب شما می شود که تجربه کاربری کمتر از حد مطلوبی ایجاد می کند. بهینه سازی تصاویر فرآیند کاهش اندازه فایل آنها با استفاده از یک پلاگین یا اسکریپت است که به نوبه خود باعث افزایش سرعت بارگذاری صفحه می شود. فشرده سازی بدون تلفات و اتلاف دو روشی هستند که معمولاً مورد استفاده قرار می گیرند.
مزایای قالب بندی تصاویر
اول، چرا باید تصاویر خود را قالب بندی کنید؟ مزایای آن چیست؟ بهینه سازی تصاویر شما برای عملکرد فواید زیادی دارد. طبق آرشیو HTTP، از نوامبر 2018، تصاویر به طور متوسط 21٪ از وزن کل صفحه وب را تشکیل می دهند. بنابراین وقتی نوبت به بهینه سازی سایت شما می رسد، پس از محتوای ویدیویی، تصاویر تا حد زیادی اولین جایی هستند که باید شروع کنید!
از اسکریپت ها و فونت ها مهم تر است. و از قضا، یک گردش کار خوب بهینه سازی تصویر یکی از ساده ترین چیزها برای پیاده سازی است، با این حال بسیاری از صاحبان وب سایت این موضوع را نادیده می گیرند.
در اینجا به مزایای اصلی نگاهی می اندازیم:
سرعت بارگذاری صفحه شما را بهبود می بخشد (مطالعه موردی ما را در زیر ببینید تا چه اندازه بر سرعت شما تأثیر می گذارد). اگر بارگذاری صفحه شما بیش از حد طول بکشد، بازدیدکنندگان شما ممکن است از انتظار خسته شوند و به سراغ چیز دیگری بروند. برای اطلاعات بیشتر در مورد بهینه سازی زمان بارگذاری صفحه، راهنمای بهینه سازی سرعت صفحه عمیق ما را ببینید.
همراه با یک افزونه عالی SEO وردپرس، سئوی شما را بهبود می بخشد. سایت شما در نتایج موتورهای جستجو رتبه بالاتری خواهد داشت. فایل های بزرگ سرعت سایت شما را کاهش می دهند و موتورهای جستجو از سایت های کند متنفرند. همچنین احتمالاً گوگل تصاویر شما را سریعتر برای جستجوی تصویر گوگل می‌خزد و فهرست می‌کند. کنجکاو هستید که چند درصد از ترافیک شما از جستجوی تصویر گوگل می آید؟ می توانید از افزونه یا بخش وردپرس Google Analytics برای بررسی ترافیک جستجوی تصاویر گوگل استفاده کنید.
ایجاد پشتیبان سریعتر خواهد بود.
اندازه فایل های تصویری کوچکتر از پهنای باند کمتری استفاده می کنند. شبکه ها و مرورگرها از این موضوع قدردانی خواهند کرد.
به فضای ذخیره سازی کمتری در سرور شما نیاز دارد (این بستگی به تعداد تصویر بند انگشتی شما دارد)
چگونه تصاویر را برای وب و عملکرد بهینه کنیم؟
هدف اصلی از فرمت کردن تصاویر، یافتن تعادل بین کمترین اندازه فایل و کیفیت قابل قبول است.
بیش از یک راه برای انجام تقریباً همه این بهینه سازی ها وجود دارد. یکی از محبوب ترین راه ها فشرده سازی آنها قبل از آپلود در وردپرس است. معمولاً این کار را می توان در ابزاری مانند Adobe Photoshop یا Affinity Photo انجام داد. برخی از این کارها را می توان با استفاده از افزونه ها نیز انجام داد که در ادامه به آن ها خواهیم پرداخت.
1 مورد اصلی که باید در نظر بگیرید فرمت فایل و نوع فشرده سازی است که استفاده می کنید. با انتخاب ترکیب مناسب فرمت فایل و نوع فشرده سازی می توانید اندازه تصویر خود را تا 5 برابر کاهش دهید. شما باید با هر تصویر یا فرمت فایل آزمایش کنید تا ببینید چه چیزی بهتر عمل می کند.
1. فرمت فایل مناسب را انتخاب کنید
قبل از شروع به اصلاح تصاویر خود، مطمئن شوید که بهترین نوع فایل را انتخاب کرده اید. چندین نوع فایل وجود دارد که می توانید استفاده کنید:
PNG - تصاویری با کیفیت بالاتر تولید می کند، اما اندازه فایل بزرگتری نیز دارد. به عنوان یک فرمت تصویر بدون اتلاف ایجاد شده است، اگرچه می تواند دارای تلفات نیز باشد.
JPEG – از بهینه سازی با اتلاف و بدون ضرر استفاده می کند. می توانید سطح کیفیت را برای تعادل خوبی بین کیفیت و اندازه فایل تنظیم کنید.
GIF - فقط از 256 رنگ استفاده می کند. این بهترین انتخاب برای تصاویر متحرک است. فقط از فشرده سازی بدون اتلاف استفاده می کند.
چندین مورد دیگر مانند JPEG XR و WebP وجود دارد، اما همه مرورگرها از آنها پشتیبانی نمی کنند. در حالت ایده آل، باید از JPEG یا JPG برای تصاویر با رنگ زیاد و PNG برای تصاویر ساده استفاده کنید.
(مطالعه پیشنهادی: JPG در مقابل JPEG: درک رایج ترین فرمت فایل تصویری)
- ۰ ۰
- ۰ نظر
