■ What you’ll learn
- Basic CSS Grid layout (for mosaic layout, using as layout guidelines, layered multiple grids, and more)
- Coding the Design from scratch
- Mobile-first and Responsive Layout
- HTML with semantics and Simple CSS management
■ Who this book is for
- Who want to learn web development with CSS Grid by doing
- Who want to practice your HTML & CSS skills
■ Assets provided as Download
- XD and Figma design files
- Design specs with additional notes
- Image assets
- Complete HTML and CSS code (Case study’s code explained in this book)
■ Level for reference
- Level 2 (it’s a Basic level in 5 scales)
■ Table of Contents
▼ Design Mockup and Specs
▼ Case Study
- STEP 1 ― Analyzing the Design
- STEP 2 ― Start Coding
- STEP 3 ― Page Grid
- STEP 4 ― Parts Grid
- STEP 5 ― Main Content (Header Image and Article)
- STEP 6 ― Photo Gallery
- STEP 7 ― Hero
- STEP 8 ― Message
- STEP 9 ― Navigation Menu
- STEP 10 ― Finishing and Final Checks
▼ APPENDIX
- How to use Adobe XD
- How to use Figma
- How to publish a website on Netlify
- Key points of coding
- Download and Support
This book is the second volume of the “Practical Hands-on Series.”
=======================================
― This book is published under the Print Replica format. The page layout is a single page view style to make reading easier.
― You can read the Print Replica Book via the Free Kindle Reading App (for PC, Mac, Android, iOS) and Fire Tablets.
― There are cases where some functions (link, highlighting, search, dictionary, quotes) don’t work. You can’t zoom only text.