مکس آموز

آموزش ویدیوئی کار با slice در فتوشاپ | ابزار برش تصاویر

دوره آموزش جامع فتوشاپ

سطح مقدماتی تا پیشرفته
95000 تومان

در ادامه سری آموزش های مربوط به برنامه فتوشاپ از شرکت ادوبی به آموزش ویدیوئی کار با slice در فتوشاپ (ابزار برش تصاویر) می پردازیم. پس اگه فکر می کنید این آموزش می تونه به شما کمک کنه تا پایان این مقاله با ما همراه باشید.

slice tool ابزاری است برای بخش بندی یک تصویر به چندین تصویر  و برش تصاویر ، به چندین منظور من جمله بارگزاری تصاویر بزرگ و با کیفیت برای کاهش زمان اپلود روی هاست ، و همچنین لود سریع هنگام فراخوانی از سمت سرور توسط کاربران سایت ، همچنین به منظور تبدیل یک تصویر به چند قطعه تصویر در صنعت چاپ در تولید بنر های تبلیغاتی خیلی بزرگ که امکان چاپ یکجا توسط دستگاه چاپ نمی باشد. اما شاید بتوان گفت بیشترین کاربرد این ابزار در ساخت و طراحی صفحات سایت می باشد.

 slice tool تصاویر را به تصاویر کوچکتر تقسیم می کنند که در یک صفحه وب با استفاده از جدول HTML یا لایه های CSS دوباره ترکیب می شوند. با تقسیم تصویر، می توانید لینک های مختلف URL را برای ایجاد ناوبری صفحه اختصاص دهید یا هر بخش از یک تصویر را با استفاده از تنظیمات بهینه سازی خود بهینه سازی کنید.شما با استفاده از فرمان ذخیره برای وب و دستگاه، یک تصویر برش را صادر و بهینه سازی کنید. فتوشاپ هر تکه را به عنوان یک فایل جداگانه ذخیره می کند و کد HTML یا CSS مورد نیاز برای نمایش تصویر برش را تولید می کند.

هنگام کار با slice می کنید، این نکات را در ذهن داشته باشید:

  • شما می توانید یک تکه را با استفاده از ابزار برش یا با ایجاد برش های مبتنی بر لایه ایجاد کنید.
  • پس از ایجاد یک برش، می توانید آن را با استفاده از ابزار slice select toll انتخاب کنید و سپس حرکت دهید، تغییر اندازه دهید یا آن را با سایر برش ها همسان سازید.
  • شما می توانید گزینه هایی برای هر برش را تنظیم کنید، مانند نوع برش، نام و URL در جعبه محاوره ی گزینه برش.
  • شما می توانید هر تکه را با استفاده از تنظیمات بهینه سازی مختلف در کادر محاوره ای ذخیره برای وب و دستگاه بهینه سازی کنید.

انواع برش در کار با slice

برش ها  هنگام کار با slice بر اساس نوع محتوای آنها (جدول، تصویر، بدون تصویر) و با روش ایجاد (کاربر، مبتنی بر لایه، خودکار) طبقه بندی می شوند.برش های ایجاد شده با ابزار برش، برش های کاربر نامیده می شوند؛ برش های ایجاد شده از یک لایه، برش های مبتنی بر لایه نامیده می شوند. هنگامی که یک تکه تکه کاربر جدید یا تکه ای مبتنی بر لایه ایجاد می کنید، بخش های خودکار بیشتری برای حساب کردن مناطق باقی مانده تصویر ایجاد می شود. به عبارت دیگر، تکه های خودکار فضا را در تصویر پر می کند که توسط برش های کاربر یا برش های مبتنی بر لایه تعریف نشده است. هر بار برش های خودکار هر زمانی که می توانید برش های کاربر یا برش های مبتنی بر لایه را اضافه یا ویرایش کنید، بازسازی می شوند. شما می توانید برش های خودکار را به برش های کاربر تبدیل کنید.

کار با slice

کار با slice

 

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

Subslice یک نوع تکه خودکار است که هنگام ایجاد تکه های همپوشانی ایجاد می شود. Subscriptions نشان می دهد که چگونه تصویر را در هنگام ذخیره فایل بهینه سازی شده تقسیم کنید. اگرچه عناصر شمارنده و نماد تکه ای نمایش داده می شوند، نمی توانید آنها را به صورت جداگانه از تکه های زیرین انتخاب کنید یا آنها را ویرایش کنید. تقاضانامه ها هر بار تنظیم ترتیب برش ها را ترتیب می دهند.

کار با slice

  • یک تکه را با ابزار برش ایجاد کنید
  • ابزار برش را انتخاب کنید. (کلید C را برای چرخاندن از ابزارهای گروه بندی شده با Crop نیز فشار دهید).
  • هر گونه برش موجود به طور خودکار در پنجره سند ظاهر می شود.
