آموزش طراحی وب

مدرسه مجازی ایرانیان

دسته بندی موضوعات
سفارش تبلیغات

شروع فصل پروژه ی عملی html

camera-app-icon-ramotion-small_1x

فصل پنجم (پروژه عملی در HTML)

فیلم آموزشی تبدیل psd به html

سلام خدمت همراهان عزیز مدرسه مجازی ایرانیان

دوستانی که منتظر بودید به امید خدا دیگه استارت این فصل زده شد 🙂 در این دوره ی آموزشی رایگان ، شما تبدیل psd به html5,css3 رو با ویدئو های آموزشی طی چند جلسه میاموزید.

تصمیم گرفتم در این جلسه ابتدا قالب psd رو بهتون معرفی کنم. تصویر زیر یه قالب ساده هست که قراره در این فصل با html5 و css3به کد تبدیلش کنیم.

learn

برای مشاهده تصویر بزرگ روی تصویر کلیک کنید

 

در ابتدای شروع فصل اول html به شما دوستان قولی داده بودم، اونم این بود که در انتهای بخش html بعد از یادگیری عناصر html و خاصیت ها و سلکتورهای css همه ی این موارد رو در قالب یه پروژه ی عملی بهتون آموزش بدم تا از این موارد درک بهتری داشته باشید.

هدف از این فصل ، آموزش نحوه ی استفاده از کدهای html و سلکتورهای css که تاکنون در مدرسه مجازی ایرانیان یاد گرفتید، می باشد و سعی بر این کردیم که نکات مهم و کلیدی رو در این پروژه خدمتتون آموزش بدیم.

همونطور که در تصویر هم مشاهده می کنید، در فیلم های آموزشی تکنیک های زیر آموزش داده میشود:

۱- معرفی ابزارهای طراحی وب

۲- لایه بندی در html5

۳- رنگ ها

۴- Box Model

۵- Box-sizing

۶-  opacity

۷-  چیدمان عناصر با استفاده از float و position

۸-  نحوه ی استفاده از z-index

۹-  Hover بر روی عناصر

۱۰- Transition

۱۱- Transform

۱۲- نحوه ی استفاده از از nth-child ها و …

۱۳- لیست ها

۱۴- نحوه ی استفاده از فونت آیکون ها

۱۵- نحوه ی استفاده از انیمیشن های css با animate.css

۱۶- و …

در انتهای هر جلسه هم فیلم آموزشی و فایل های پروژه در اختیار شما قرار میگیره و میتونید خودتونم تمرین کنید.

پس ما با همراه باشید …

تهیه شده در مدرسه مجازی ایرانیان

<<

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



سفارش تبلیغات

گردآوری و تالیف : میترا رحیمی

بنیانگذار و نوسنده در مدرسه مجازی ایرانیان و سردبیر ماهنامه طراحی وب همچنین مدرس و مسلط به برنامه نویسی سمت سرور با PHP MVC و برنامه نویسی سمت کلاینت با html 5 , css3 , jquery , مبانی سئو و سیستم مدیریت محتوای وردپرس

خوراک خوشمزه و علمی روزانه
با وارد کردن ایمیلتون در فیلد روبرو آموزش های جذاب و vip دریافت نمایید

آموزش های مرتبط با این مطلب

