آموزش طراحی وب‌سایت مگا ریسپانسیو: HTML، CSS، JavaScript - آخرین آپدیت

دانلود Build Mega Responsive Website: HTML, CSS, JavaScript

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

ساخت و راه‌اندازی وب‌سایت حرفه‌ای با HTML، CSS و JavaScript

یاد بگیرید چگونه از ابتدا یک وب‌سایت حرفه‌ای و واکنش‌گرا (Responsive) بسازید و راه‌اندازی کنید. این دوره آموزشی بر روی تکنولوژی‌های کلیدی وب: HTML، CSS و JavaScript تمرکز دارد.

محتوای کلیدی دوره:

  • ساختاردهی حرفه‌ای HTML: ایجاد و سازماندهی اسناد HTML با استفاده از عناصر معنایی (Semantic Elements) و کدنویسی اصولی.
  • طراحی وب با CSS: استایل‌دهی به عناصر HTML برای ایجاد طرح‌بندی‌های مدرن، جذاب و کاملاً واکنش‌گرا.
  • افزودن تعامل با JavaScript: اضافه کردن قابلیت‌های پویا و تعاملی به صفحات وب با استفاده از JavaScript.
  • راه‌اندازی و نگهداری وب‌سایت: تسلط بر فرآیند استقرار و نگهداری یک وب‌سایت مدرن و واکنش‌گرا.

پیش‌نیازها:

  • ویرایشگر متن (Text Editor)
  • مرورگر وب مدرن (Modern Web Browser)
  • درک قوی از HTML و CSS
  • دانش اولیه از JavaScript

به دوره جامع "ساخت وب‌سایت مگا واکنش‌گرا: HTML، CSS، JavaScript (2024)" خوش آمدید!

به دوره "ساخت وب‌سایت مگا واکنش‌گرا: HTML، CSS، JavaScript (2024)" خوش آمدید. در این دوره، مستقیماً به جنبه‌های عملی توسعه وب می‌پردازیم. این دوره هم برای مبتدیانی که اولین قدم‌های خود را در توسعه وب برمی‌دارند و هم برای توسعه‌دهندگان باتجربه که به دنبال ارتقاء مهارت‌های خود هستند، طراحی شده است. تمرکز ما بر کمک به شما برای ایجاد یک وب‌سایت کاملاً واکنش‌گرا و حرفه‌ای، بدون پرداختن به مبانی HTML، CSS و JavaScript است.

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

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

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

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

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


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

به خوش آمدید Welcome

  • مقدمه Introduction

  • نصب و راه‌اندازی Setup

هدر وب‌سایت Website Header

  • شروع کار Getting Started

  • HTML هدر: ایجاد ساختار مارک‌آپ Header HTML: Crafting the Markup Structure

  • ایجاد استایل‌های CSS پیش‌فرض Creating Default CSS Styles

  • استایل‌دهی پس‌زمینه‌ها در هدر Styling Backgrounds in the Header

  • طراحی بنر در هدر Designing Banner in the Header

ناوبری Navigation

  • ایجاد مارک‌آپ HTML ناوبری Creating the HTML Markup of the Navigation

  • طراحی لوگوی وب‌سایت Designing the Logo of the Website

  • استایل‌دهی آیتم‌های ناوبری Styling Navigation Items

  • ایجاد مارک‌آپ HTML اولین دراپ‌داون Creating the HTML Markup of the First Dropdown

  • استایل‌دهی ویژگی‌ها در اولین دراپ‌داون Styling Features in the First Dropdown

  • استایل‌دهی خدمات در اولین دراپ‌داون Styling Services in the First Dropdown

  • کارکرد منوی دراپ‌داون Making the Dropdown Menu Work

  • ایجاد مارک‌آپ HTML دومین دراپ‌داون Creating the HTML Markup for the Second Dropdown

  • استایل‌دهی دومین دراپ‌داون Styling the Second Dropdown

  • ایجاد مارک‌آپ HTML سومین دراپ‌داون Creating the HTML Markup for the Third Dropdown

  • استایل‌دهی سومین دراپ‌داون Styling the Third Dropdown

  • ایجاد مارک‌آپ HTML چهارمین دراپ‌داون Creating the HTML Markup for the Fourth Dropdown

  • استایل‌دهی چهارمین دراپ‌داون Styling the Fourth Dropdown

  • ایجاد مارک‌آپ HTML پنجمین دراپ‌داون Creating HTML Markup for the Fifth Dropdown

  • استایل‌دهی پنجمین دراپ‌داون Styling the Fifth Dropdown

