Our first HTML & CSS web page - Dreamweaver CC 2017 [03/13]
Вставка
- Опубліковано 6 жов 2024
- Access this course + 30 of my other courses for $12 p/m: bit.ly/34pDDdG
Free Exercise Files: bit.ly/34mEFqV
Want to expand your skills? Learn Tailwind CSS & Alpine.JS for $10!: byol.com/mal1
Free Cheat Sheet: bit.ly/34l5rQu
Listen to the BYOL Insider Podcast here: bit.ly/3kAx14M
Get Adobe Dreamweaver here: goo.gl/HnRxzo
Hey there,
In this page, we're going to create our first bit of HTML and CSS. We're going to be doing some coding, but don't worry. It's going to be pretty easy coding. So, let's get into it.
So, we've opened up Dreamweaver. First thing we need to do is we need to create something called a site. So, go up to 'Site', along the top here, and go to 'New Site'. Give your site a name, you can call it anything you like, and we'll call this one, ‘Dans Portfolio’, and down here, this is the important bit, the local site folder. And, all this does, is tell our Dreamweaver where you're going to keep your website on your computer.
Now, you need to keep all of your files in this one folder.
Follow me on Instagram: / bringyourownlaptop
Follow me on TikTok: www.byol.com/t...
Follow me on Twitter: / danlovesadobe
Follow us on Facebook: / bringyourownlaptop
Full course at: bit.ly/34pDDdG
![Making your site responsive in Dreamweaver CC 2017 [04/13]](http://i.ytimg.com/vi/eGCPU9Dy49Y/mqdefault.jpg)
![Making your site responsive in Dreamweaver CC 2017 [04/13]](/img/tr.png)
Hey everyone, thanks so much for all the awesome feedback on this course.
Here's the link to the full course!
goo.gl/Bcb1GO
Bring Your Own Laptop s
nice video thanks a lot.. way of explanation is really nice ..love from India.. subscribed👍😀
Hey my dude, your website seems to be down. Is the rest of this course still available?
Yes! Finally a tutorial on the 2017 dreamweaver CC please keep up the tutorials I subbed!
Yip - I was able to have a Beta copy of the software so I trying to get in there first with a tutorial. You liking the new Dreamweaver? - Dan.
This (coming from someone who's spent hours trying to find a decent tutorial) is by far the best one! Thank you :)
I love reading these comments! Thanks David
The best DW tutorial you can find, I would love to be able to be a subscriber on this man website, but the only support my limited resources can provide is having the add block off and like every video. Follow his tutorials, you will not regret it.
Very VERY informative and utterly glorious. You've just received another subscriber. I never liked using online website builders because you use THEIR online tools and you use THEIR web building online software and you're stuck with them for life, if you choose not to be, you lose your entire site and you are forced to simply start over ALL OVER AGAIN!!!!!! So, for this very reason, and aside web builders been astronomically average, especially the drag and drop ones, I have decided that it would '' 100% OBVIOUSLY '' be the greatest decision and THE ONLY decision to ignore places like WordPress, WIX, Weebly, Squarespace, etc, and always make sure I own MY OWN FOLDERS CONTENT and that I can take that folder of mine that I worked so hard on offline to any host provider and upload my site straight onto the internet. Nobody can OWN anything that I ever do. Plain and simple. It's MINE!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! And ALWAYS will be. Your videos will help me a tremendous amount. Keep them coming CHAMPION!!!!!! - JōĦŅņy Ķ
You're absolutely right! Wordpress isn't too bad though, you can build an organic site on their platform and move it to other providers if you'd like, it just has to stay within Wordpress' framework, but they don't 'own' it per-se
'' it just has to stay within Wordpress' framework '' my friend... that's called OWNED ! :D
Oh Thank God! I'm studying at Te Waananga and we are doing a business unit and we have to create a website using Dreamweaver. Your video has been awesome. We have a tutor but they are always busy helping class mates. So I've been browsing online and finally came across you. We've had introduction lesson and some things still puzzle me but you broke it down so well and covered everything my tutor did and I've been able to make my site, create 6 pages and add some content and do some styling to it. And what makes it so much cooler is that you are KIWI too. I've subscribed and I'm going to watch your other videos and share with my classmates to help us with our unit. Thank you!!!
Awesome Emry, love to hear other Kiwi's are learning web technologies. Glad that you're enjoying and I hope your other classmates do too!
Thank you. Much better for beginners like me than the tutorials on Adobe itself.
So far so good, from a designer trying to get a better job...! Thank you!
You're welcome Molly. Glad I can help! - Dan.
Thank you so so much!! I have an exam today!! And you've told me whole year worth of course in 15 minutes!!!
I wish I could find animation tutorials as well somewhere
just started watching your videos and i love the way you teach.
Thanks so much Farhan!
This video really helps me to learn how to use it more confidence. I really enjoy it.
Awesome! The basics are always important to be confident about.
i already learned photosho after effects premiere pro "by my self/internet" and i gotta say... with this basic knowlege... and watching a 15 min vid... i understand dreamweaver (of course not complete but u get what i mean) nice video is all i tried to say basicly.
Thanks so much, great to understand the basics!
Dude...where have you been all my life! You are da bomb!!!!!!
I've been waiting here for you Sharon. Finally you're here!
Thank you. I'm more familiar with C++ and Java and was always scared of web design, but this video helped me a lot.
Awesome to hear Jon! Enjoy!
Thank u sooo much u helped me understand the program more than my teacher
Thank you very much for the interesting and simple way of explaining and facilitating information
DAN the MAN!
Thank you so much mate.
I'm feeling clever for the 1st time since I learned how to open a bottle of beer.
It's a good feeling isn't it? No grab yourself a beer!
DRINKING IS AGAINST OUR LORD AND SAVIOR JESUS CHRIST HIMSELF YOU WILL GO TO HELL SINNER REPENT FOR GOD HAS COME
finally, someone i could actually listen to for more than 15 seconds. shame 80 percent of people on youtube have god awful tone, pitch or mannerisms.
I'm a student and trying to master Java.. but i want to be a web developer in the future and this video gave me a good start on what web programming is nice video and keep-up the awesome work buddy :D.
Hello,
I have been ooking for this kind of tutorial 2017 dreamweaver cc for beginners. Thanks so much for making this! Its really helpful :)
Awesome! Glad you like my style of teaching. - Dan.
Excellent. Thank you so much for how you explain step by step as I have had difficulties in my web design classes. God bless you always +
Thank you for showing me how to become a coder! I am soo excited :) xoxo
Awesome, excited is great thanks Gea and happy learning. DWS
I can't thank you enough! THANK YOU!
Thank you so much! The way you presented is excellent and learned from it
You're welcome Hagos! Glad you liked it. - Dan.
Hello Dan Thanks for the excellent & well understanding tutorial, You are my official Master!
great video, awesome to hear a fellow NZer too
We're a very rare kind!
You are an ANGEL!!!! Bless you
Hello world had me cracking up. I am new to coding and all the first tutorials and online exercises I have been doing had me say Hello World.
Hello world! haha, it's a right of passage
Very good communication. Like it.
Thanks a lot!
Brings back memories now its WordPress.
Thank you Daniel!
Thanks so much Pixel!
Thank you so much for the video! Great tutorial.
Thank you!
YOU'RE WELCOME
You're such a great teacher! Thank you for these tutorials :-) subbed! You deserve way more.
Thanks a lot! We're doing the best we can. If you would learn more and support us then check out our website: www.bringyourownlaptop.com
you are a legend, thanks body
hello...
i really find this video so much useful and i would like to follow ur other classes too ..
Hi Shehani, my UA-cam channel is full of free videos, and our website has lots of content as well, free downloadable Cheatsheets that you can print out and stick up on your wall. Check it out! www.bringyourownlaptop.com
Bring Your Own Laptop thank you so much this is really helpful 😇
hello dan.... you're the man!!!
You're too kind, Robby!
fab tutorial very accessible
Great tutorial!
Awesome! Thanks so much for your kind words.
Thumbs up just for the voice. Better than the mundane drivel that you usually get. Good tutorial too (y)
Maybe voice acting could be a part of my future?
Check out our other courses at www.bringyourownlaptop.com
thank youu sow mutch
Thanks so much! Glad to hear.
stumbled across this vid, it's so easy today compared to 18 years ago when I first started. Dreamweaver is NOT hardcore coding haha
thanks so much sir
Awesome, thank you
Very good
Thanks a lot!
Good job
subscribed ! nice tutorial
Thanks Ammar , welcome aboard DWS
Thank you so much so helpful! Subscribing :D
Woohoo!
Thanks!
thank you sir
thanks
good tutorial ya! coder! koOol Roarr!
THANK U
You're welcome Shamsul. - Dan.
thanks so much
You're welcome +Thorhmrs123.
thank you!!!!!
No worries Shauna, thanks for your support!
Hi Dan. I love all the positive reviews! I have Dreamweaver CC 2015. Will this earlier version of DW limit my capabilities using your course? Thanks!
Hi there, you'll be fine with 85% of it, I'd give it a go, if you're not happy then I'm happy to refund your cost.
Bring Your Own Laptop Great! Thanks!
I love this video :)
Thanks so much
STOP TRYING TO BOMB ME YOU STUPID KOREAN COME FIGHT ME I DARE YOU THIS IS REYANSH JUMBARDEE AND I WILL THROW ALL OF MY CURRY AT YOU WE THROWING HANDS OR WHAT
Hey man. Great video have subbed, but after i link the CSS to my index.html i don't get that tab at the top opening up saying 'source code' and 'style.css'. What am i doing wrong?
Hi Matthew, please try closing and re-opening Dreamweaver.
hello am new on cc 2017..would love to learn more on webdesign..
Achievement unlocked! "Hello World"
50 Points!
ur tha best :D
Thanks so much, I try!
muchas, muchas gracias!!! 😎👍
GET YOUR ASS OUT OF MY DARN COUNTRY GO EAT SOME TACOS OR SOMETHING MEXICAN DARN IMMIGRANTS
Reyansh Jumbardee HEY DUMBASS UA-cam IS AVAILABLE IN EVERY COUNTRY, how can you be certain he was commenting from your shitty country? get over your self and if you have a problem simply stop using the Internet :)
good
Really good natural trainer - well done! @bringyourownlaptop
TWITTER IS FOR GAYS
Please, dont use any materials prepared before. i wana now how you atache the logo, how you create everything from the begining. Thnx
me sick watching this in bed so I can play Roblox and watch my iPad
my mind: GAHHHHHH why can't I find anything!
ME RAGING! ;0
When I try to link the HTML and the CSS pages, the document bar doesn't show up. Does anyone know how to fix this?
Hello. I finished your course on Udemi. Received a certificate with an error. You have not answered me on that site for a very long time. Ignore it. Technical support is also not responding.
ok so, when linking the html to the css, I do what you say, press save, but the CSS don't appear in the bar over.
nice
Hey great tutorial!! But when i open my CSS sheet my @charset is red not green. Is this bad? If so how would I fix/change it or does the colour not matter? Thanks!
Nah - don't worry Brigid. You're color setting are probably just different. As long as the code is the same. Are you using DW 2017 or an older version?
hello I'm following your tutorial and every the ING that I'm doing is being highlighted red and wrong. I'm not sure what I am doing wrong, I been following your tutorial and somehow ended up with mistakes! Please advise!
Hi! I watch your whole website design video it's awsome .I want to try make website like Lynda.com so which video I saw or u create this video
So, you have 13/13 courses, but only 5 out of the 13 free on your channel, correct? So you need to pay $12/month to get the complete Dreamweaver CC 2017 course, is that right? I'm having a really hard time just having the 01-13 courses display in order. Is UA-cam awful for organizing your own playlists?
Hey Molly. Yeah - I give away about half of all my videos for all my courses. It's $12pm for all my courses. There are 3 Dreamweaver courses and bunch of others. If you want to watch my video in order on UA-cam you can go to my channel. Click on Playlists. Then they will play in order. I hope that helps! - Dan.
How did he connect then at 9:02
Hello Daniel and everyone,
I skip the part at 8:39 "the link stuff" I just continued writing manualy.
Why isn't working if I click "tab" on my keyboard ?
Hi 'ThePastaGuy' - What version of Dreamweaver are you running?
Hi Daniel,
I solve the problem with reinstall Dreamweaver, thanks for the free course ;)
What do you think of writing PHP in Dreamweaver?
I personally am much more of a designer, but with Adobe's implementation of Developer mode, it's more doable than ever!
do you have a windows version of this it doesn't seem to work for me when it comes to the main screen where you have a selection of what kind of site you are trying to make
Hey Fabulan, all files are PC & Mac compatable. let me know if you're still having trouble.
I have a question. When i write 'font', there's not a list with all sorts of 'font'. I have to write it by my self.
Is there a possibility to show that list?
Hi Victor,
If you're referring to a shortcut type snippet in Emmet then there's a few answers, essentially you are able to make your own snippets, but I'm not 100% sure it's possible to write a snippet that intuitive. However you can request things to be added on Adobe's website here: www.adobe.com/products/wishform.html
Hey man, whenever i try to review the site in the "Real Time Preview" it says this "You tried to access an external HTML page, which can not be opened on the device for preview. Open the page in Dreamweaver to preview the page on the device". What do I do?
When im linking the style.css and saving it doesent show in next to the index...what should i do?
try use file -> save all. if that doesn't work, close and reopen dreamweaver, does this work for you?
Hi, for some reason I don't have the code hinting/auto completion like you do. How do i enable it? Thanks
Hi Ethan, what version of Dreamweaver are you using?
Bring Your Own Laptop I was using an older version of Dreamweaver. I've update to the newest version
yeah, i know html and css, i wanna learn dream weaver...
Thanks Sargas, check out the rest of this course to lean exactly that!
This didn't work for me. I was following along very closely and my first issue was when I type "s" dream weaver does not link to the images folder so I cant connect the html to the css.
Hey Jared, what version of Dreamweaver are using? If it's CS6 of something earlier than CC 2017 a lot of what I do isn't going to work unfortunately. Let me know if this is the case.
I'm using cc 2017, or at least I think I am... I've run the most recent updates but in my apps menu it says (cc 2015) which I don't think should be the case. I may be dealing with a separate issue here. I will have to get that worked out and try again. Thanks for sharing the video I'll be back to try again!
Cool. On problem that can cause this is that you don't have a site defined yet. Or it's broken. Check out an earlier video in this playlist to see how to define the site if you haven't already. Happy to help Jared.
Awesome, thanks!
Hey +Bring Your Own Laptop, love your video.
I am creating a website with multiple webpages and have created a template for all of them. Can you tell me if it is possible to link styles.css document to the template so that I can change the color, font and size of the text that will be un-editable? If so, how? If not, what do I do to do so?
I'm not sure your question Goutum. Do you want to make a CSS sheet that can be locked? If so, I don't think you can. You can definitely link one CSS sheet to lots of websites. That's easy enough. Let me know what you're doing and I'll try to help more. - Dan.
Hey Dan, thanks for the quick response.
So basically, I want to alter the texts' (eg: title and hyperlinks) style so that it looks more appealing, however the texts are on the non-editable regions of the template and cannot be altered from the source code of the HTML files.
Ahhh - I get you. I haven't used templates a long time now so I'm just guessing if I'm honest. I imagine you can just open the styles.css by itself in Dreamweaver > File > Open > Styles.css work on separately to the templated HTML docs. Would that work?
This seems to work, thanks.
However, I still am unable to change the text. What should I type on the CSS document to change the text "Anant Sourcing Pvt. Ltd." (I am basically using a table to manage the position of the data).
Anant Sourcing Pvt. Ltd.
I want to make this text stand out from the other texts (basically be bigger in size and of a different colour) on different cells of the table. How can I do that?
Ok - I got ya. So... you can't make a change to it. You'd have to change the but obviously all the p tags would change. You need to add a class to the text. Which is sounds like you can't do as the text is locked in the template right? You're only option is to make the text an editable region in your template. Then you'll have access to it. Then you add a class to it e.g. Anant Sourcing Pvt. Ltd.. Then you'll be able to create a corresponding CSS class in you Styles.css and make it look all fancy.
But if you can't edit your template. You're stuck unfortunately. - Dan.
when I do css it just shows my "HELLO WORLD" what did I do wrong
Make sure you're linking to the CSS correctly.
how can download Dreamweaver 2017 from web full
You can get a free trial from Adobe themselves!
www.adobe.com/nz/products/dreamweaver.html
bjr comment je pourrais entre en contact avec vous merci c concernant mon site web...
Hi Smith, you can contact us via the contact page on my website: www.bringyourownlaptop.com/contact
For some reason my charset in the css code shows up red, how can I fix this?
Nah - the red denotes a media query. Not a great color choice from Dreamweaver I know :) - Dan.
Thank you!!
what's the point of using dreamweaver if you're just going to code it outright?
Mainly because of the code writing helpers. Makes things quick. Don't get me wrong. It's not better than some of the other code editors but it's at least equal. Especially if you're a front design/dev. You're not a fan of Dreamweaver?
Actually I've never used Dreamweaver, I just wanted to see what it'd look like if you could drag and drop stuff. Just heard it wasn't great. I'm a full stack dev.
Just wanted to see why people don't just use dreamweaver over coding. But I couldn't get to see the usage of dreamweaver from this vid :(
Yeah - If you're full stack then Dreamweaver would be for you. It has a Dev mode now as well as the drag and drop style. The dev view has Emmit, CSS preprocessor & Git built in which makes it's super useful for someone like me who has no idea what a command line compiler is :) DW handles it all plus built in FTP. What are you using out of interest?
Currently using React and php for the backend. So are there any downsides to using Dreamweaver over just fully coding a website? Or is using dreamweaver and coding actually faster than just coding?
I'm not much of a developer so I wouldn't say I'm an authority but PHP works great in Dreamweaver Developer mode. Not sure about React. Basically Dreamweaver is a code editor like Notepad ++, Komodo, Sublime Text, Brackets etc. Just another tool to use.
you lost me where you said file save after adding the css
where are you stuck if you are still stuck i may be able to help!
Hey everyone. Where is everyone stuck? I'm happy to help. - Dan
We have a nice little contact form on our website: www.bringyourownlaptop.com
Wib design
👍
👍
The Intro is so irritating, rest of the video is good.
Lol incognito
#DELETME
What do you think of writing PHP in Dreamweaver?
I personally am much more of a designer, but with Adobe's implementation of Developer mode, it's more doable than ever!