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

آموزش ویدیویی تبدیل فایل قالب PSD به HTML CSS

سلام دوستان امیدوارم حالتان خوب باشد . همانطور که قولش رو دادم در قسمت دوم آموزش ساخت قالب HTML CSS ، فایل PSD را که ساخته بودیم به یک قالب HTML CSS تبدیل میکنیم .

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

ما در قسمت قبل یک قالب در فتوشاپ طراحی کردیم و در این قسمت آن را به قالب HTML CSS تبدیل میکنیم .

برای مشاهده ی قسمت قبلی اینجا کلیک کنید

فیلم آموزش تبدیل PSD به HTML CSS

باور کنید کار خیلی راحتی هست !

دموی قالب تبدیل شده به HTML CSS

دانلود فایل دمو :

دانلود “دموی قسمت دوم دوره آموزش فارسی ساخت قالب” simpletheme.zip – Downloaded 209 times – 783 KB

فونت iranSans ورژن رایگان است .

در این آموزش تصویری یاد مهارت های زیر را کسب میکنیم :

۱٫تبدیل یک فایل PSD به HTML CSS با مهارت کد نویسی

۲٫استفاده از Flex در CSS

۳٫استفاده از فونت ایکون ها در قالب HTML

۴٫استفاده از فونت های مختلف و پیوست آن ها

۵٫کسب مهارت استفاده از Emmet

و …

لطفا قبل از مشاهده ویدئو بخوانید …

در این آموزش ما از ۲ مهارت جدید استفاده میکنیم .

مهارت اول ساختار emmet میباشد که میتوانید در لینک زیر با ساختار ها آشنا شوید .

ساختار های Emmet.io

مهارت دوم استفاده از Flex می باشد . شاید در این آموزش بنظر شما کار زیادی ایی بیاید ( در حالی که حتی در کدنویسی هم زیادی نیست ) اما انشالله اگر در آینده واکنشگرا کردن قالب کار کنید ، متوجه می شوید بسیار کاربردی میباشد !

یک آموزش معتبر برای یادگیری Flex Box

دانلود آموزش ویدیویی

این آموزش توسط بنده ضبط شده است و اگر کمی یا کاستی ایی دارد به بزرگی خودتان ببخشید .

مدت این آموزش ۱ ساعت میباشد و حجم فایل mp4 حدود  ۱۳۰ مگ میباشد ، برای همین بنده آن را در یک فایل rar با ۳ پارت برای دانلود شما عزیزان آپلود کرده ام .

کیفیت ویدیوی آموزشی ۷۲۰p می باشد .

 

پارت اول :

دانلود “قسمت دوم آموزش ساخت قالب - پارت 1” Creating%20simple%20HTML%20CSS%20Theme%20-%20Part%202.part1.rar – Downloaded 446 times – 50 MB

پارت دوم :

دانلود “قسمت دوم آموزش ساخت قالب ساده - پارت دوم” Creating%20simple%20HTML%20CSS%20Theme%20-%20Part%202.part2.rar – Downloaded 409 times – 50 MB

پارت سوم :

دانلود “قسمت دوم آموزش ساخت قالب ساده - پارت سوم” Creating%20simple%20HTML%20CSS%20Theme%20-%20Part%202.part3.rar – Downloaded 403 times – 16 MB

 

 

بر چسب های پست : , , , , ,
مطالب مرتبط
سلام دوستان امیدوارم حالتان خوب باشد . طی درخواست های شما ، ما یک دوره ی آموزشی ...
۱۲ دی ۹۴
8 دیدگاه
17 دیدگاه برای “آموزش ویدیویی تبدیل فایل قالب PSD به HTML CSS”
  1. alireza_ghafari گفت:

    سپاس ، عالی بود ☺

  2. reza گفت:

    سلام دوستان خسته نباشین

  3. reza گفت:

    دوستان لطفا تگ های ساخت سایت رو بهم بگین تو اچ تی ام ال ممنون میشم از کمکتون۰۹۰۱۲۳۷۶۶۲۸

    1. هر سایت نیاز به یک سری تگ داره که باید طبق نیاز از تگ ها استفاده کنید .

      تگ ها یک ابزار اند و فقط با تگ ها نمیتوان سایتی طراحی کرد .

      اما اگر قصدتون استاندارد نویسی هست از html5 cheatsheet ها استفاده کنید

  4. ali گفت:

    با سلام ببخشید این قالب الان html و css باهم هستند یعنی css جدا گونه نیست و اینطوری قالب رو نمیتونن بردارن؟؟؟
    ممنون میشم جوابمو بدید و اموزش واکنشگرا کردن قالب رو اموزش نمیدید؟؟؟

    1. قالب رو با هر روشی که فکرش رو بکنید میتونند بردارند ، دنبال روه حل نباشید .
      آموزش ریسپانسیو انشالله هر چه زود تر به صورت ویدیویی آماده میکنم

  5. Sahab1991 گفت:

    سلام ،مرسی از اموزش خوبتون ، لطفا اموزشو همینو سه ستونش هم بزارین و البته ریسپانسیو

  6. mmmmm گفت:

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

    1. tatality81 گفت:

      برای ساخت قالب وبلاگ میهن بلاگ از این آدرس استفاده کنید
      لینک : http://dl.sourcebaran.com/download/299/Mihan%20Blog%20%28www.sourcebaran.com%29.rar
      حجم : ۲۵۶MB
      منبع : سورس باران

  7. TheNightowl گفت:

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

    1. سلام این فایل ها جداگانه نیستند و باید تمام قسمت ها رو با هم اکسترکت کنید

  8. erfan گفت:

    salam kheili khub bud vali age mikhayn badan amuzeshe responsive ro bezarin yekam arum tar begin kheili soratetun balas merc

  9. amir muhammad گفت:

    سلام میشه آموزش ریسپانسیو کردن همین قالب رو هم بزارین

  10. sepehr333 گفت:

    چرا نمیتونم از زیپ خارج کنم؟
    لطفا جواب بدید.

  11. Niloofar گفت:

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

پاسخ دهید

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

ورود به حساب کاربری
بستن این پنجره