PDA

View Full Version : بهینه سازی تصاویر برای استفاده در وب


ali_rezaei76
2007-11-15, 04:11 PM
بهینه سازی تصاویر برای استفاده در وب

چند تصویر گرافیكی برگزیده می تواند به وب سایت شما چنان اعتباری ببخشید كه چندین صفحه متن نوشته شده نمی تواند. ولی باید تعادلی بین آنچه كه می خواهید با یك تصویر بیان كنید و هزاران واژه ای كه می خواهید بگویید وجود داشته باشد. زیرا به جای همه واژه ها نمی توانید یك آلبوم عكس در Homepage بگذارید.
حالا باید ببینیم چند تصویر را می توان در یك صفحه گذاشت و اندازه فایل های تصویری یك صفحه چقدر می تواند سنگین باشد. ما توصیه می كنیم تصاویر گرافیكی استفاده شده در یك Homepage بیش از ۴۰ كیلو بایت نباشد، تا افرادی كه با استفاده از مودم های قدیمی تر به سایت شما متصل می شوند خیلی معطل نشوند. ممكن است یك صفحه ۴۰ كیلو بایت به نظر خیلی سبك و نامناسب بیاید ولی به خاطر داشته باشید همین صفحه ۱۳ ثانیه طول می كشد تا با یك مودم ۵۶K بالا بیاید.

بررسی ها نشان داده است كه اگر بالا آمدن تصاویر سایت ها بیش از ۱۵ ثانیه طول بكشد ممكن است سرورها تصاویر را بلرزانند و یا تكه تكه بیاورند، هر چند بعضی مراجعه كنندگان به سایت شما دارای اتصال هایی با باند هستند، ولی بعضی كاربران ممكن است با موبایل به سایت شما وصل شوند.

برای اطلاعات بیشتربه سایت http://Usability.gov/guidelines/softhard.Html مراجعه كنید.

برای این كه یك سایت متعادل داشته باشید باید مقیاس های فیزیكی تصاویرتان را كاهش دهید و آنها را فشرده كنید تا فایل شما به كوچكترین اندازه ممكن تقلیل یابد. این همان روند بهینه سازی تصاویر است. هر چه بیشتر تصویر را فشرده كنید، البته كه جزئیات بیشتری را از دست می دهید، بنابر این باید تمهیدی به خرج دهید كه بین اندازه فایل و كیفیت تصویرتان همخوانی مناسبی ایجاد شود. همیشه این سؤال را از خودتان بپرسید كه آیا این تصویر لازم است؟
آیا اگر این تصویر را به سایت تان اضافه نكنید، مفهومی را از دست داده و بیان نكرده اید؟ البته ممكن است خیلی ها وسوسه شوند كه این بهینه سازی را انجام ندهند و تصاویر مورد نیازشان را از سایت های دیگر بگیرند و از آن استفاده كنند. ولی این كار از جنبه های اخلاقی كار پسندیده ای نیست و تازه در بیشتر كشورها قانون حق انحصار می تواند برایشان مشكل ساز شود. برای آشنایی با این مقررات می توانید به سایت ذیل مراجعه نمایید.
http://WWW.da.Co.Uk/Copyrightvillageinernet.htm

گام اول: آماده سازی تصویر
بسیار ساده می توانید فایل را با فتوشاپ ویرایش كنید و آن را فیلتر گذاری كنید. برنامه گرافیكی خود را در Mode RGB (و نه CMYK) تنظیم كنید و اگر در نظر دارید بعداً آن را ویرایش كنید، حتماً آن را لایه لایه ذخیره كنید.
نكته:همیشه تصویر Gif را قبل از آن كه بخواهید ویراش كنید و یا تغییر اندازه دهید به RGB برگردانید.

گام دوم: حذف زوائد
از ابزار Crop برای حذف چیزهای زائد پیرامون تصویر استفاده كنید. Crop ابزاری است كه به سادگی می توانید آن را انتخاب كنید و سپس چهار گوشی برای محدوده مورد نظر بكشید.

گام سوم: منظم كردن
اگرچه ویرایش تصویر مهارت بالایی می خواهد، ولی یك آشنایی ساده با بسته نرم افزاری یا گرافیكی می تواند تفاوت اساسی در تصاویر گرافیكی شما بوجود بیاورد. یكی از روش ها این است كه عكس های بی حالت را تا حدودی واضح تر و زنده تر كنید و برای این كار از دستورLevels استفاده كنید. این دستور امكان تغییر سایه ها و تنظیمات هاله های كم رنگ و پررنگ را در اختیارتان قرار می دهد.

