How to Make a Responsive Website Design in Dreamweaver CC 2021 | Beginners Tutorial


They lost my site – Avoid! – My site was recently completely LOST to this company, everything gone, no back up, nothing. Shocking


How to build a Responsive Website using Dreamweaver CC 2021: This is a step by step tutorial on how to create a responsive website with Dreamweaver CC 2021.
If you are a beginner, this tutorial will help you understand the basic when building a responsive website using Adobe Dreamweaver CC 2021 using HTML, CSS and Bootstrap.

πŸ‘‰ Subscribe For More: https://www.youtube.com/channel/UCxwMoUXpnlcdAZAxnx2ZI4w?sub_confirmation=1
πŸ‘‰ Get Project Files: https://www.techruzz.com/downloads/summary/3-project-files/38-dreamweaver-website-design-project-files
πŸ‘‰ Complete Dreamweaver Website Template: https://www.techruzz.com/newsletter-subscription

πŸ‘‰ Get Domain & Hosting: https://youtu.be/FlRPzw3NMl0

β˜• By Me A Coffee: https://www.buymeacoffee.com/techruzz
β˜• Join: buymeacoff.ee/?via=techruzz to receive donations
πŸ“« Join Our Email List: https://www.techruzz.com/newsletter-subscription

STEPS COVERED:
00:00 Introduction
00:21 Complete Website Preview
1. 02:25 Create a Root Folder
2. 02:59 Launch Dreamweaver CC
3. 03:30 Navigate to Site Menu then click on New Site, give it a name then point it to the root folder
4. 04:25 Working on the Home page. (index.html)
5. 04:31 Go to File/New then select Bootstrap
6. 05:15 Save the page as index.html then preview it on your browser.
7. 06:00 Let’s add a fluid container to hold the page contents (Insert/Bootstrap Components/Container-fluid)
8. 06:39 Add the standard container within fluid container.(Insert/Bootstrap Components/Container)
9. 07:21 Adding the main menu within the standard container. (Insert/Bootstrap Components/Navbar: Basic Navbar)
10. 10:07 Adding the slideshow within the standard container but after the main menu. (Insert/Bootstrap Components/Carousel)
11. 14:06 Adding Heading and Paragraph texts after the slideshow. (Insert/HTML/Heading: H1) then (Insert/HTML/Heading: Paragraph)
12. 16:24 Adding the three thumbnails after the Paragraph text (Insert/Bootstrap Components/Grid Row with column) then (Insert/Bootstrap Components/Cards: Card)
13. 20:19 Adding Accordion after the three thumbnails. (Insert/Bootstrap Components/Accordion)
14. 23:20 Adding footer content (Insert/HTML/Footer) the (Insert/Bootstrap Components/Grid Row with column)
15. 26:45 Working on the page CSS (CSS Designer/Sources + styles.css)
16. 37:08 Adding logo on the website header and footer
17. 40:29 Adding About, Services, Gallery & Contact pages
18. 41:52 Linking menu items to pages and other relevant sections
19. 48:32 Adding content to About, Services, Gallery & Contact pages
20. 55:11 Adding a favicon
21. 1:00:24 Working on Mobile Menu CSS
22. 1:02:56 Moving the styles.css file inside the CSS folder

FOLLOW US:
πŸ‘‰ Twitter: https://twitter.com/techruzz
πŸ‘‰ Facebook: https://www.facebook.com/techruzz
πŸ‘‰ Pinterest: https://www.pinterest.com/techruzz
πŸ‘‰ Reddit: https://www.reddit.com/user/techruzz
πŸ‘‰ Tumblr: https://techruzz.tumblr.com/

IMPOTANT LINKS
β˜• Join: buymeacoff.ee/?via=techruzz to receive donations
πŸ›’ Alidropship Plugin: https://alidropship.com/?via=7104 (use GETPLUGIN25 for 25% off)
πŸ‘‰ Download Animation Composer: https://techruzz.com/animation-composer.html
πŸ‘‰ Web hosting with HOSTGATOR: https://partners.hostgator.com/techruzz | Get 60% OFF! Use Coupon Code: TECHRUZZ60

Disclaimer: TechRuzz Tutorials is supported by its audience. When you purchase through links on our channel, we may earn an affiliate commission.

#TechRuzz #Dreamweaver_Tutorials #Responsive_Web_Design

TechRuzz Tutorials

1Comment