قراره تو این دوره چی یاد بگیرم؟

  • آموزش کامل تگ های HTML
  • بررسی تخصصی زبان CSS
  • کار با تگ های مفهومی HTML 5
  • پیاده سازی پروژه واقعی وبسایت هاستینگ
  • و...
میلاد علیزاده وکیلی

میلاد علیزاده وکیلی

برنامه نویس فرانت اند

توسعه دهنده سایت با وردپرس

برنامه نویس PHP

متخصص کانفیگ و نگهداری سرور

و ....

سرفصل های دوره

۴ فصل
۱۰۰ جلسه
۱۹ ساعت
۱

معرفی دوره آموزش HTML CSS

۵ قسمت
۰۰:۵۵:۱۱
1

معرفی زبان HTML و دلیل استفاده از آن

رایگان
۰۷:۴۵
2

آشنایی با ساختار کلی زبان HTML

رایگان
۰۹:۵۲
6

تصاویر مورد استفاده در دوره

۲

آموزش کامل و جامع زبان های HTML و CSS

۰۹:۰۰:۵۷
۳

پروژه طراحی ظاهر وبسایت هاستینگ

۰۸:۴۷:۰۳
۴

سورس پروژه طراحی شده در دوره

-

دوره آموزش HTML CSS

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

برای متخصص شدن در طراحی سایت، اولین و مبتدی ترین گام، دقیقا آموزش html css میباشد

آنچه در دوره آموزش HTML و CSS می‌آموزیم

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

سرفصل های دوره آموزش HTML CSS

  • تعریف HTML ، CSS و نصب نرم افزار برای شروع کد نویسی
  • یادگیری ساختار HTML و شروع کد نویسی
  • استفاده از تگ های heading, title, paragraph
  • آموزش تگ a با چندین مثال جهت درک بهتر
  • اضافه کردن فایل استایل به پروژه
  • آموزش class و id در css
  • انواع استایل دهی به تگ های html
  • بررسی تگ های img و figure در html و width , height در css
  • آموزش کامل div float background-color
  • خصوصیات margin, padding, border
  • تگ ol , ul در html و display و list-style در css
  • آموزش کامل بخش display وطراحی منو جذاب وشیک
  • کار با تگ table
  • طریقه استفاده از position
  • آموزش کار با تگ form
  • پخش موزیک با تگ audio
  • آموزش استفاده از تگ video
  • شروع HTML5 و header, footer, section, nav, aside, article
  • آموزش تگ figure و جلسه ی اول از تمرین تگ های html 5
  • کار با تگ abbr
  • طریقه استفاده از تگ های bdo, bdi, hr, address
  • آموزش تگ b و strong در html و font-weight در css
  • استفاده کامل از inspect element مرورگر
  • آموزش hover focus active در css
  • تگ توضیحات و base و blockquote
  • کار با تگ del details dfn embed
  • آموزش border-radius در css
  • استفاده از text-shadow, box-shadow در css
  • کار با after, before & boxsizing در css
  • آموزش مبحث filter ها در css
  • تگ های opacity , overflow در css
  • آموزش font در css
  • شیوه کار با transition در css
  • آموزش min-width , max-width , min-height , max-height , line-height , text-align-last در css
  • استفاده از white-space و over-flow در css
  • آموزش animation در css
  • بهره گیری از کتابخانه fontawesome
  • آموزش background-blend-mode در css
  • طریقه استفاده از  background-position , background-attachment , background-repeat در css
  • آموزش text-decoration-style , text-decoration-color
  • شیوه کامنت گذاری در css
  • استفاده از تگ ins در css
  • کار با تگ mark در html
  • استفاده از تگ figcaption در html
  • کار با تگ q در html
  • آشنایی با ویژگی all در css
  • آشنایی با cursor در css
  • آموزش ویژگی vertical-align در css
  • آشنایی با ویژگی scroll-behavior در css
  • ویژگی user-select در css
  • کار با visibility در css
  • شروع انجام پروژه حرفه ای شامل 33 قسمت

منابع مورد استفاده در دوره

نرم افزار مورد استفاده در دوره