گام چهارم: تنظیم كنید
وقتی می خواهید عرض تصویر را تنظیم كنید، اول ببینید كه كیفیت كار بر روی صفحه معمولی چگونه است. برای نشان دادن یك تصویر۴۸۰*۶۴۰ باید یك محدوده پیكسل ۳۰۰*۶۰۰ و برای یك تصویر۳۰۰*۷۶۰ یك محدوده ۶۰۰*۸۰۰ و برای یك تصویر۶۰۰*۹۵۵ یك محدوده ۷۶۸*۱۰۲۴ در نظر بگیرید.
نكته: همیشه سعی كنید تصاویر وب را به صورت ۷۲ نقطه در اینچ ذخیره كنید.

گام پنجم: JPEG یا GIF
جستجوگر همه موضوعاتی را كه كماكان به صورت JPEG و GIF وجود داشته باشد پشتیبانی می كند. JPEG می تواند میلیون ها رنگ را پشتیبانی كند، در حالی كه GIF فقط ۲۵۶ رنگ را پشتیبانی می كند. بنابر این GIF برای تصاویر گرافیكی مثل آیكون ها، لوگوها و دكمه ها مناسب است، اما JPEG برای عكس هایی كه تركیبات رنگ پیچیده تر دارند بكار می رود. برای كسب اطلاعات بیشتر به سایت http://www.webdesign.about.com مراجعه كنید.

گام ششم: فشرده سازی JPEG
JPEG از یك نوع تكنیك ریاضی بسیار پیچیده برای تولید یك مقیاس قابل تغییر در فشرده سازی تصاویر استفاده می كند. بسیاری از برنامه های گرافیكی نیز این امكان را دارند كه میزان تأثیری را كه فشرده سازی بر روی تصویر می گذارد نشان دهند.

گام هفتم: ذخیره كنید
هر چند JPEG برای كاهش اندازه فایل بسیار كارآمد است، ولی فشرده كردن بیش از حد تصاویر ممكن است تصویر را دانه دانه كند. اگر از كاهش اندازه یك فایل نتیجه ای نگرفتید، بهتر است ابعاد آن را كاهش دهید. زمانی كه یك بار تصویر را در حالت JPEG ذخیر نموده اید، تا حدی دیتاهای آن را از بین برده اید و تصویر اولیه دیگر قابل برگشت نیست، پس بهتر است فایل اصلی را حفظ كنید.

گام هشتم: انواع برش
اگر از فشرده سازی با كیفیت پایین استفاده می كنید، JPEG نمی تواند نوشته های روی عكس را بدون تغییر حفظ كنند و باعث ایجاد خش و ناخوانایی می شود. اگر می خواهید حتماً نوشتار و تصویر با هم باشند، بهتر است عكس را از قسمت های نوشته دار برش دهید و به صورت فایل های GIF و JPEG درآورید و پس از فشرده سازی مناسب، آن را به هم بچسبانید.

گام نهم: فرمت GIF
برای كوچك نگهداشتن اندازه فایل از این فرمت استفاده می شود. فرمت GIF حداكثر ۲۵۶ رنگ را پشتیبانی می كند. اگر تعداد رنگ ها را كمتر كنید، اندازه فایل ها را هم می توانید كوچك تر كنید. GIF همچنین می تواند ذخیره سازی را مرحله ای انجام دهد، رنگ را شفاف سازد و انیمیشن هم داشته باشد.

گام دهم: مواظب باشید
نه تنها ذخیره سازی و فشرده سازی تصاویر GIF كار مشكلی است، بلكه گاهی اندازه ها در جاهای مختلف تصویر، متفاوت ذخیره می شوند. ممكن است همواره این اتفاق نیافتد ولی معمولاً این گونه می باشد. در نتیجه بهتر است همواره از JPEG استفاده كنید و گرنه ممكن است رنگ ها در تصورتان به صورت نواری دربیایند.

گام یازدهم: جداسازی تصاویر
اگر مراقب نباشید ممكن است وب سایت تان تبدیل به كشوی مملواز صدها فایل شود. بهتر است این فایل ها را در كشوهای مختلفی بگذارید كه با همان عناوین در سایت گذاشته شده اند. برای دقت بیشتر می توانید در هر كشو زیر عنوان های بیشتری قرار دهید.

گام دوازدهم: سایر موارد
همه كاربران نمی توانند تصاویر گرافیكی را روی سایت شما ببینید، بنابر این بسیار مهم است كه سایت شما شامل text مربوط به تصاویر هم باشد. شما می توانید درسایت ها از نمودارها و دیاگرام ها نیز استفاده كنید.