آموزش فتوشاپ

معرفی نرم افزار ایلاستریتور
معرفی نرم افزار فتوشاپ
معرفی نرم افزار کورل دراو
تفاوت گرافیک برداری و پیکسلی
تفاوت گرافیک وب و گرافیک چاپ
استانداردهای طراحی وب :: شما اینجا هستید...
mode ها و کانال های رنگی در فتوشاپ
قواعد و روانشناسی رنگ ها
خصوصیات رنگ ها
رنگ های جامد و شیب رنگ ها
طراحی بر مبنای گرید ها
نقش و انواع گرید در طراحی سایت
چطور ایده پردازی کنیم و یک طرح وب ایجاد کنیم؟
کاربرد براش (Brush) در فتوشاپ
ابزار کراپ در فتوشاپ
کاربرد ابزار قطره چکان (eyedropper tool)
ابزار جادویی و ابزار انتخاب سریع در فتوشاپ
ابزار Lasso در فتوشاپ
ابزار move در فتوشاپ
ابزار Marquee در فتوشاپ
ابزار سطل رنگ در فتوشاپ
ابزار گرادینت در فتوشاپ
گروه ابزار Smudge در فتوشاپ
پنل لایه ها در فتوشاپ
تفاوت Opacity با Fill در لایه‌های فتوشاپ
آشنایی با منو های فتوشاپ
پنجره color picker در فتوشاپ
افزونه Flaticon در فتوشاپ
طراحی فلت چیه؟
متریال دیزاین چیست؟
تنظیم نور عکس در فتوشاپ
ابزارهای رتوش و ترميم تصوير
ابزارهای گروه استامپ
۱۰ عادت بد در فتوشاپ
ابزار متن در طراحی فتوشاپ
خطوط راهنما در فتوشاپ
اصول چاپ در فتوشاپ
۱۰ نکته مفید در مورد طراحی لوگو
پشتیبان گیری خودکار در فتوشاپ

جلسه ششم: استانداردهای گرافیک وب

استاندارد های طراحی وب مجموعه قوانینی هستند که طراحان وب دنبال می کنند، دانستن آنها با انتظارات بازدیدکنندگان هماهنگ است آنها دستورالعمل هایی برای وضوح و قابلیت استفاده دارند برای طراحان وب، استاندارهای گرافیک وب حیاتی هستند استانداردها به کاربران اطمینان می دهند تا ویژگی هایی که می خواهند را به راحتی در سایت پیدا کنند و آن ویژگی ها را برای رسیدن به هدف به کار ببرند این مزایا باعث افزایش تسلط کاربران در وب سایت می شود، توانایی آنها در انجام کارها را افزایش می دهد و رضایت کلی آنها را با تجربه افزایش می دهد.

چرا وب سایت ها باید با استانداردهای طراحی وب مطابقت داشته باشند؟

کاربران مدت زمان خیلی کمی را در سایت شما خواهند بود شما باید در این مدت کوتاه او را مجاب کنید که سایت شما نیازهای او را برآورده می کند اگر سایت شما استاندارد های لازم را نداشته باشد کاربر به سرعت از سایت شما خارج می شوند به همین دلیل باید از الگو ها و قوانین خاصی پیروی کنید از جمله:

  • طراحی ریسپانسیو
  • آیکون شبکه های اجتماعی در فوتر
  • جعبه ثبت نام در پایین صفحه
  • ویژگی جستجو در هدر
  • نمایش اسلاید در صفحه ای اصلی
  • منوی اصلی در بالای صفحه
  • لوگو در بالا سمت چپ
بیشتر بخوانید :   تفاوت گرافیک برداری و پیکسلی

حالا ما می خواهیم طراحی قالب سایت را در فتوشاپ طراحی کنیم باید چه استانداردهایی را رعایت کنیم تا یک طرح کامل را تحویل کدنویس بدهیم.

ابعاد عرض و ارتفاع

ابعاد عرض و ارتفاع باید به گونه ای داده شود که در تمامی دستگاه هایی که می خواهیم نمایش داده بشود به صورت درست باشد در واقع در دستگاه ها responsive باشند.

رزولوشن سایت

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

واحد اندازه گیری

واحد اندازه گیری در همه بخش های نرم افزار فتوشاپ  باید بر حسب پیکسل ( Pixel ) یا PX باشد . پس زمانی که فایل خودتان را در فتوشاپ ایجاد می کنید باید واحد اندازه گیری ابعاد طرح را روی Pixels  قرار بدهید . همچنین برای سایر بخش ها مثل اندازه فونت ها و … هم از همین واحد اندازه گیری استفاده کنید.

کانال رنگی

در هنگام ایجاد فایل گرافیکی در فتوشاپ شما می بایست از کانال رنگی یا به عبارتی Color Mode ، RGB استفاده کنید . منظور از RGB به ترتیب : R رنگ قرمز ، G رنگ سبز و B رنگ آبی رو مشخص می کند . ترکیب های رنگی موجود در وب طبق کانال رنگی RGB به وجود می آورند ما هم باطبع از همین کانال رنگی استفاده می کنیم . در حقیقت همه رنگ های موجود در وب توسط این سه رنگ اصلی با ترکیب های مختلف به وجود خواهند آمد .

تهیه شده در irprogram