YoVDO

How to Make a Website Using HTML and CSS - Coding Adobe XD Web Design Tutorial

Offered By: Brian Design via YouTube

Tags

Adobe XD Courses Computer Science Courses Web Development Courses GitHub Courses HTML Courses Responsive Design Courses Media Queries Courses

Course Description

Overview

Learn to create a responsive website by converting an Adobe XD design into HTML and CSS in this 39-minute tutorial. Follow along as the instructor demonstrates how to implement background gradient shapes and SVG images, set up the project structure, and code the home page. Discover techniques for adding custom fonts, icons, and styling elements using CSS. Explore responsive design principles by implementing media queries for different screen sizes. By the end of this hands-on tutorial, gain practical skills in web development and design implementation using industry-standard tools and techniques.

Syllabus

What we're building
Learn where you can design the website with Adobe Xd
Start coding using VS Code
Where to get the project images on Github
Creating our index.html file
Linking our CSS file
Creating our style.css file
Open our project with Live Server
Creating our home page HTML code
Adding Fontawesome icon CDN into our project
Adding google font Montserrat
Updating our style.css
Adding our first media query for responsiveness
Final Design


Taught by

Brian Design

Related Courses

Software as a Service
University of California, Berkeley via Coursera
Intro to Computer Science
University of Virginia via Udacity
Web Development
Udacity
Software Engineering for SaaS
University of California, Berkeley via Coursera
CS50's Introduction to Computer Science
Harvard University via edX