دیدگاه های مخاطبین

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

  • ayat khazaei

    ممنون از زحمات شما . منتظر انتشار آموزش هستیم

  • مریم فراهانی

    سلام ممنون از اموزش های خوبنتون من همیشه یه سر به سایت میزنم ببینم جدید چی گذاشتین این مطلب از موضوعات مورد علاقه منه موفق باشید.

  • وحید محمودی

    درود

    ممنونم از شما به خاطر این کار ارزشمند ، فقط می فرمایید که آموزش در پست های مجزا قرار می گیره یا در سیستم های آموزش آنلاین قراره برگزار بشه ؟

    • میترا رحیمی

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

  • ابوالفضل ویسی

    خانم رحیمی کی مسابقه طراحی وب ( کدنویسی ) شروع میشه ؟
    ممنون که دارین دنیای طراحی وب رو توسعه میدین
    ما منتظریم …

    • میترا رحیمی

      سلام دوست عزیز
      انشالله در نسخه های ۸ به بعد ماهنامه طراحی وب این مسابقه برگزار میشه. داریم سیستمش رو طراحی میکنیم.

  • kashiri

    بی وفقه ما منتظر آموزشتون هستیم باتشکر از زحمات شما

  • امیرعباس

    ممنونم فقط اگه ممکنه حجم فیلم بیشتر از ۲۰۰ مگ نشه چون خیلیا سرعت بالا و شایدم حجم ندارن با تشکر

    • میترا رحیمی

      سلام دوست عزیز
      سعی میکنم فیلم هارو کوتاه رکورد کنم که دوستان به مشکل برنخورن.
      موفق باشید.

  • محمدامین

    بی صبرانه منتظریم

  • مهران یاری

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

  • محسن صالحی

    سلام و خسته نباشید
    من یه فارغ و التحصیل رشته نرم افزارم
    مدتیه که بیکارم، میخواستم از طریق وب نویسی واسه خودم کار و کاسبی راه بندازم، ولی از اونجایی که تو دانشگاه های ما چیز خاصی یاد نمیدن، من هم اصل ماجرا رو بلد نیستم (اصل ماجرا یعنی یکی از زبانهای PHP و ASP.NET)
    خیلی دوست دارم اینارو یاد بگیرم، این دو زبان رو واسه ازتباط با پایگاه داده و نوشتن صفحه ی ادمین خیلی نیاز دارم
    تو سر فصلهای آموزش حضوریتون هم نبود و فقط از طریق سیستم مدیریت محتوا کار رو پیش میبرید
    از اینها فیلم آموزشی یا مقاله آموزشی نمیذارید؟!!

    • میترا رحیمی

      سلام دوست عزیز
      اگر بخش php رو دنبال کنید به زودی این مباحث مطرح میشه . اما اگر عجله دارید بهتره کلاس آموزشی برید و یا یک pdf آماده مطالعه کنید .

  • محسن صالحی

    سلام مجدد
    متشکرم از پاسخگوییتون
    شما جایی رو میشناسید که نهایت طی یک ماه به آموزش این مباحث بپردازند؟

    • میترا رحیمی

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

  • محسن

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

    • میترا رحیمی

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

  • حسین ایماندار

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

  • علی

    سلام ، من خیلی وقته منتظرم تا این بخشو کامل کنید ؛ هر سری سر میزنم میبینم هنوز این آموزشو نذاشتین 🙁
    خیلی ها مثل من منتظرن …

  • علی

    سلام اگه فیلم گارگاه های آموزشیتون رو برای فروش بذارید خیلی خوب میشه خب خیلی ها هستن نمیتونن بیان تهران ، دوره های مجازی هم من متوجه نشدم چجوریه … ولی فکر نکنم بهتر از رکورد کلاس هاتون باشه!

  • امیر محمدی

    سلام
    لینک های دانلود رو کی قرار میدید؟
    ممنون

    • میترا رحیمی

      سلام دوست عزیز
      انشالله به زودی …
      موفق و پاینده باشید

  • امیر محمدی

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

    • میترا رحیمی

      سلام دوست عزیز
      میتونید با دفتر ۷۷۶۰۱۸۹۵ تماس بگیرید و از آقای همت یار مشاوره بخواین .
      موفق و پاینده باشید.

  • ndrndr053@yahoo.com

    خیلی خوبه
    منتظریم……

  • محسن صالحی

    سلام
    چرا “فیلم آموزشی تبدیل psd به html” رو نمیذارید؟!!!
    میدونید چند وقته منتظریم

  • امیر

    سلام
    این آموزش چه زمانی بر روی سایتتون قرار میگیره ؟
    باتشکر از شما و همکاران محترمتان

  • hosseiniam

    سلام.اول مرسی واسه وقتی که میذارین و آموزش هارو روی سایت قرار میدید
    دوم اینکه این آموزش پروژه عملی کی میاد رو سایت؟؟؟

    • میترا رحیمی

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

  • erfan amiri

    سلام
    باتشکر از زمانی که جهت این آموزش های کاربردی و عالی گذاشتید
    منتظر انتشار پروژه عملی هستیم

  • علیرضا کریمی نژاد

    بی صبرانه منتظر این آموزش هستم
    با تشکر از زحمات بی شائبه شما خانم رحیمی

  • بهرام

    دست شما درد نکنه عالی بود واقعا زحمت کشیده بودی

  • مسعود رحیمی

    با عرض سلام و خسته نباشید.مدت زمان زیادی میگذره که قراره این آموزش بیاد و ما همچنان منتظریم.اگه قرار نیست این آموزش منتشر بشه اطلاع رسانی کنید که ما انقدر منتظر نمونیم
    با تشکر

    • میترا رحیمی

      سلام دوست عزیز

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

      ان شالله در ماه آتی این کار رو شروع می کنیم .

      موفق باشید

  • محمد

    سلام.
    هنوز نذاشتید؟
    وقتی داشتم پست رو میخوندم خیلی خوشحال شدم وقتی اومدم نظرات رو خوندم فهمیدم هنوز نذاشتید.
    یا علی

  • عباس پله

    سلام. پس چی شد؟
    ۲ سال گذشته از این وعدتون…

  • آرش قربانی

    ببخشید لینک دانلود کجاست؟

  • امین آزموده

    با سلام و وقت بخیر
    آیا این مطلب دارای فیلم می باشد ؟ پس چرا لینک ندارد

وبلاگ مدرسه

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

مدرسین مدرسه

  • حسین همت یار

    حسین همت یار

    مدرس ، طراح رابط کاربری وب و موبایل با 8 سال سابقه ی فعالیت حرفه ای

سوابق کامل

آخرین پرسش و پاسخ ها

آخرین پرسش و پاسخ ها
شما هم سوالی دارید ؟