Oreilly - PSD to HTML: Learn To Build Responsive Websites

Oreilly - PSD to HTML: Learn To Build Responsive Websites

by Eduonix Learning Solutions | Publisher: Packt Publishing | Release Date: June 2018 | ISBN: 9781789536799

https://www.oreilly.com/library/view/psd-to-html/9781789536799/

Learn to convert your PSD files to responsive HTML in quick and easy stepsAbout This VideoThe course starts at the very beginning showing you a complete website layout in PSD, which you then breakdown along with the instructor and start converting to HTML.You'll go over responsive design, the different tools of the trade including which browsers to use, different code editors and what to use them for, and also how to actually get started.From there you'll focus on understanding the fundamentals of Photoshop such as fonts, images, colors, size, padding, margin, etc.In DetailThe world of technology has already come so far and going back to the start is not easy or simple. The major problem that newbie web developers face is not knowing where to start. There are so many different resources that are available which can often leave students more confused. This is exactly why we have designed a complete comprehensive beginners course on responsive web design for anyone who wishes to get into web development, regardless of their prior experience with the subject. For any newbie web developer, understanding how to convert PSD to HTML is a must. And this is exactly what this tutorial focuses on. This course starts at the very beginning including how to create a wireframe in Photoshop before delving right into understanding the fundamentals of HTML and learning how to convert a PSD into a responsive HTML website. However, the course encompasses much more just HTML and PSD. Instead it touches base on a number of related topics such as Bootstrap, tools of the trade, CSS and so much more. You'll also go over Bootstrap, how to set up your HTML, how to add forms and frameworks to your HTML, and so much more! So, what are you waiting for? Enroll now and go from a newbie to an expert web developer now!

Chapter 1 : Course Intro
- Introduction of the course 00:01:50
Chapter 2 : Introduction
- Why Learning Responsive Design is must for web developers.MOV 00:01:17
- Minimum Requirements 00:00:39
- What code editor to chose 00:10:49
- How to install Adobe Bracket 00:03:21
- How to install Code by Visual studios 00:01:42
- How to Download Photoshop CC 00:03:08
- What Browser to choice for development 00:04:50
Chapter 3 : Getting started
- Project Scope 00:00:42
- Creating File Structure 00:06:30
- Using Google Fonts 00:05:20
Chapter 4 : Photoshop CC
- How to get font family and font size from Photoshop 00:13:58
- Get Color from Photoshop Element 00:17:15
- How to get Margin and padding 00:19:37
- Exporting Images out of Photoshop 00:10:17
Chapter 5 : Bootstrap 4 Basics
- Why We Use Bootstrap 4 00:01:12
- How to download Bootstrap 00:08:52
- Bootstrap Layouts 00:11:31
- Bootstrap Content 00:12:55
- Bootstrap Components 00:21:36
- Bootstrap Utilities 00:11:41
Chapter 6 : Structuring the page with HTML
- HTML Template 00:11:36
- Navigation Section 00:09:02
- Hero Section 00:03:31
- Experience Section 00:13:30
- Benefits Section 00:04:58
- About us Section 00:07:07
- Our Team Section 00:05:35
- Services Section 00:02:59
- CTA Section 00:04:15
- Testimonials Section 00:05:55
- Contact Section 00:07:15
- Footer 00:03:35
Chapter 7 : Styling Web Page with CSS
- How to Important Fonts in CSS 00:06:59
- Adding CSS Classes from PSD 00:43:38
- Header and nav 00:25:42
- Exp Section 00:35:06
- Benefit Section 00:02:34
- About Section 00:08:25
- Our team Section 00:06:46
- CTA and Services section 00:15:31
- Contact us, footer and testimonials 00:26:34