آموزش HTML5 + CSS3 + Bootstrap: دوره طراحی وب مبتدی

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

خوش آمدی Welcome

• به دوره آموزشی HTML5 + CSS3 + 3 نکته برای یادگیری بهتر خوش آمدید Welcome to the HTML5 + CSS3Course + 3 Tips for Better Learning

• نحوه نصب براکت و شروع ویرایش وب سایت ها در برنامه نویسی HTML5 + CSS3 How to Install Brackets & Start Editing Websites in HTML5 + CSS3 Programming

• دانلود: برگه های تقلب HTML | دوره برنامه نویسی HTML5 + CSS3 DOWNLOAD: HTML Cheat Sheets | HTML5 + CSS3 Programming Course

• سلام سریع از فیل | دوره برنامه نویسی HTML5 + CSS3 Quick Hello from Phil | HTML5 + CSS3 Programming Course

• نکاتی برای بهبود تجربه دوره آموزشی | دوره برنامه نویسی HTML5 + CSS3 Tips to Improve Your Course Taking Experience | HTML5 + CSS3 Programming Course

HTML 5 HTML 5

• معرفی بخش HTML | دوره برنامه نویسی HTML5 + CSS3 Intro to the HTML Section | HTML5 + CSS3 Programming Course

• HTML چیست؟ ببینید چگونه از آن در همه جا استفاده می شود! | دوره برنامه نویسی HTML5 + CSS3 What is HTML? See how it's used EVERYWHERE! | HTML5 + CSS3 Programming Course

• مطالعه موردی: تغییر توییت های رئیس جمهور | دوره برنامه نویسی HTML5 + CSS3 Case Study: Changing the President's Tweets | HTML5 + CSS3 Programming Course

• راه اندازی یک فایل HTML جدید و استفاده از برچسب ها | دوره برنامه نویسی HTML5 + CSS3 Start a New HTML File & Use Tags | HTML5 + CSS3 Programming Course

• تگ های هدر در HTML5 + CSS3: نحوه استفاده از آنها + دلیل اهمیت آنها Header Tags in HTML5 + CSS3: How to use them + why they are important

• مطالعه موردی: استفاده از تگ های سربرگ برای بهبود سئو | دوره برنامه نویسی HTML5 + CSS3 Case Study: Using Header Tags to Improve SEO | HTML5 + CSS3 Programming Course

• HTML5 + CSS3 ویرایش متن: فاصله، سبک ها، پاراگراف ها و موارد دیگر! HTML5 + CSS3 Edit Text: Spacing, Styles, Paragraphs and more!

• پیوندها: ایجاد پیوندهای مبتنی بر متن قابل کلیک | دوره برنامه نویسی HTML5 + CSS3 Links: Create Clickable Text-based Hyperlinks | HTML5 + CSS3 Programming Course

• تصاویر: اضافه کردن تصاویر به وب سایت خود با HTML | دوره برنامه نویسی HTML5 + CSS3 Images: Add Images to Your Website with HTML | HTML5 + CSS3 Programming Course

• مطالعه موردی HTML5 + CSS3: یک تصویر قابل کلیک به وب سایت من اضافه کنید HTML5 + CSS3 Case Study: Add an Clickable Image to My Website

• لیست ها: با HTML لیست های Bullet-Point و Numbered ایجاد کنید Lists: Create Bullet-Point and Numbered Lists with HTML

• چالش تمرین 1: اولین وب سایت پایه خود را با HTML بسازید Challenge Exercise 1: Build Your First Basic Website with HTML

• Outro: تبریک، شما اصول اولیه HTML را می دانید! | دوره برنامه نویسی HTML5 + CSS3 Outro: Congrats, you know the basics of HTML! | HTML5 + CSS3 Programming Course

• کد منبع HTML | دوره برنامه نویسی HTML5 + CSS3 HTML Source Code | HTML5 + CSS3 Programming Course

• HTML اولیه برای کاربران وردپرس | دوره برنامه نویسی HTML5 + CSS3 Basic HTML for WordPress Users | HTML5 + CSS3 Programming Course

CSS 3 CSS 3

• معرفی CSS | دوره برنامه نویسی HTML5 + CSS3 Intro to CSS | HTML5 + CSS3 Programming Course

• نحوه اضافه کردن سبک های CSS | دوره برنامه نویسی HTML5 + CSS3 How to Add CSS Styles | HTML5 + CSS3 Programming Course

• HTML5 + CSS3 مطالعه موردی: تغییر سبک سرصفحه برای وب سایت من HTML5 + CSS3 Case Study: Change the Header Style for My Website

• کلاس ها و شناسه ها | دوره برنامه نویسی HTML5 + CSS3 Classes and Ids | HTML5 + CSS3 Programming Course

• مرزها | دوره برنامه نویسی HTML5 + CSS3 Borders | HTML5 + CSS3 Programming Course

• سایز بندی | دوره برنامه نویسی HTML5 + CSS3 Sizing | HTML5 + CSS3 Programming Course

• HTML5 + CSS3 Padding و Margin: قرار دادن فاصله بین عناصر HTML5 + CSS3 Padding and Margin: Putting Space Between Elements

• مطالعه موردی HTML5 + CSS3: استفاده از Padding & Margins برای تنظیم وب‌سایت من HTML5 + CSS3 Case Study: Using Padding & Margins to Adjust My Website

• سبک های متن HTML5 + CSS3: تراز، توجیه، و موارد دیگر! HTML5 + CSS3 Text Styles: Alignment, Justification, and more!

• Divs: اضافه کردن استایل به گروهی از کدهای HTML | دوره برنامه نویسی HTML5 + CSS3 Divs: Add Styling to a Group of HTML Code | HTML5 + CSS3 Programming Course

• HTML5 + CSS3 Positioning: در اطراف عناصر روی صفحه حرکت کنید HTML5 + CSS3 Positioning: Move Around Elements on Your Screen

• شناور: تغییر سبک در حین شناور بودن | دوره برنامه نویسی HTML5 + CSS3 Hover: Change the Style while Hovering | HTML5 + CSS3 Programming Course

• به راحتی عناصر را با CSS در مرکز قرار دهید | دوره برنامه نویسی HTML5 + CSS3 Easily Center Elements with CSS | HTML5 + CSS3 Programming Course

• فونت: فونت وب سایت خود را تغییر دهید | دوره برنامه نویسی HTML5 + CSS3 Fonts: Change the Font of Your Website | HTML5 + CSS3 Programming Course

• چالش تمرین 2: ایجاد یک وب سایت با CSS Challenge Exercise 2: Create a Website with CSS

• Outro: تبریک، شما اصول CSS را می دانید! | دوره برنامه نویسی HTML5 + CSS3 Outro: Congrats, you know the basics of CSS! | HTML5 + CSS3 Programming Course

بوت استرپ Bootstrap

• معرفی بوت استرپ | دوره برنامه نویسی HTML5 + CSS3 Intro to Bootstrap | HTML5 + CSS3 Programming Course

• رفع بوت استرپ | دوره برنامه نویسی HTML5 + CSS3 Bootstrap Fix | HTML5 + CSS3 Programming Course

• نصب بوت استرپ: شروع به کار با بوت استرپ | دوره برنامه نویسی HTML5 + CSS3 Install Bootstrap: Get Started with Bootstrap | HTML5 + CSS3 Programming Course

• تورفتگی و ظروف | دوره برنامه نویسی HTML5 + CSS3 Indenting and Containers | HTML5 + CSS3 Programming Course

• سیستم گرید: وب سایت خود را پاسخگو کنید | دوره برنامه نویسی HTML5 + CSS3 The Grid System: Make Your Website Responsive | HTML5 + CSS3 Programming Course

• تصاویر: افزودن تصاویر با بوت استرپ | دوره برنامه نویسی HTML5 + CSS3 Images: Add Images with Bootstrap | HTML5 + CSS3 Programming Course

• دکمه های HTML5 + CSS3: دکمه های زیبا با بوت استرپ ایجاد کنید HTML5 + CSS3 Buttons: Create Beautiful Buttons with Bootstrap

• چالش HTML5 + CSS3 تمرین 3: ایجاد یک وب سایت با بوت استرپ HTML5 + CSS3 Challenge Exercise 3: Create a Website with Bootstrap

• HTML5 + CSS3 Outro: تبریک می‌گوییم، شما اصول اولیه Bootstrap را می‌دانید! HTML5 + CSS3 Outro: Congrats, you know the basics of Bootstrap!

• کد منبع بوت استرپ | دوره برنامه نویسی HTML5 + CSS3 Bootstrap Source Code | HTML5 + CSS3 Programming Course

پروژه 1 - طراحی صفحه فرود Project 1 - Design a Landing Page

• معرفی پروژه وب سایت 1 | دوره برنامه نویسی HTML5 + CSS3 Intro to Website Project 1 | HTML5 + CSS3 Programming Course

• طراحی سایت خود | دوره برنامه نویسی HTML5 + CSS3 Sketch Your Website | HTML5 + CSS3 Programming Course

• بخش برتر وب سایت خود را طراحی کنید | دوره برنامه نویسی HTML5 + CSS3 Design the Top Section of Your Website | HTML5 + CSS3 Programming Course

• بخش برتر وب سایت خود را جلا دهید | دوره برنامه نویسی HTML5 + CSS3 Polish the Top Section of Your Website | HTML5 + CSS3 Programming Course

• اضافه کردن تصاویر به وب سایت شما | دوره برنامه نویسی HTML5 + CSS3 Add Images to Your Website | HTML5 + CSS3 Programming Course

• نکات اصلی را به وب سایت خود اضافه کنید | دوره برنامه نویسی HTML5 + CSS3 Add Main Points to Your Website | HTML5 + CSS3 Programming Course

• HTML5 + CSS3 جمع آوری ایمیل ها: یک فرم انتخاب ایمیل به وب سایت خود اضافه کنید HTML5 + CSS3 Collect Emails: Add an Email Opt-in Form to Your Website

• HTML5 + CSS3 چالش تمرین 4: صفحه فرود خود را ایجاد کنید HTML5 + CSS3 Challenge Exercise 4: Create Your Own Landing Page

• Outro | دوره برنامه نویسی HTML5 + CSS3 Outro | HTML5 + CSS3 Programming Course

پروژه 2 - وب سایت کسب و کار Project 2 - Business Website

• مقدمه | دوره برنامه نویسی HTML5 + CSS3 Intro | HTML5 + CSS3 Programming Course

• طرح | دوره برنامه نویسی HTML5 + CSS3 Sketch | HTML5 + CSS3 Programming Course

• لوگو فونت فانتزی | دوره برنامه نویسی HTML5 + CSS3 Fancy Font Logo | HTML5 + CSS3 Programming Course

• مبانی چرخ فلک | دوره برنامه نویسی HTML5 + CSS3 Carousel Basics | HTML5 + CSS3 Programming Course

• چرخ و فلک اضافی | دوره برنامه نویسی HTML5 + CSS3 Carousel Extras | HTML5 + CSS3 Programming Course

• متن روی تصاویر | دوره برنامه نویسی HTML5 + CSS3 Text on Images | HTML5 + CSS3 Programming Course

• تلفن GlypIcon | دوره برنامه نویسی HTML5 + CSS3 Phone GlypIcon | HTML5 + CSS3 Programming Course

• نقشه های گوگل | دوره برنامه نویسی HTML5 + CSS3 Google Maps | HTML5 + CSS3 Programming Course

• فونت عالی | دوره برنامه نویسی HTML5 + CSS3 Font Awesome | HTML5 + CSS3 Programming Course

• چالش | دوره برنامه نویسی HTML5 + CSS3 Challenge | HTML5 + CSS3 Programming Course

• Outro | دوره برنامه نویسی HTML5 + CSS3 Outro | HTML5 + CSS3 Programming Course

• کد منبع چیکن کینگ| دوره برنامه نویسی HTML5 + CSS3 Chicken King Source Code| HTML5 + CSS3 Programming Course

پروژه 3 - نمونه کارها Project 3 - Portfolio

• مقدمه | دوره برنامه نویسی HTML5 + CSS3 Intro | HTML5 + CSS3 Programming Course

• طرح | دوره برنامه نویسی HTML5 + CSS3 Sketch | HTML5 + CSS3 Programming Course

• جامبوترون | دوره برنامه نویسی HTML5 + CSS3 Jumbotron | HTML5 + CSS3 Programming Course

• نوار نوار | دوره برنامه نویسی HTML5 + CSS3 NavBar | HTML5 + CSS3 Programming Course

• پانل ها | دوره برنامه نویسی HTML5 + CSS3 Panels | HTML5 + CSS3 Programming Course

• چالش | دوره برنامه نویسی HTML5 + CSS3 Challenge | HTML5 + CSS3 Programming Course

• Outro | دوره برنامه نویسی HTML5 + CSS3 Outro | HTML5 + CSS3 Programming Course

• ریک یا نیک سورس کد | دوره برنامه نویسی HTML5 + CSS3 Rick or Nick Source Code | HTML5 + CSS3 Programming Course

هاست - قرار دادن وب سایت شما در اینترنت Hosting - Getting Your Website on the Internet

• مقدمه | دوره برنامه نویسی HTML5 + CSS3 Intro | HTML5 + CSS3 Programming Course

• Bluehost | دوره برنامه نویسی HTML5 + CSS3 Bluehost | HTML5 + CSS3 Programming Course

• بارگذاری | دوره برنامه نویسی HTML5 + CSS3 Uploading | HTML5 + CSS3 Programming Course

• نکات تصادفی | دوره برنامه نویسی HTML5 + CSS3 Random Tips | HTML5 + CSS3 Programming Course

• Outro | دوره برنامه نویسی HTML5 + CSS3 Outro | HTML5 + CSS3 Programming Course

جوایز Bonuses

• سخنرانی پاداش: از Phil + Video School بیشتر بیاموزید Bonus Lecture: Learn More from Phil + Video School

• سخنرانی جایزه: نیک | دوره برنامه نویسی HTML5 + CSS3 Bonus Lecture: Nick | HTML5 + CSS3 Programming Course