از آنجایی که کاربران اینترنتی از آن دسته افراد بی صبر هستند به شما توصیه می کنیم تا تصاویر خود را بهینه سازی کنید تا باسرعت بیشتری صفحه بارگذاری شود. با استفاده ازبهینه سازی تصاویر، می توان بارگذاری صفحات رابصورت سریع انجام داد که این زمان بارگذاری نیازمند فایلهایی باحجم کم است. این مقاله روشهای مورد استفاده در بهینه سازی تصاویر را مورد بحث قرار می دهد.
در یک دنیای ایده آل، طراح سایت می تواند از با کیفیت ترین تصاویر استفاده کند و صفحه را ایجاد کند که در چشم به هم زدنی باز شود. بارگذاری سریع نیازمند آن است که حجم فایلها برای تصاویر تا حد ممکن کوچک و کم باشد. متاسفانه تعادلی میان کیفیت تصاویر و حجم فایلها وجود دارد، که این علت باعث می شود که با کم کردن حجم کیفیت کاهش یابد.
کاربران اینترنتی صبر و حوصله منتظر ماندن برای بارگزاری سایت شما را ندارند. چنانچه سایتی بیش از حد زمان بارگذاری آن بطول بیانجامد، آنها بر روی دکمه برگشت کلیک کرده و از سایت شما خارج خواهند شد و دیگر به سایت شما باز نخواهند گشت، که این مسئله برای صاحبان و هم بازدید کنندگان سایت چندان خوشایند نیست.
صفحه نمایش کامپیوتر می تواند تنها تصاویری با وضوح ۷۲dpi (نقطه در اینچ) را نمایش دهد. در نتیجه اولین گام در بهینه سازی تصاویر، کاهش وضوح به ۷۲ dpi است. تصاویر بزرگتر می توانند به قسمتهای کوچکتری تقسیم بندی شوند که هر قسمت، فایل کوچکی را تشکیل دهد، که می تواند در کسر کوچکی از زمان لود شود.
اکثر فایلهای گرافیکی شامل اطلاعاتی در مورد پالت رنگ تصویر هستند. این اطلاعات معمولا برای نمایش در سایت مورد نیاز نمی باشد. بسیاری از برنامه های گرافیکی این قابلیت را دارند تا تصاویر را بتوان برای وب دخیره سازی نمود. “Save for the web” انتخابی است که کلیه اطلاعات غیر ضروری را از تصویر حذف می کند بدون آنکه بر کیفیت نهایی تصویر خدشه ای وارد شود.
روش دیگری که به ظاهر می تواند زمان بارگذاری را بالاتر ببرد، استفاده از ویژگی progressive برای تصاویر GIF، یا PNGهای interlaced است. هر دوی این ویژگیها این امکان را می دهند تا زمان بارگذاری صفحات به تدریج صورت گیرد و در ابتدا تصویری مات نمایش داده شود و سپس تصویری با وضوح بیشتر و شفاف تر. در حقیقت این تصاویر حتی چند ثانیه نیز کندتر از تصاویر معمولی بارگذاری می شوند ولی آنها برای بازدید کنندگان به نظر سریعتر هستند.
خصیصه طول و عرض IMG
تگ IMG به مرورگر وب می گوید تا مربعی با سایزی خاص را برای نگهداری گرافیک تولید کند. با اینکار مرورگر می تواند مابقی صفحه سایت را بارگذاری نماید در حالیکه تصویر در حال بارگذاری است. چنانچه طول و عرض تصویرمشخص نشود، مرورگر وب مجبور است تا زمانیکه تصویر بطور کامل بارگذاری نشده است، منتظر بماند و قسمتهای دیگر صفحه را بارگذاری نکند.
از چند تصویر می بایست استفاده کرد؟
برخی از طراحان سایت از تصاویر برای هر چیزی استفاده می کنند. درحالیکه اینکار می تواند بنظر مناسب باشد ولی قطعا زمان بارگذاری صفحات را بالاتر خواهد برد و سرعت بارگزاری سایت را کندتر خواهد کرد. سرعت صفحات وابسته به حجم خود فایل HTML و سایز تمامی فایلهای بکار رفته در آن است. تصاویر معمولا ۵۰ درصد زمان بارگذاری را شامل می شوند.پس از تصاویر کمتر و یا کم حجم تر در طراحی سایت استفاده کنید.
استفاده از تصاویر کمتر و کم حجم تر، زمان بارگذاری سایت را کمتر خواهد کرد باعث خواهد شد تا کاربران بی حوصله از سایت شما فرار نکنند.
کیفیت تصاویر
کیفیت تصاویر توسط وضوح، تعداد پیکسل، خلوص رنگ و جزییات تصویر مشخص می شود. از ویرایشگرهایی استفاده کنید که نویزها و دیگر خصیصه های ناخواسته را در تصویر حذف کنند. بیشتر ویرایشگرهای عکس به شما این امکان را می دهند تا برای افزایش دقت تصویر، قرمزی چشمها و لبه های تیز تصویر را اصلاح نمایید.
ویرایشگرهای حرفه ای نظیر Fireworks و Photoshop به شما این امکان را می دهند تا پیش زمینه و سطوح رنگ تصویر را تنظیم کنید و تقریبا هر کاری که دوست دارید با تصویر انجام دهید.
همچنین می توانید از یک تصویر کوچک شده روی سایت استفاده کنید تا لینکی به نسخه ای با کیفیت تر و بزرگتر از همان عکس بدهد بطوریکه بازدید کننده بعد از کلیک روی لینک بتواند آن را مشاهده کند.
چهارچوب بهینه سازی تصاویر
پیشنهادهای زیر به شما این امکان را می دهند تا تصاویرتان را برای بارگذاری سریع در سایت بهینه سازی کنید بدون آنکه بر کیفیت نهایی آنها تاثیری بگذارد:
- وضوح تصاویر را به ۷۲ dpi کاهش دهید.
- تصاویری که به صورت متن هستند را به متن واقعی تبدیل کنید.
- تصاویر را به اندازه ای که مورد نیاز است برش (crop) دهید و اضافه های آن را حذف کنید.
- عمق رنگ را درمواقعی که برای کیفیت مورد نیاز نیست کم کنید.
- طول و عرض واقعی تصاویر را مشخص کنید.
- در صورت لزوم از نسخه کوچک عکسها استفاده کنید.
و اما یک سایت خوب برای بهینه سازی تصاویر
شاید برای شما هم پیش آمده باشد که نخواهید کیفیت تصویرتان پایین بیاید و در عین حال حجمش کاهش یابد ، آیا این امکان پذیر است ؟ جواب سایت سازی یک بله قاطع و محکم است. سایتی وجود دارد که به راحتی می تواند تصاویر را تا درصد بالایی کاهش دهد بدون اینکه کیفیت تصاویر افت کند. www.tinypng.com این همان سایتِ مدنظرِ ماست.
با کشیدن تصویر از کامپیوتر خود بر روی قسمت Drop Your PNG و رها کردن آن ، در عرض چند ثانیه تاینی آن را فشرده کرده و بدون افت کیفیت به شما تحویل می دهد. برای تحویل گرفتن عکس خود نیز می توانید بر روی گزینه سمت راست که با عنوان download قرار گرفته است کلیک کنید همچنین درصد فشرده سازی نیز در سمت راست عکس نمایان می شود که نشان می دهد تاینی تا چند درصد تصویر شما را فشرده سازی کرده است. تاینی یک ابزار رایگان بوده و هیچ نیازی به عضویت ندارد. علاوه بر ما برخی از سئوکاران حرفه ای و بسیاری از طراحان نیز از این سایت برای فشرده سازی تصاویر خود استفاده می کنند. و ما نیز به شما این سایت را حتماً پیشنهاد می کنیم.
جمله آخر
مطمئناً همانطور که اطلاع دارید پایین آوردن حجم تصاویر در لود سریع سایتتان بسیار سهیم است بنابراین منطقی است که قبل از بارگزاری تصاویرتان در وب سایت آنها را بهینه کنید. در توضیحات به سایت تاینی و نرم افزار فتوشاپ اشاره هایی شد. بهینه سازی تصاویر یعنی مختصر و مفید کردن آن ها و حذف کردن اضافات ، حاشیه های بی تاثیر ، اضافات عکس و پایین آوردن حجم تصاویر بدون کاشه یافتن کیفیت آن ها. امیدواریم که از این مقاله استفاده کافی برده باشید. با سپاس