نرم افزار مورد استفاده در دوره، نرم‌افزار Visual Studio Code یا به اختصار VSCode است. این نرم‌افزار بسیار سبک و کاربردی است و برای نصب آن تنها به 1.6 گیگاهرتز CPU و یک گیگابایت رم نیاز دارید. اگر سیستم‌عامل شما ویندوز است، نسخه 7 به بالا کافی است تا بتوانید این نرم‌افزار را به راحتی نصب و استفاده کنید. جهت آشنایی کامل با نرم افزار VSCode و کار با آن، می‌توانید در دوره آموزش vs code رایگان شرکت نمایید.

پیش نیاز های دوره آموزش HTML CSS

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

مدت زمان دوره چرا اینقدر زیاد است؟

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

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

هدف از دوره آموزش HTML و CSS

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

پشتیبانی این دوره به چه شکلی خواهد بود؟

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

دوره ی آموزش html css برای چه افرادی مناسب است؟

  • برای اشخاصی که به فکر راه اندازی کسب و کار آنلاین و مجازی خود هستند
  • افرادی که میخواهند توانایی طراحی هر وبسایتی رو داشته باشند.
  • کسانی که می خواهند توانایی تغییر ظاهری تمامی قسمت های وردپرس را داشته باشند.
  • افرادی که میخواهند وارد دنیای درآمدزایی از طریق پروژه های طراحی سایت شوند.
  • اشخاصی که خدمات طراحی سایت میدهند، و میخواهند سطح پروژه های طراحی سایت خود را افزایش دهند.

پروژه محور بودن آموزش اچ‌تی‌ام‌ال و سی‌اس‌اس

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

آموزش HTML CSS

تصویر پروژه آموزش داده شده در دوره

مطمئن باشید که در این پروژه با چالش های بسیاری مواجه خواهید شد و تجربه ی کافی برای طراحی هر پروژه ای رو به دست خواهید آورد.

دوره آموزش HTML و CSS یک رزومه کامل است

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

HTML چیست؟

HTML مخفف عبارت “Hyper Text Markup Language” به معنای “زبان نشانه‌گذاری ابرمتن” است. برخلاف زبان‌های برنامه‌نویسی که شامل شروط، حلقه‌ها و ساختارهای پیچیده‌ای مثل if و else هستند، HTML یک زبان نشانه‌گذاری مبتنی بر متن است. HTML به شما این امکان را می‌دهد تا ساختار و اسکلت یک وب‌سایت را ایجاد کنید. به عبارت دیگر، این زبان مسئول سازمان‌دهی محتوای وب‌سایت است و بخش‌های مختلف مانند متن، تصاویر و ویدئوها را در قالب مناسب قرار می‌دهد.

تفاوت HTML با زبان‌های برنامه‌نویسی

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

تاریخچه و نسخه‌های HTML

HTML 1.0 (1991)

اولین نسخه‌ی HTML در سال 1991 توسط تیم برنرز-لی معرفی شد. این نسخه شامل 18 تگ ساده بود و به عنوان یک زبان پایه برای ایجاد وب‌سایت‌ها مورد استفاده قرار می‌گرفت. HTML 1.0 فقط قابلیت‌های ابتدایی را ارائه می‌داد و به شدت محدود بود.

HTML 2.0 (1995)

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

HTML 3.2 و 4.01 (1997 و 1999)

در سال 1997، نسخه‌ی HTML 3.2 منتشر شد که با استانداردهای جهانی سازگار شد. این نسخه تحولی بزرگ در زبان HTML به وجود آورد و همراه با CSS معرفی شد.

در سال 1999، نسخه‌ی HTML 4.01 منتشر شد که با پشتیبانی بهتری از مالتی‌مدیا و قابلیت‌های چندرسانه‌ای، امکان کار با تصاویر، ویدیوها و سایر رسانه‌ها را به طراحان وب داد. این نسخه باعث شد وب‌سایت‌ها تعاملی‌تر و جذاب‌تر شوند.

HTML5 (2014)

آخرین و پیشرفته‌ترین نسخه‌ی HTML، یعنی HTML5، در سال 2014 منتشر شد. این نسخه تغییرات بزرگی را در زبان HTML به وجود آورد و یکی از مهم‌ترین ویژگی‌های آن اضافه شدن تگ‌های جدیدی مثل footer، header و section بود. این تگ‌ها به طراحان وب این امکان را می‌دهند که ساختار وب‌سایت‌ها را به صورت بهینه‌تر و منظم‌تر ایجاد کنند.