بخش خدمات Services Section

  • ایجاد مارک‌آپ HTML بخش خدمات Creating the HTML Markup for Services Section

  • استایل‌دهی بخش خدمات Styling Services Section

نوبار چسبنده Sticky Navbar

  • ایجاد نوبار چسبنده هنگام اسکرول Creating Sticky Navbar on Scroll

بخش پروژه‌ها Projects Section

  • ایجاد مارک‌آپ HTML پروژه‌ها Creating the HTML Markup for Projects

  • استایل‌دهی هدر پروژه‌ها و ناوبری فیلتر Styling Header of Projects and Filter Navigation

  • استایل‌دهی بسته‌های وب‌سایت Styling Website Packs

  • کارکرد ناوبری فیلتر Making Filter Navigation Work

بخش قالب‌ها Templates Section

  • ایجاد مارک‌آپ HTML بخش قالب‌ها Creating the HTML Markup for Templates Section

  • استایل‌دهی بخش قالب‌ها Styling Templates Section

پخش‌کننده ویدئو Video Player

  • ایجاد مارک‌آپ HTML پخش‌کننده ویدئو Creating the HTML Markup for Video Player

  • استایل‌دهی پخش‌کننده ویدئو Styling Video Player

  • کارکرد دکمه پخش / توقف Making Play / Pause Button Work

  • به‌روزرسانی نوار پیشرفت Updating Progress Bar

  • جابجایی ویدئو به عقب و جلو Skipping Video Backward and Forward

  • کارکرد دکمه صدا Working on Volume Button

  • کارکرد اسلایدر صدا Working on Volume Slider

  • کنترل گزینه‌های سرعت Controlling Speed Options

  • حالت‌های تصویر در تصویر و تمام صفحه Picture in Picture and Fullscreen Modes

  • کارکرد تایم‌لاین ویدئو Working on Video Timeline

  • ایجاد نوار پیشرفت قابل کشیدن Creating Draggable Progress Bar

  • نمایش و پنهان کردن کنترل‌ها Hiding and Showing the Controls

بخش اشتراک Subscribe Section

  • ایجاد مارک‌آپ HTML بخش اشتراک Creating the HTML Markup for Subscribe Section

  • استایل‌دهی بخش اشتراک Styling Subscribe Section

فوتر Footer

  • ایجاد مارک‌آپ HTML فوتر Creating HTML Markup for Footer

  • استایل‌دهی فوتر Styling Footer

اسکرول‌بار سفارشی Custom Scrollbar

  • ایجاد اسکرول‌بار سفارشی Creating Custom Scrollbar

صفحه مشتریان Clients Page

  • سفارشی‌سازی ناوبری Customizing Navbar

  • ایجاد مارک‌آپ HTML بخش نظرات Creating the HTML Markup for Testimonials Section

  • استایل‌دهی بخش نظرات Styling Testimonials Section

صفحه محصولات Products Page

  • ایجاد مارک‌آپ HTML صفحه محصولات Creating the HTML Markup for Products Page

  • استایل‌دهی بخش محتوای محصولات Styling Products Content Section

  • استایل‌دهی بخش پروموی محصولات Styling Products Promo Section

صفحه تماس Contact Page

  • ایجاد مارک‌آپ HTML صفحه تماس Creating the HTML Markup for Contact Page

  • استایل‌دهی بخش تماس Styling Contact Section

صفحه حساب کاربری Account Page

  • ایجاد مارک‌آپ HTML صفحه حساب کاربری Creating the HTML Markup for Account Page

  • استایل‌دهی بخش حساب کاربری Styling Account Section

صفحه قیمت‌گذاری Pricing Page

  • ایجاد مارک‌آپ HTML صفحه قیمت‌گذاری Creating the HTML Markup for Pricing Page

  • استایل‌دهی اشکال Styling Shapes

  • استایل‌دهی هدر Styling Header

  • استایل‌دهی کارت‌های قیمت‌گذاری Styling Pricing Cards

