Import your PSD layouts into Dreamweaver & build a Web Site!



Uploaded by: tutvid
Video Description:
Check this video out at Hi-Res here: http://www.tutvid.com/tutorials/dreamweaver/tutorials/importPSDToDream.php
We will export a web layout made in Photoshop and build an editable website layout in Dreamweaver. We will then convert the page to a template for future use and ease of editing. Have fun with this one! Check out http://www.tutvid.com for more great training!


Tags for this video: Adobe Build code CSS divs Dreamweaver help images Import into page PSD root rules site templates Training tutvid web

Find more videos in the "Education" category
See more videos uploaded by tutvid

Related Videos
Dreamweaver Tutorial - Create a basic Webpage Insert ContentBuild a Website - Easy & Quick Build a Web Form in Dreamweaver & Get It Ready To Send Email
dreamweaver-tutorial-create-a-basic-webpage-insert-content.htmldreamweaver-tutorial-create-a-basic-webpage-insert-content.htmldreamweaver-tutorial-create-a-basic-webpage-insert-content.html
Dreamweaver Tutorial Designing with Divs Layers & CSS Styles! Photoshop Tutorial Create Web icons + Navigation BarDreamweaver tutorial - Button Rollovers - Video Tutorial
dreamweaver-tutorial-create-a-basic-webpage-insert-content.htmldreamweaver-tutorial-create-a-basic-webpage-insert-content.htmldreamweaver-tutorial-create-a-basic-webpage-insert-content.html


Share This Video:       StumbleUpon       del.icio.us       Reddit       digg       Furl       Spurl       Simpy       YahooMyWeb


Comments for this video: Show || Hide
Comments for this video on YouTube
when i make a link ... ( 4 weeks ago by TazRacing33)
when i make a link off the sliced pic when i select it in dreaweaver when i make a link a blue border goes around it what can i do to get rid of this box
I had the same ... ( 4 weeks ago by mushroomheadxx)
I had the same problem, but what you need to do is to select that link and set the border to 0.
Hope this helped.
yes how to get rid ... ( 4 weeks ago by BrainVVashed)
yes how to get rid of that border??? it cracked my images.
nvm.. i just need ... ( 4 weeks ago by BrainVVashed)
nvm.. i just need to set the border to 0..
really great ... ( 4 weeks ago by dfr3sh20)
really great tutorial! this is even better than what i learned from Total Training! keep it up!
thank you very much ( 3 weeks ago by TazRacing33)
thank you very much
i don't understand ... ( 3 weeks ago by 2310luisanita)
i don't understand what you are saying :S
XD
paarden zijn gezond ( 3 weeks ago by chrisleijssen)
paarden zijn gezond
does anybody know ... ( 3 weeks ago by sttm2)
does anybody know what the benefit is of making the editable area a "div tag". I'm not familiar with CSS so much so I'm not even really sure what a div tag is. am I ok to simply set the BG colour of that table simply to the colour I want, or do I need to make it a div tag for other reasons?????
This helps a lot, i ... ( 3 weeks ago by gdlc1983)
This helps a lot, i actually didn't know how to work with the psd files that my website templates came with when i bought them from the site "My crazy templates", which by the way are really cool and impressive. This helps a lot! Thanx
I agree. This guy ... ( 3 weeks ago by darlannedotcom)
I agree. This guy is a great teacher in his teaching style and knows his stuff. I can't help but wonder then why this tutorial is teaching tables instead of CSS tableless. As the internet moves forward, tables for design (instead of displaying tabular data only) will be obsolete and then everybody will have to re-learn it all.
how do u insert a ... ( 2 weeks ago by tony77tony77)
how do u insert a DIV tag in dreamweaver MX?
Array ( 2 weeks ago by SaturnProds)
Insert>>
Layout Objects>>
Div Tag
Verry good tutorial ... ( 2 weeks ago by clonemann06)
Verry good tutorial. I'm german and can understand it very good,too. You're good man.
I folowed all the ... ( 1 week ago by trafford95)
I folowed all the steps, great video by the way. When i go to type text into the editable region, the images around the side go messed up when i preview it in firefox. Can anyone help?
thank you ( 1 week ago by bankhpk)
thank you
Wonderful tutorial. ... ( 1 week ago by emailmaomao)
Wonderful tutorial. 1000+ Thanks!
They should just ... ( 1 week ago by Spywell)
They should just show this fellas tutorials in our college dreamweaver course.
Been a semester since I took it but it came back quick just after watching this, Time to build a 2000$ website in two days, wish me luck lol.
where do i get this ... ( 1 week ago by herocortez)
where do i get this program?
thank you man, took ... ( 1 week ago by djtipz)
thank you man, took me abit of time coz when saving the css files on a mac the rules would always come up untitled, took me ages to figure out i had to write it in the other box below aswell, but now iv linked up my template to all my pages. second time you have helped me thru my uni course, im sure it wont b the last, peace
lol, I love the way ... ( 1 week ago by byrkster)
lol, I love the way he talks, as her types he slows his speech to ensure his spelling. Thanks for the help, your awesome
It's macromedia ... ( 5 days ago by Five0Five0)
It's macromedia dreamweaver!
the new dreamweaver ... ( 5 days ago by sttm2)
the new dreamweaver is adobe, they own macromedia now.
07:10 ( 1 hour ago by TecHabblex)
07:10



