• illustrator Curse
  • 7Learn Android Course
  • 7Learn SEO Course
  • 7Learn WP Theme Course

    حرفه ای ترین دوره آموزش طراحی قالب وردپرس



  آیا می دانید با دوره های آموزشی سون لرن می توانید از 0 تا 100 طراحی وب را در منزل فراگیرید!

آموزش طراحی قالب (فصل اول - جلسه اول) : مقدمه

33029 ۲۲ خرداد ۹۲

مقدمه


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

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

پیش نیاز ها


طراحی قالب نیز همانند خیلی از چیزهای دیگه نیاز به پیش نیازهایی داره و حتما اول باید این پیش نیاز ها رو فراهم کنید، تا که بتونید به راحتی قالب مورد نظرتون رو بدون هیچ مشکلی طراحی کنید.خب حالا پیش نیازهایی که لازمه داشته باشید رو اینجا میگم:

  • آشنایی با دو زبان HTML و CSS : مهمترین و اصلی ترین پیش نیازی که برای طراحی قالب نیاز دارین آشنایی با این دو زبان تحت وب هست. هر قالبی که تا به حال دیدین، حداقل با استفاده از این دو زبان طراحی شده، و اگر با این دو زبان آشنایی نداشته باشید، حتما طراحی قالب کار انجام نشدنی خواهد بود. با اینکه سعی میشه هر کدی که قرار میدم رو به طور کامل کار و کاربردشو رو توضیح بدم اما با این حال اگر با این زبان ها آشنایی ندارین میتونید آموزش هاشون رو از اینجا بخونید.
  • آشنایی با نرم افزار فتوشاپ : قبل از طراحی هر قالب همیشه سعی کنید که شکل و شمایل اون رو اول در نرم افزار فتوشاپ طراحی و سپس طبق طرحی که دارین جلو برید، این طوری طراحی قالب طبق یه طرح اولیه و مکان هر قسمت از سایت از قبل تعیین شده خواهد بود. ما هم در این آموزش در اول قالب مورد نظرمون رو در نرم افزار فتوشاپ طراحی و بعد شروع به تبدیل اون به کدهای HTML و CSS می کنیم.
  • نرم افزار ویرایشگر کد : با اینکه میتونید از ویرایشگر خود ویندوز (notepad) هم استفاده کنید، اما با این حال نرم افزارهای زیادی هم برای اینکار وجود داره، که معروف ترین آنها دریم ویو و ... هستند، تا که نوشتن کدها خیلی سریعتر انجام بشه، در این آموزش بنده از نرم افزار notepad++ برای ویرایش کدها استفاده می کنم.
  • مرورگر صفحات وب : برای دیدن کدهایی که با دو زبان html و css نوشتیم باید از یکی از مرورگرهای صفحات وب (ie-firefox-opera-chrome) استفاده کنیم، بنده در این آموزش از مرورگر chrome استفاده می کنم، درضمن حتما سعی کنید که از آخرین ورژن اون مرورگر استفاده کنید.

توضیحاتی در مورد قالب


قالبی که طراحی خواهیم کرد یک قالب سه ستونه هست، و سعی می کنم، امکانات عمومی که در هر قالب وجود داره رو در این قالب قرار بدیم. در جلسات بعد که قالب رو در نرم افزار فتوشاپ طراحی خواهیم کرد میتونید اون امکانات رو ببنید، در ضمن میتونید شکل قالب رو بعدا به سلیقه خودتون تغییر بدید.
طراحی قالب ما در چهار مرحله انجام میشه :

  • قسمت اول : گرافیک قالب ( طراحی گرافیکی قالب در نرم افزار فتوشاپ)
  • قسمت دوم : برش طرح ( برش دادن تصاویر برای استفاده در کدها)
  • قسمت سوم : کدهای HTML ( نوشتن کدهای html و تعیین ساختار صفحه )
  • قسمت چهارم : کدهای CSS ( شکل دهی به کدهای html با استفاده از کدهای css)

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

:: مطالب جدید سون لرن را از طریق ایمیل دریافت کنید :

دیدگاه ها 46 دیدگاه برای این مطلب ارسال شده است. نظردهی برای این مطلب بسته شده است .

  • ‏‏

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

    • ‏‏
      سجاد دریس(۲۲ فروردین ۱۳۹۳)

      سلام. اگه اکانت جیمیل داشته باشید می تونید به این آدرس مراجعه کنید و فایل هاتون رو اونجا آپلود کنید

  • ورود/عضویت سریع با اکانت فیسبوک/جیمیل شما

    :: شما می توانید با استفاده از اکانت یاهو یا جیمیل خود به صورت کاملا امن، سریع و بدون نیاز به ورود اطلاعات عضو و وارد سایت شوید. در این صورت هیچ نیازی به ورود نام کاربری و رمز عبور خود نخواهید داشت و هویت شما از طریق ایمیلتان مورد تائید قرار می گیرد .
    برای استفاده از این روش باید در اکانت گوگل(جیمیل) و یا یاهوی خود لاگین باشید .
    عضویت/ ورود سریع با :
    در حال اتصال ...

    ورود به سایت

    ورود سریع با :
    در حال اتصال ...

    جستجو در سون لرن

    عبارت :
    7LearnTelegram