یک استایل برای ترسیم برش در نوار گزینه ها را انتخاب کنید که به صورت های زیر می باشند:
Normal: هنگام کشیدن، نسبتهای برش را تعیین می کند.

Fixed Aspect Ratio: نسبت ارتفاع به عرض را تنظیم می کند. عدد یا رقم عدد را برای نسبت ابعاد وارد کنید. برای مثال، برای ایجاد یک تکه دو برابر بزرگتر از حد بالا، ۲ را برای عرض و ۱ برای ارتفاع وارد کنید.

Fixed Size: ارتفاع و عرض برش را مشخص می کند. مقادیر پیکسل را در اعداد کامل وارد کنید.

برای انتخاب توسط کلید های میانبر از حالت های انتخاب در ابزار marqee استفاده کنید.

ایجاد برش تصاویر بوسیله  guide

  • با ابزار خطلش ، تقسیم بندی برش ها را با استفاده از ابزار ruler ایجاد کنید.
  • ابزار slice را انتخاب کنید و بر روی Slices From Guides در نوار گزینه ها کلیک کنید.
  •  پس از اعمال Slices From Guides هر قطعه از تصویر که درون تقسیم بندی های ابزار خطکش قرار داشت تبدیل به یک تصویر برش خورده می شود.

برش های لایه محور ، انعطاف پذیری کمتری از برش های کاربر دارند. با این حال، شما می توانید  یک برش مبتنی بر لایه را به یک تکه کاربر تبدیل کنید.

یک لایه را در پانل لایه ها انتخاب کنید.
لایه> لایه مبتنی بر لایه جدید را انتخاب کنید.

ایجاد لینک پس از برش تصاویر

  • پس از نهایی شدن برش تصاویر به روش های چندگانه ای که عرض کردیم روی هر قطعه تصویر دبل کلیک کنید تا slice option گشوده شود سپس در قسمت  url آدرس اینترنتی  مورد نظر که قصد دارید تا با کلیک بر روی آن به آدرس آن منتقل شوید را وارد کنید.
  • مطمئن شوید که پروتکل مناسب را شامل می شود (به عنوان مثال، http://www.maxamooz.ir ، و نه www.maxamooz.ir).
  • در صورت لزوم، نام یک قاب هدف را در کادر متن هدف وارد کنید:
    blank : آدرس را در صفحه جدیدی باز می کند.
    self : آدرس را در  همان صفحه باز می کند.
    parent : فایل مرتبط را در مجموعه فریم اصلی خود نمایش می دهد. از این گزینه استفاده کنید اگر سند HTML حاوی فریم ها باشد و کادر فعلی یک کودک است. فایل پیوند در کادر اصلی فعلی ظاهر می شود.
    top : پنجره کل مرورگر با فایل پیوند شده را حذف می کند و تمام فریم های فعلی را حذف می کند. نام باید با یک نام فریم که قبلا در فایل HTML برای سند مشخص شده است، مطابقت داشته باشد. هنگامی که یک کاربر روی لینک کلیک کند، فایل مشخص شده در کادر جدید ظاهر می شود.

نهایتا با کلید های ترکیبی shift +crtl + alt  به پنجره save for web منتقل خواهید شد.

کار با slice

کار با slice

پس از کلیک بر روی save پنجره ای گشوده می شود که اینبار آدرس محل ذخیره سازی فایل و فرمت فایل یا فایل های ذخیره شده را مطالبه میکند.محل ذخیره سازی را مطابق میل خود ذخیره نمایید اما برای نوع ذخیره سازی فایل ها گزینه image and html file را انتخاب کنید.با این کار علاوه بر تصاویر تقسیم بندی شده که هر کدام تحت یک فایل جدید ذخیره خواهند شد فایل کد های html ساخته شده توسط فتوشاپ نیز ایجاد می گردد.می توان فایل  html را توسط مرورگرها باز کنید تا مشاهده نمایید که تمامی تصاویر تجزیه شده کنار همدیگر قرار گرفته اند درست مانند قبل از کار با  slice tool با این تفاوت که این تصویر به یک صفحه وب تبدیل گردیده و اگر موس را روی بخش هایی که برای آنها url در نظر گرفته اید را ببرید خواهید دید که علامت نشان موس تغییر می کند که خود نشانه لینک دار بودن آن بخش از تصویر است. نهایتا با تزریق تصاویر و کد html ایجاد شده به سامانه مدیریت محتوایی نظیر وردپرس می توانید از آن در طراحی سایت خود استفاده کنید.

سجاد

نوشته‌های مرتبط

دیدگاه‌ها