آموزش جامع طراحی وبلاگ(قسمت دوم)

2 دیدگاه
در بخش دوم طراحي را شروع مي كنيم

طراحي قالب وبسايت

بخش اول)

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

در ضمن تصاويري كه در ذيل مشاهده مي كنيد،به دليل اجتناب از به هم ريختگي بحث و بالا رفتن حجم صفحه ،نسبت به قالب اصلي داراي مقياس كوچكتري مي باشند و شما بايد اندازه ها را كمي بيشتر در نظر بگيريد.

1.خوب يك سند جديد با عرض px850 و ارتفاع px700 با رنگ پس زمينه ي 262626# ايجاد كنيد.لطفا كليد D رو هم يك فشار بديد.

2.حالا نياز داريم كه يك مستطيل بكشيم.براي اين كار ابزار (rectangle Tool(U را انتخاب مي كنيم و مطابق شكل زير آن را مي كشيم.

در پالت لايه ها روي نام لايه دابل كليك كنيد و اسم آن را به MiddleBlack تغيير دهيد و روي آن راست كليك كرده و از منوي باز شده گزينه ي Rasterize Layer را انتخاب مي كنيم.سپس روي آن دوبار كليك مي كنيم تا پنجره ي Blending Options باز شود.در سمت چپ گزينه ي Drop Shadow را انتخاب كنيد و مطابق شكل زير تغيير دهيد.

در گزينه ي Color Overlay هم رنگ سياه را انتخاب نماييد و OK كنيد.حالا بايد شبيه شكل فوق شده باشد.

3.روي لايه ي MiddleBlack راست كليك كنيد و گزينه ي Duplicate Layer را انتخاب نماييد و در پنجره ي باز شده در كادر As، نام لايه يعني BottomWhite را وارد كنيد و Ok.دقت كنيد كه لايه ي جديد بالاتر از همه و انتخاب باشد.به بخش Blending Option رفته و فقط مقدار Color Overlay را از سياه به سفيد تغيير دهيد و Ok.حالا لايه ي BottomWhite را به پايين لايه ي MiddleBlack منتقل و كوچكتر كنيد.سعي كنيد شبيه تصوير زير باشد و از پايين هم به اندازه ي مناسب فاصله داشته باشد،چون از Drop Shodow استفاده كرده ايم.

در همین رابطه :   افکتی جالب برای زیباتر کردن عکس [با یک فایل psd]

4.دوباره لايه ي BottomWhite را كپي(duplicate) كنيد و نامش را FooterContainer بگذاريد و به بخش Blending Option برويد.تيك DropShadow را برداريد.ولي در بخش Color Overlay،رنگ را به 1E1E1E# تغيير دهيد و oK.حالا لايه ي سفيد محو شده است.در حالي كه لايه ي جديد انتخاب شده است،با فشردن كليد V ،ابزار Move Tool را برگزينيد و به سمت راست لايه حركت كنيد(فقط دستتون).از سمت راست و چپ و پايين كمي مستطيل را به داخل كوچكتر كنيد.فكر كنم شكل بهتر از من توضيح مي دهد.

5.از لايه ي FooterContainer يك كپي ايجاد كنيد و نامش را BodyContainer بگذاريد.با كپي كردن لايه كار ما آسان مي گردد و فقط بايد آن را به بالا منتقل كنيم و كمي ارتفاع اش را زياد كنيم.البته اين كار را بايد مطابق شكل زير انجام دهيد.به بخش Blending لايه رفته و بخش Gradient Overlay را مطابق شكل زير تنظيم كنيد.(با كليك در بخش قرمز،پنجره ي دوم باز خواهد شد).

شكل و موقعيت لايه را در زير مشاهده مي نماييد

مي توانيد نتيجه را با شكل زير مقايسه كنيد و از مناسب بودن اندازه ها مطمئن شويد.

نتيجه كار(براي ديدن اندازه كامل روي عكس كليك كنيد)

به پايان اين بخش رسيديم.در قسمت هاي بعد،اين طراحي را كاملتر خواهيم كرد.

منتظر نظرات شما هستيم.

دسته بندی : طراحي وب

2 نظر

  1. سلام .. آقا علي توقسمت پاراگراف دوم هست كه نوشتيد بايد كليك راست كني و گزينه Rasterize Layer بزني . من هركاري كردم اين گزينه فعال نبود كه روش كليك كنم ..!!! ميشه يكم درموردش توضيح بديد كه چه كار كنم درست بشه ممنون

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *