Create Responsive Websites: From PSD Design to Code As a Pro

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

Learn Web Design in Photoshop and Code with HTML 5, CSS 3, jQuery and Bootstrap 4 Professionally the Easy Way

1 - Introduction

1 - Introduction

2 - Introduction to the Project

3 - How Much Skill in Coding is Needed to Start this Course

2 - Important Tips and Information

4 - Web Design Inspiration

5 - How to find Graphics to Use in Projects

3 - Photoshop Basics for Web Design

6 - Customizing the Photoshops Interface

7 - Using Shape Tool

8 - Using Rectangular Marquee Tool

9 - Using Move Tool and Alignment Tools

10 - Using Pen Tool

11 - Using Direct Selection Tool

12 - Using Type Tool

13 - Applying Layer Styles

4 - Designing the PSD

14 - Bootstrap 4 Grid System PSD Template

15 - Picking colors

16 - Downloading and Installing Fonts

17 - 01.EduPlateou-Header.zip

17 - Designing the Header

18 - 02.EduPlateou-Hero.zip

18 - Designing the Hero Section

19 - 03.EduPlateou-Features.zip

19 - Designing the Features Section

20 - 04.EduPlateou-Professors.zip

20 - Designing the Professors Section

21 - 05.EduPlateou-Fields.zip

21 - Designing the Fields Section

22 - 06.EduPlateou-Grades.zip

22 - Designing the Grades Section

23 - 07.EduPlateou-Courses.zip

23 - Designing the Courses Section

24 - 08.EduPlateou-Subscribe.zip

24 - Designing the Subscribe Section

25 - 09.EduPlateou-Facilities.zip

25 - Designing the Facilities Section

26 - 10.EduPlateou-Awards.zip

26 - Designing the Awards Section

27 - 11.EduPlateou-Branches.zip

27 - Designing the Branches Section

28 - 12.EduPlateou-Contact.zip

28 - Designing the Contact Section

29 - 13.EduPlateou-Mini-Subscribe.zip

29 - Designing the Mini Subscribe Section

30 - 14.EduPlateou-Footer.zip

30 - Designing the Footer and Copyright

31 - 15.EduPlateou-Final-Touches.zip

31 - Final Touches and Improvements of the PSD

5 - Converting the PSD to HTML

32 - Choosing the Code Editor

33 - 32.The-Project-Basic-Setup-and-Folder-Structure.zip

33 - The Project Basic Setup and Folder Structure

34 - 33.Writing-Some-Reusable-CSS-Code.zip

34 - Writing Some Reusable CSS Code

35 - 34.Coding-the-Header.zip

35 - Coding the Header

36 - 35.Coding-the-Hero-Section.zip

36 - Coding the Hero Section

37 - 36.Coding-the-Features-Section.zip

37 - Coding the Features Section

38 - 37.Creating-a-Background-for-the-Fixed-Header.zip

38 - Creating a Background for the Fixed Header

39 - 38.Coding-the-Professors-Section.zip

39 - Coding the Professors Section

40 - 39.Coding-the-Fields-Section.zip

40 - Coding the Fields Section

41 - 40.Coding-the-Grades-Section.zip

41 - Coding the Grades Section

42 - 41.Coding-the-Courses-Section.zip

42 - Coding the Courses Section

43 - 42.coding-the-Subscribe-Section.zip

43 - Coding the Subscribe Section

44 - 43.Coding-the-Facilities-Section-Part1.zip

44 - Coding the Facilities Section Part1

45 - 44.Coding-the-Facilities-Section-Part2.zip

45 - Coding the Facilities Section Part2 Creating the CSS Popup

46 - 45.Coding-the-Awards-Section.zip

46 - Coding the Awards Section

47 - 46.Coding-the-Branches-Section.zip

47 - Coding the Branches Section

48 - 47.Coding-the-Contact-Section.zip

48 - Coding the Contact Section

49 - 48.Coding-the-Mini-Subscribe-Section.zip

49 - Coding the Mini Subscribe Section

50 - 49.Coding-the-Footer.zip

50 - Coding the Footer

51 - 50.Reviewing-the-template.zip

51 - Reviewing the Template

6 - Making the HTML Template Responsive and Mobile Ready

52 - 51.Creating-the-Mobile-Navigation.zip

52 - Creating the Mobile Navigation

53 - 52.Polishing-the-Mobile-Navigation.zip

53 - Polishing the Mobile Navigation

54 - 53.Getting-Ready-to-Write-Media-Queries.zip

54 - Getting Ready to Write Media Queries

55 - 54.Making-the-Header-Responsive.zip

55 - Making the Header Responsive

56 - 55.Making-Hero-Responsive.zip

56 - Making the Hero Section Responsive

57 - 56.Making-the-Features-Section-Responsive.zip

57 - Making the Features Section Responsive

58 - 57.Making-the-Professors-Section-Responsive.zip

58 - Making the Professors Section Responsive

59 - 58.Making-the-Grades-Section-Responsive.zip

59 - Making the Grades Section Responsive

60 - 59.Making-the-Subscribe-Section-Responsive.zip

60 - Making the Subscribe Section Responsive

61 - 60.Making-the-Facilities-Section-Responsive.zip

61 - Making the Facilities Section Responsive

62 - 61.Making-the-Awards-Section-Responsive.zip

62 - Making the Awards Section Responsive

63 - 62.Making-the-Branches-Section-Responsive.zip

63 - Making the Branches Section Responsive

64 - 63.Making-the-Contact-Section-Responsive.zip

64 - Making the Contact Section Responsive

65 - 64.Making-the-Mini-Subscribe-Section-Responsive.zip

65 - Making the Mini Subscribe Section Responsive

66 - 65.Making-the-Footer-Responsive.zip

66 - Making the Footer Responsive

7 - Spicing Up the Project More

67 - 66.Using-Bootstrap-Scrollspy.zip

67 - Using Bootstrap Scrollspy

68 - 67.Smoothing-the-Navigation-Scroll.zip

68 - Smoothing Navigation Scrolls

69 - 68.Applying-Animations-to-the-Page-Elements.zip

69 - Applying Animations to the Page Elements

70 - 69.Final-Touches-and-Farewell.zip

70 - Final Touches and Farewell

53,700 تومان

خرید اشتراک افزودن به سبد خرید

خرید دانلودی فوری

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

تولید کننده: Udemy-Training