In this tutorial, I will show you how to design a simple website in Adobe Xd (2020). I will teach you all you need to know about Adobe Xd web design basics and how to design a simple website in Adobe Xd as a beginner. I will take you through simple steps and teach you how to create a simple header image of a website using Adobe Xd. In this video, I will not only teach beginners how to design a simple website in Adobe Xd, but also, I will share where you can get free icons and images to use for designing websites.
Exercise files download:
Interested in a discount for my upcoming design course? Grab the discount here:
These days I don’t promote Xd anymore, so now visit:
→ Software I recommend
Hostinger for affordable webhosting:
Siteground for premium webhosting:
Elementor for no-code web-development:
Figma for Web Design:
All recommended software & discounts:
→ Starter Guides for Beginners
Elementor Starters Guide:
Figma Design Starters Guide:
→ Full A-Z Courses
Elementor Pro Mastery Course:
Figma Design Mastery Course:
Business Course:
→ Social media
Tiktok:
Instagram:
Twitter / X:
Some of the links above are affiliate links, which means that I earn a commission when you make a purchase via my link. Thanks a lot if you decide to do that! I couldn’t make all these videos without it.
So, XD is not about the site publishing, the code. We still need to know the code, right? This is just the "graphic design" of the site.
this was fine and all, but many missing things here. how do you import fonts for example, i know now that I have googled it but you could have just said it in the tutorial.
So once we are done with our website design, how do we publish it to have it a live well working responsive website? What are the steps? Thank You!
Hey Rino, Ik ben net begonnen met Xd en zit nual vast. Ik heb een lap tekst voor Mobiele weergave die je verticaal scrolt. Nou zie je vaak helemaal onder aan de tekst of kleding webshops een pijl om weer helemaal naar boven te komen, de Angle Up heb ik. hoe doe ik dat met die prototype? Ik hoop dat je snapt wat ik bedoel en kun je mij snel helpen daarmee. Of een youtube filmpje erover maken.
I don't have Budget to match, can you make travel website for me????
You would think Adobe would just go all the way and turn this into a working visual website builder lol.
I look forwards to your class! I am a designer with 30 years experience in branding, logo design, and illustration. Ive been recently asked to do web design but the last website I designed was 12 years ago and the tools have dramatically changed since! I am feeling confident that your course will smoothly bring me up to date.
I will keep watching your videos on Elementor and XD to prepare for the class.
À bientôt!
Thank you for introducing me with the website building 🙏 Could you pls help me with the photography transition in Adobe XD. I'm designing a website for small beauty spa place and I want to use my photos in the project and make some kind of slideshow or transition to make it nice and professional. So do I have to copy and paste whole website artboard few times(depending how many pics I want to auto-animate)?
8:01 One Piece Reference 😨😨
great video!
Bedankt man! Ik moet voor een les iets doen met Adobe XD maar de uitleg is heel karig =/ Nu begrijp ik het 100x beter!
that's actually a nice job!😀
In order for me to have a good output or out come as a student….I must have this determination and patience in order to finish all tasks. That's how to have an easy life!
Thank you, this was the best video! Even better than my uni tutorial.
Blessings, John 3:16. Jesus loves you.
Love your videos! Any videos/tutorials on exporting the site to upload to FTP?
Thanks
Subscribed,
But soft soft is so cool, it cant happen
Thank u for this..hopefully more of this tutorial…may I ask if its too late to start learning in web design esp. if ur in late adult?
Do you export the design into an html file afterwards? Or do you just use it as a reference for the actual design?
I have tried the 1920×1080 template for desiging a webpage and everything seem off (font size, image size) do you know why this is?
….nice vid 😃 Hope that you and the family are all well 🙏🏾 Keep up the good work 👊🏾 😃
Thank you for this video. It was really easy to follow along.
I'm so annoyed at myself for wasting my time watching this. I'm looking more specifically for someone who's an expert with On Hover/On Tap animations! >:(
Thanks for the free resource anyway
Thank you for such a great tutorial💜🤍🧡
I got WordPress , siteground and now adopexd thanks to he’s great advice and guidance thank you 🙏🏾
Dude!!! This guy is a legend !
@livingwithpixels – I am not a web designer nor a graphic one but even before I really am interested to learn. With your tutorial i just made a web design following this. I hope to see more of tutorial who knows it will be a career switch 🙂
Great Lecture continue bro!
Thank you, will definitely design my sites in XD first. You showed one page, how do I create all of the pages of my site on the same art board please?
Thanks.
Great Work
Hi ! Thank you so much. As student, I would like to build a full website for a travel agency, a fast food delivery and a e-commerce. Regards
Hello, can someone tell me? is this reliable knowledge if i want to apply on a job as a web designer?
Xd is good only for a baby designers. After wasting 4days for installing font awesome. You will smash your laptop after trying to apply shadow to the group of layers. If not probably selective (unlocked) locked layers will make your brain artery to pop.
Thank you
Great Jobs!!! You got my suppose as usual
The character spacing feature doesnt work for me, minimum is 0 for me
I spent a lot of money buying and updating Adobe software. Now I can't use it.
Goed kanaal man!!!
living with pixels is just a great name aha
Yes, very nice tutorial, learned a lot from you
If you want to download the latest software version of the software Links are given below!
https://pcsoftz.net/
https://pcsoftz.net/adobe-xd-crack/
Xd sucks due to the fact that it still can't import any animated gifs. This is so frustrating and a disgrace to adobe. Its a request for many years now and these faqers getting some big cash not doing their job cause of financial purposes.
Thank you for a great tutorial! I’m beginning my transition into Product Design! This greatly helps with building soft skills in a quality way!
One thing is sure, I understand everything, materials are ready and it's just on point. I'll totally watch more of your tutorials. Kudos!🥰
Goeie Engels man haha
I love rectangles that have 3 sides!
man, this is the best XD tutorial I watched, very simple yet it gives a deep understanding of many functionalities. Thanks!