HTML5 نه‌تنها باعث بهبود تجربه‌ی کاربری وب‌سایت‌ها شد، بلکه تاثیر مثبتی بر سئو (بهینه‌سازی برای موتورهای جستجو) گذاشت. با استفاده از تگ‌های معنایی جدید، موتورهای جستجو مثل گوگل بهتر می‌توانند محتوای وب‌سایت‌ها را درک کنند و این امر به بهبود رتبه‌بندی وب‌سایت‌ها در نتایج جستجو کمک می‌کند.

اهمیت HTML5 در سئو و بهینه‌سازی

یکی از ویژگی‌های کلیدی HTML5 این است که با تگ‌های معنایی جدید خود، به بهبود سئو وب‌سایت‌ها کمک می‌کند. این تگ‌ها، مانند header، footer و article، به موتورهای جستجو کمک می‌کنند تا بهتر متوجه شوند هر بخش از وب‌سایت چه کاربردی دارد. این ویژگی باعث می‌شود که رتبه‌ی وب‌سایت شما در نتایج جستجو بهبود پیدا کند و ترافیک بیشتری به سایت شما جذب شود.

CSS چیست؟

CSS مخفف عبارت “Cascading Style Sheets” است و وظیفه‌اش اعمال استایل‌ها (رنگ‌ها، فونت‌ها، اندازه‌ها و محل قرارگیری عناصر) بر روی HTML است. به عبارتی، CSS به HTML “روح” می‌بخشد و تعیین می‌کند که هر عنصر در وب‌سایت چگونه نمایش داده شود.

تصور کنید یک وب‌سایت بدون CSS دارید. در این حالت، تنها ساختار و متن‌های وب‌سایت را خواهید دید؛ اما همه چیز بی‌نظم، ساده و بدون جذابیت خواهد بود. CSS این امکان را فراهم می‌کند که هر عنصر از صفحه وب‌سایت شما دقیقاً در جای درست خود با ظاهر زیبا و اندازه مناسب نمایش داده شود.

اگر CSS را از یک سایت حذف کنیم، همچنان اسکلت سایت (که با HTML ساخته شده) وجود خواهد داشت، اما رنگ‌آمیزی‌ها، اندازه‌ها و محل قرارگیری‌ها از بین می‌رود و سایت بسیار ابتدایی به نظر خواهد آمد. در نتیجه، CSS اهمیت زیادی در تجربه کاربری و زیبایی سایت دارد.

وظایف اصلی CSS

  • رنگ‌آمیزی و استایل‌دهی: CSS تعیین می‌کند که هر بخش از وب‌سایت با چه رنگی نمایش داده شود.
  • اندازه‌دهی: CSS مشخص می‌کند که هر عنصر در چه اندازه‌ای باشد (متون، تصاویر، بخش‌ها و…).
  • تعیین موقعیت عناصر: CSS وظیفه دارد که مشخص کند هر عنصر دقیقاً در چه قسمتی از صفحه قرار گیرد.
  • بهبود تجربه کاربری: CSS به شما این امکان را می‌دهد که وب‌سایت‌هایی با طراحی ریسپانسیو (Responsive Design) ایجاد کنید که در دستگاه‌های مختلف به درستی نمایش داده شوند.
ادامه متن دوره ...

نظرات دانشجویان

bestuser

bestuser

دانشجوی دوره

سلام و درود بر شما
با تشکر از دوره خوبتون

مدرک معتبر دو زبانه

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

مدرک فارسی مدرک انگلیسی

سوالات متداول

تا چه زمانی به محتوای دوره آموزش html css دسترسی خواهیم داشت؟

شما می توانید به صورت دائمی به محتوای این دوره آموزشی دسترسی داشته باشید. همچنین اگر آپدیت جدیدی روی این دوره لحاظ شود به محتوای آپدیت شده نیز دسترسی خواهید داشت.

آیا در صورت تهیه دوره، مدرک شرکت در دوره آموزش مقدماتی html css دانشجویار به من تعلق می گیرد؟

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

بستر برگزاری دوره آموزش html css دانشجویار کجاست؟

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