گروه آموزش طراحی سایت 17 اردیبهشت 1393 بدون نظر 9628 بازدید آموزش طراحی سایت

به نام خدا

در این قسمت یک فایل در نرم افزار فتوشاپ باز کنید.به همین منظور نرم افزار فتوشاپ را می آورید از زیر منوی فایل به گزینه ی open کلیک کنید که می بینید با کلیدهای میانبر ctrl+o هم قابل انجام است. مثلا روی دسکتاپ خود یک عکس به نام gol که قبلا ذخیره کرده اید در این قسمت باز کنید.حالا می خواهید عکس خود را به شکل خاصی ذخیره کنید میاین روی منو فایل روی گزینه ی save for web&pevices کلیک کنید.علت اینکه از گزینه ی save for web&pevices استفاده می شود به خاطره امکانات خوبی است که در اختیار شما قرار می دهد.

باز کردن پنجره

باز کردن عکس

باز کردن عکس 1

ذخیره کردن عکس

نکته ای که لازم است بدانید این است که 3 تا فرمت رایج را در امور وب design داریم:

فرمت اول:GIF.

ویژگی های GIF:

1- از 256 رنگ پشتیبانی می کند.

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

ذخیره کردن با GIF

فرمت دوم: JPEG.

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

ذخیره با JPEG

فرمت سوم: PNG که به 2 شکل وجود دارد:

1- PNG-8

ذخیره کیفیت عکس با png-8

2-PNG-24

ذخیره کیفیت عکس با png-24

فرمت PNG از این بابت که Transparent پشتیبانی می کند شبیه به فرمت GIF است کار خوب با عکس های یک دست انجام می دهد و برتری که نسبت به فرمت GIF دارد این است که از Transparent های خیلی بالاتر و با کیفیت تری پشتیبانی می کند و کیفیت بهتری نسبت GIF دارد.PNG-8 و PNG-24 بسته به انتظاراتی که شما از سطح کیفی و امکانات آن می خواهید دارد و ضمن اینکه لازمه به این نکته توجه کنید که فرمت PNG امروزه یکی از پراستفاده ترین فرمت ها در وب Design است.

PNG-8 از بابت تعداد رنگ هایی که ساپورت می کند 256 رنگ است.

PNG-24 از میلیون ها رنگ استفاده می کند و از این بابت واقعا فوق العاده است. البته PNG-24 توسط IE6 به صورت پیش فرض پشتیبانی کاملی از آن نمی شود و خوب با استفاده از یک سری ترفندهایی در css شما می توانید این مشکل را برای IE6 هم حل کنید.

نکته ای دیگری که در این پنجره save for web&pevices لازم است که بدانید اینکه علاوه بر این که هر فرمتی را انتخاب کنید می توانید آن را به صورت اعمال شده برروی کیفیت عکس خود ببینید. پایین تر یک سری اطلاعات درباره ی آن انتخاب شده است می بینید که با انتخاب فرمت GIF این عکس 293.2k حجم دارد و اگر کاربر شما اینترنتی که دارد سرعت 56.6kbps و 54 sec (ثانیه) طول می کشد تا این عکس بارگذاری بشود البته با تغییر دادن فرمت JPEG می بینید که زمان به 20 ثانیه می رسد و حجم آن هم 106.7k تغییر پیدا می کند.

حجم و سرعت لود عکس

حجم و سرعت لود عکس 1

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

تب های مختلف

تب original

تب 2-UP که شما می توانید 2 عکس را داشته باشید همین طور که می بینید عکس بالا Original یا عکس اصلی است و حجم اولیه را دارا می باشد ولی قسمت پایین تغییرات اعمال شده را ببینید که چه از لحاظ پیش نمایش آن کیفیت کاهش پیدا کرده نسبت به بالا و چه از بابت اینکه حجم کم شده و سرعت بالا رفته.

تب 2-up

تب 4-UP که شما می توانید برای هر قسمت از فرمت های مختلفی استفاده کنید به عنوان مثال اول Original ، دوم در سمت راست قسمت بالا فرمت JPEG ، سوم در قسمت پایین سمت چپ فرمت GIF  و عکس آخر هم PNG-24 می گذارید.

تب 4- UP

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

نظرات کاربران (0)