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

پیش نیاز : آموزش مقدماتی فتوشاپ

فتوشاپ را اجرا کنید

1. یک صفحه به ابعاد 136×674 با رزولیشن 300 ایجاد کنید .

2. بر روی لایه کادر کشیده شده دابل کلیک کرده و تنظیمات گزینه Gradient Overlay را با توجه به تصویر زیر تغییر بدهید .

3. یک لایه جدید بالای لایه اول ایجاد کنید

4. سطل رنگ را در مرحله بعدی انتخاب کرده و در نوار ابزار بالای صفحه گزینه Pattenr را با توجه به تصویر زیر انتخاب کرده و یکی از بافت های پیش فرض را بر روی لایه دوم که ایجاد کرده ایم اعمال می کنم .

5. مد لایه را برابر با Overlay و تنظیمات Opacity را برابر با 30 درصد قرار بدهید .

6. در مرحله بعدی ابزار تایپ را انتخاب کرده و یک عنوان به دلخواه بالای صفحه با رنگ سفید تایپ میکنم . فونت پیش فرض : farnaz

7. بر روی لایه متن تایپ شده دابل کلیک کرده و تنظیماتی که در تصاویر زیر مشخص شده است را تغییر بدهید

8. با ابزار تایپ زیر متن اصلی یک متن دیگر با درصد رنگی fbc763 و با Strok یک پیکسلی تایپ میکنم

9. ابزار Custome Shape Tool را انتخاب کرده و یک تصویر را به دلخواه بالای متن تایپ شده قرار میدهم . درصد رنگی شکل کشیده شده : fdd104

10.در مرحله بعدی ابزار Line Tool را انتخاب کرده و دو خط زیر هم با درصد رنگی های 410e0f و 733839 میکشم .

11. در مرحله آخر نوبت میرسه به منوهای زیر لوگو . من به دلخواه 4 لینک در زیر لوگو تایپ میکنم .درصد رنگی : dfdddd

رمز فایل : www.asarayan.com
برای دانلود فایل PSD + PDFکلیک کنید || لینک دانلود فایل PSD+PDF :سرورمستقیم