Tell a friend:


URL 
Embed Code 



Tips to help you create better videos

1. Eye Candy.
Think about some of your favorite videos, ask yourself, what interesting shots and b-roll need to be captured to make your video entertaining to watch.

2. Good Lighting.
The main difference between amateur and professional videos is the quality of the lighting. Poor lighting creates graininess and poor quality videos too. (*Hint* In most studios, the lights and the cameras can be adjusted up and down to get the correct amount of light.) For your home studio make use of fluorescent light bulbs. These bulbs produce a nice soft light with no harsh shadows. You can buy fluorescent light kits or you can save a lot of money and make your own fluorescent light box. It is best to use a three point lighting system which is fairly standard in most studios.

3. Tripod.
Use a tripod for shake free shooting. Tripods come in all sizes and quality. Most camcorders used today are only small and weigh very little so there is no need to buy a tripod to suit a heavy professional video camera.

4. Microphone.
The built in microphone on your camcorder is not the best to use if you can avoid it. Buy a directional one that can be mounted on top of your camcorder. Otherwise mount the microphone on a boom or support just out of view of the camcorder but close to the subject. Another option is to use a microphone that clips onto your lapel and as used by newsreaders on television. These are very effective and can be purchased for less than $50. No need to buy a wireless unit, but you need enough cable to run from the camcorder remote microphone, up the inside of your shirt and to your lapel. Bear in mind that you will normally be seated within six feet of the camcorder so the microphone should have plenty of cable.

5. Avoid Zooming and Panning.
Avoid zooming in and out and panning from side to side as much as possible. It is recommended that you set the zoom prior to recording.

6. Pre-Roll and Post-Roll.
Allow a few extra seconds after starting and before stopping the camcorder and the actual start and finish of the action you want to record. This allows for better editing once the shooting is over. Not allowing for the pre-roll and post-roll can make editing difficult. If you are filming yourself then start the camcorder recording with the remote control, wait six seconds before you start talking and at the end let the camcorder run an extra six seconds before stopping. This will give you plenty of time when editing.

7. Remember It is A Small Screen.
When shooting videos to add to your web site, normally the player will be 320 x 240 so avoid wide scenes, keep it close to see the detail. If you are filming yourself talking, you should be within six feet of the camera and preferably from the waist up. Keep the content simple and uncomplicated, do not have much happening in the video and keep it quiet-on-the-set.

8. Think Like a Photographer.
When shooting a video, do it like a photographer taking individual shots. Plan your video shoot, record for a short while from one position then stop recording, reposition the camera or yourself then shoot again. This will reduce excessive camera movement in your video. Using these tips will ensure that you can shoot and produce quality website videos of a better quality than most people. Remember, practice makes perfect and soon you will be getting great results on the first take.

9. Look at the Details.
Sometimes, you are so focused on your subject that you do not notice the surrounding elements of the scene. Only later, when you are reviewing the footage do you notice an unsightly trash can in the background or a tree sticking out of your subjects head. I like to scan the video screen carefully before shooting to make sure there is nothing in the shot that I may have overlooked. You may be surprised what you find!

Use our search feature, at the top of the page, to find videos about your favorite topics. There are tons of videos, for example, type in "Bikini contest", "Body building", "Guitar lesson", or "How to (anything)". Search for "Commercial", you will see cool ads and funny commercials. Notice the video techniques used to capture each video, you may very well find many helpful tips and tricks to use as well as many techniques to avoid when making your own videos... have fun.