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

html&css

 

در حقیقت کار طراحی قالب سایت شامل سه مرحله می باشد:

۱- ایجاد نمایی از قالب سایت در نرم افزار فتوشاپ

۲- جدا کردن (silce) کردن تصاویر مورد نیاز از فتوشاپ

۳- استفاده از دریم ویور جهت ایجاد کدهای اچ تی ام ال قالب

در ابتدا چگونگی طراحی قالب را در فتوشاپ توضیح می دهیم:

برای این منظور از منوی file گزینه new را انتخاب کرده و یک اندازه دلخواه برای صفحه تنظیم می کنیم مثلا ۱۰۰۰*۱۳۰۰

بعد باید با استفاده از خطوط راهنما  صفحه مورد نظر را بخش بندی کنیم

1

 

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

ادامه مطلب