طراحی واکنش‌گرا وب Responsive Web Design

  • واکنش‌گرا کردن پروژه برای صفحه‌های بزرگ‌تر Making Project Responsive for Larger Screens

  • واکنش‌گرا کردن پروژه برای صفحه‌های کوچک‌تر - بخش اول Making Project Responsive for Smaller Screens - Part 1

  • واکنش‌گرا کردن پروژه برای صفحه‌های کوچک‌تر - بخش دوم Making Project Responsive for Smaller Screens - Part 2

  • واکنش‌گرا کردن پروژه برای صفحه‌های کوچک‌تر - بخش سوم Making Project Responsive for Smaller Screens - Part 3

  • ایجاد منوی همبرگری - بخش اول Creating Hamburger Menu - Part 1

  • ایجاد منوی همبرگری - بخش دوم Creating Hamburger Menu - Part 2

  • کارکرد منوی همبرگری Making Hamburger Menu Work

  • واکنش‌گرا کردن پروژه برای تبلت‌ها Making Project Responsive for Tablets

  • واکنش‌گرا کردن پروژه برای تلفن‌های همراه Making Project Responsive for Mobile Phones

استقرار وب‌سایت Deploying Website

  • استقرار وب‌سایت Deploying Website

نمایش نظرات

آموزش طراحی وب‌سایت مگا ریسپانسیو: HTML، CSS، JavaScript
جزییات دوره
14.5 hours
72
Udemy (یودمی) Udemy (یودمی)
(آخرین آپدیت)
884
4.7 از 5
دارد
دارد
دارد
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Code And Create Code And Create

توسعه وب / طراحی وب 'کد و ایجاد' یک شرکت توسعه وب است که متشکل از توسعه دهندگان حرفه ای وب ، طراحان وب و مدرسان آنلاین باتجربه است. 'Code And Create' دوره های آموزشی آنلاین ایجاد می کند. بیشتر آنها پرفروش ترین ها در بستر Udemy هستند. ما در چندین فن آوری و زبان برنامه نویسی مانند HTML5 ، CSS3 ، SASS ، Bootstrap ، Material Design ، JavaScript ، ReactJS ، Angular ، VueJS ، NodeJS ، MongoDB ، PHP ، MySQL ، Python و موارد دیگر تخصص داریم ... "Code And Create" همچنین یک کانال YouTube به نام "Code And Create" را اجرا می کند ، جایی که ما محتوای آموزشی رایگان را در توسعه وب / طراحی / برنامه نویسی ایجاد می کنیم. ما از حضور در اینجا هیجان زده ایم و مشتاقیم دانش و تجربه خود را به اشتراک بگذاریم. مشتاقانه منتظر دیدن شما در دوره های ما هستیم.

George Lomidze George Lomidze

توسعه دهنده/طراح/معلم آنلاین

سلام،

من جورج هستم، یک برنامه‌نویس/طراح وب کامل، یکی از بنیانگذاران 'Code And Create' و نویسنده چندین کلاس در Skillshare.

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

من تصمیم گرفتم دانش و تجربه خود را با جهان به اشتراک بگذارم و این دلیل اصلی حضور من در Skillshare است.

من در فناوری‌های زیر تخصص دارم: HTML، CSS، SASS، Bootstrap، JavaScript، jQuery، React، React Native، NodeJS، Git و موارد دیگر...

منتظر دیدار شما در کلاس‌هایم هستم و به شما کمک می‌کنم تا یک توسعه‌دهنده وب حرفه‌ای شوید.

Lasha Nozadze Lasha Nozadze

توسعه دهنده وب و نرم افزار بنیانگذار 'CodeAndCreate'. سلام من لاشا هستم! من یک توسعه دهنده / طراح وب کاملاً پشته و کاملاً پشته ، مهندس نرم افزار با چندین سال تجربه و نویسنده چندین دوره پرفروش در Udemy هستم. وقتی وارد برنامه نویسی شدم ، حدس زدم که زندگی جدیدی پیدا کرده ام و از آن احساس هیجان می کنم ، زیرا معتقدم برنامه نویسی یکی از داغ ترین زمینه ها در قرن 21 است. تجربه من در توسعه وب شامل فن آوری های زیر است ، مانند HTML5 ، CSS3 ، SASS ، Bootstrap ، JavaScript ، React ، Node.js ، PHP ، MySQL و موارد دیگر ... خوشحالم که به شما گفتم ، تدریس اشتیاق دیگر من شد. من بسیار سپاسگزار و هیجان زده هستم که فرصتی پیدا کردم تا دانش و تجربه خود را با شما در میان بگذارم. من یک شرکت توسعه وب ایجاد کرده ام ، به نام 'CodeAndCreate' ، با دوستم جورج. 'CodeAndCreate' شرکتی است که برای اهداف زیر عمل می کند: "دانش خود را برای بهتر کردن دنیا کدگذاری ، ایجاد و به اشتراک بگذارید!"