Adobe Dreamweaver Tutorials

Advertisement

With the growing popularity of CMS, Wikis and Weblogs, WYSIWIG-editors lose their users. However, many of those editors offer many advantages, such as Integration of SVN, FTP Clients, Developer’s extensions and programming environments. Using them, you can save your time and increase your efficiency. Not every code has to be written in Notepad, not every problem has to be solved manually. Therefore some good starting points for improving your WYSIWYG-skills can be useful.

In the list below we tried to cover some of the most useful references, tutorials, ideas and sketches related to Adobe Dreamweaver1 (initially called Macromedia Dreamweaver2).

You might be willing to use at least some of them for your next projects. Particularly video-tutorials are amazing, don’t forget to check them out.

PS: You might also be interested in

we’ve reviewed recently.

Adobe Dreamweaver Video Tutorials

Tutorials for Beginners

  • Dreamweaver 8 In Pictures
    This tutorial helps beginners learn the basics of creating Web sites with Adobe Dreamweaver 8: Dreamweaver Basics, Utilities, Navigation & Layout, Interactivity, Advanced Layout.
  • Creating Your First Website with Dreamweaver 814
    Macromedia’s Tutorial for Beginners: Part 1: Setting Up Your Site and Project Files, Part 2: Creating a Table-Based Page Layout, Part 3: Adding Content to Pages, Part 4: Formatting Your Page with CSS
  • Dreamweaver MX
    Tutorial for beginners. 9 lectures.
  • Dreamweaver Tutorial – Learn how to use Dreamweaver15
    13 basic Dreamweaver tutorials: Dreamweaver installation, Dreamweaver templates, CSS styles, tables, rollover effect. Find Dreamweaver hosting.

Libraries with Dreamweaver Tutorials

Articles, Tips, Tricks

  • Dreamweaver Regular Expressions Are Your Friend26
    “A list of regular expressions that you can use in Dreamweaver. To load these expressions, click the folder icon which is directly above and right-aligned with the Find text field. From there, you will be able to load and use these regular expressions. I have no doubt that you will be able to improve upon many if not all of these regular expressions I have put together. Nonetheless, it is a good place to start.”
    Dreamweaver Tutorials - Regular Expressions27
  • Dreamweaver as a Rails IDE
    You can use Dreamweaver as a Rails environment. Shaun Andrews explains, how it goes and what you need.
  • Building a DHTML Drop Down Menu with Dreamweaver > Downloading the Project Files28
    With DHTML drop-down menus, you can add nice interactivity to your Web site. However, hand-coding DHTML takes time, even for experienced designers. Adobe Dreamweaver helps you incorporate DHTML without having to learn the underlying code. Learn here how to use it.
  • Dreamweaver 8 Does Standards! [Software Tutorials]29
    Rachel Andrew about Web Standards, Adobe Dreamweaver and creating standard-compliant web-sites with Dreamweaver.
  • How to edit WordPress themes using Dreamweaver30
    WordPress, like most PHP-MySQL CMS, uses template files to control the appearance of websites. To use Dreamweaver to edit or customize WordPress themes, you need to combine these different PHP files into one page so that you can immediately view, while editing the codes, how the page would appear.
  • How to Create RSS feeds with Dreamweaver31
    “In this tutorial I’m going to outline two different styles of content which broadly encompasses the two primary sets of web content that get converted to feeds — Single Pages and Directories. Single pages are single HTML files that contain multiple stories, each of which is treated as a unique entry to be linked to by the RSS feed. Directories contain multiple HTML files, each of which contains a single story and links to each must be entered in the RSS feed. RSS DreamFeeder, once configured, will do all of this automatically for you when you process the feed. You can define multiple feeds for your website and each feed can have its own configuration.”
    Dreamweaver Tutorials - RSS Feeds with Dreamweaver32
  • Building a Forum with Dreamweaver
    Building a forum in 4 steps: Part 1: Getting Started, Part 2: User Authentication, Part 3: Posting Messages, Part 4: Replying to Messages
  • Inserting Fireworks HTML into Dreamweaver33
    “In this tutorial we are going to insert a table that was created in Fireworks (be sure to check out the Fireworks tutorial on Creating a Navigation Bar). Once we have inserted the Fireworks HTML into our Dreamweaver document, we will add the corresponding links using the Point-to-File method we learned about in an earlier tutorial.”
  • Creating dynamic layers with interactive image rollovers using Dreamweaver34
    In this tutorial we are going to use multiple layers stacked over another, and make it viewable, when the mouse is rolled over in an Image
  • HeavyWeightGeek35
    “How often do you want to know where one div ends and the next starts in any particular browser. Now you can get the Firefox Web Developer Toolbar36. This little DW extension adds a nice span around any content.”
  • My Free PR – Free Extension For Dreamweaver Eases Integration with Google Innovations
    WebAssist’s Dreamweaver Tools for Google makes it easy for small business and Web pros to effortlessly enhance their Web sites with additional functionality.
  • Ades Dreamweaver Tutorials37
    Adobe Dreamweaver Tutorials, e.g. Create Rollover/MouseOver effect, Making use of I-Frames, Learn how to structure your pages before the design, Learn how to validate forms with Dreamweaver und viele mehr
  • Build PHP Applications With Adobe Dreamweaver MX [PHP & MySQL Tutorials]38
    Over the next few pages, I’ll be exploring the new PHP functionality in Dreamweaver MX, in the hope that you find it useful the next time you have a PHP project to code.
    Dreamweaver Tutorials - Build PHP Applications39
  • XML and XSL in Dreamweaver 840
    Learn how to use XML and XSLT in Adobe Dreamweaver.
  • Creating Secure Login Page41
    This tutorial will teach you how to make a login page in Dreamweaver MX.
    Dreamweaver Tutorials - Creating Secure Login Page42
  • Accessibility Features of Dreamweaver MX and MX 200443
    This tutorial describes the new accessibility features of Dreamweaver MX and MX 2004
  • Customize Dreamweaver to Your Needs [Software Tutorials]44
    This article explains a few of the most useful customization tricks which can be achieved by you, the Adobe Dreamweaver user.
  • Dreamweaver 8 Reviewed45
    An extensive review of Dreamweaver 8, including Coding Toolbar, Code collapsing, Workspaces, Tag Completion and more.
  • Animation in Dreamweaver46
    Macromedia’s Dreamweaver does support animation in a little known inspector call the “TimeLine Inspector”.
  • PHP and MySQL Error47
    This article specifically applies if your Dreamweaver cannot see the tables in your MySQL database or you are getting the error “Client does not support authentication protocol requested by server; consider upgrading MySQL client” when you look at a php page in a web browser served from a Windows 2000, XP or 2003 Server.
  • Dreamweaver Image Maps48
    Learn how to link to different pages from the same image using image maps in Dreamweaver.
  • Layers49
    Creating Layers
  • Dreamweaver Forms50
    Tips on customizing input boxes, list menus, submit buttons. Also learn how to validate forms using Dreamweaver behaviors.
  • CSS Text Rollovers51
    Try out these cool text rollover effects using CSS style sheets.

Dreamweaver Resources

Adobe Dreamweaver Extensions

  • Codetch :: Firefox Add-ons56
    Get the feel of Dreamweaver in a Firefox extension. Edit your documents right next to your web pages as you surf.
    Dreamweaver Tutorials - Codetch57
  • Adobe Dreamweaver Extension Resources58
    The official Macromedia extensions site. These extensions have been tested by Macromedia and the list of extensions can be searched by category.
  • Kaosweaver – Home of Dreamweaver Extensions59
    An overview of useful and popular Dreamweaver Extensions.
  • Nearly Geek: Introduction
    Subversion for Dreamweaver (SVN4DW) is a Dreamweaver extension that provides easy access to a subversion repository from within Dreamweaver on Windows. SVN4DW currently provides access to the most commonly used SVN functions, and new functions are being added all the time.
    Dreamweaver Tutorials - SVN
  • WordPress Dreamweaver Extension
    WordPress Template Builder (WTBDWE) – this is a WordPress extension for Adobe Dreamweaver. I made this extension to facilitate the development of WordPress templates in Dreamweaver. It has some cool and nice feautres, like special functions, loops, includes, etc. I included most useful by me functions and also some rare functions, which I not known by most WP users.

Footnotes

  1. 1 http://www.adobe.com/products/dreamweaver
  2. 2 http://en.wikipedia.org/wiki/Macromedia_Dreamweaver
  3. 3 http://www.smashingmagazine.com/2007/02/03/adobe-illustrator-tutorials/
  4. 4 http://www.smashingmagazine.com/2007/01/12/hand-picked-photoshop-tutorials/
  5. 5 http://www.smashingmagazine.com/2007/01/26/tutorials-round-up-ajax-css-javascript-php-mysql-and-more/
  6. 6 http://www.smashingmagazine.com/2007/03/10/web-20-tutorials-round-up/
  7. 7 http://movielibrary.lynda.com/html/modListing.asp
  8. 8 http://lynda.com/freepass/cs2/
  9. 9 http://movielibrary.lynda.com/html/modListing.asp
  10. 10 http://wikivid.com/index.php/Dreamweaver
  11. 11 http://www.wz2k.co.uk/index.php?catID=1&mod=listdl
  12. 12 http://www.video-tutes.com/packages/DWDesign1.php
  13. 13 http://www.photoshopsupport.com/dreamweaver/tt/total-training.html
  14. 14 http://www.macromedia.com/devnet/dreamweaver/articles/first_website_pt1.html
  15. 15 http://www.siteground.com/tutorials/dreamweaver/index.htm
  16. 16 http://www.educationonlineforcomputers.com/blogs/post/Free_Training_Photoshop_Flash_Dreamweaver_FrontPage_Adobe_Macromedia_Apps/512/Great-Tutorials-for-Dreamweaver-MX-2004-and-Dreamweaver-MX
  17. 17 http://www.communitymx.com/category.cfm?catID=1&typeid=1
  18. 18 http://www.communitymx.com/category.cfm?catID=1&typeid=1
  19. 19 http://www.teacherclick.com/dreamweaver8/index.htm
  20. 20 http://www.tutorialized.com/tutorials/Dreamweaver/1
  21. 21 http://www.d.umn.edu/itss/support/Training/Online/webdesign/dreamweaver.html
  22. 22 http://www.d.umn.edu/itss/support/Training/Online/webdesign/dreamweaver.html
  23. 23 http://www.photoshopcafe.com/tutorials/super%20tutorial%202/website.htm
  24. 24 http://www.adobetutorialz.com/categories/Macromedia-Products/Macromedia-Dreamweaver/
  25. 25 http://www.projectseven.com/
  26. 26 http://www.somerandomdude.net/blog/development/dreamweaver-regular-expressions/
  27. 27 http://www.somerandomdude.net/blog/development/dreamweaver-regular-expressions/
  28. 28 http://www.phptr.com/articles/article.asp?p=29835&rl=1
  29. 29 http://www.sitepoint.com/article/dreamweaver-8-standards
  30. 30 http://max.limpag.com/2006/06/07/how-to-edit-wordpress-design-using-dreamweaver/
  31. 31 http://www.webreference.com/programming/rss_feeds/
  32. 32 http://www.webreference.com/programming/rss_feeds/
  33. 33 http://www.hotcoding.com/Webdesign/HTMLCSS/200611/27279.html
  34. 34 http://www.macronimous.com/resources/dynamic_layers_with_dreamweaver.asp
  35. 35 http://www.heavyweightgeek.com/2007/03/26/useful-dreamweaver-extension-the-brd-is-the-word/
  36. 36 http://chrispederick.com/blog/
  37. 37 http://www.adesdesign.net/php/dreamweaver.php
  38. 38 http://www.sitepoint.com/article/macromedia-dreamweaver-mx
  39. 39 http://www.sitepoint.com/article/macromedia-dreamweaver-mx
  40. 40 http://www.macromedia.com/devnet/dreamweaver/xml.html
  41. 41 http://www.adesdesign.net/php/tutorials/dreamweaver/secure_login.php
  42. 42 http://www.adesdesign.net/php/tutorials/dreamweaver/secure_login.php
  43. 43 http://www.webaim.org/techniques/dreamweaver/
  44. 44 http://www.sitepoint.com/article/customize-dreamweaver-needs
  45. 45 http://www.adobetutorialz.com/articles/563/1/Dreamweaver-8-Reviewed
  46. 46 http://www.adobetutorialz.com/articles/581/1/Animation-in-Dreamweaver
  47. 47 http://www.synergymx.com/page.php?Title=PHP_and_MySQL_Error/
  48. 48 http://www.entheosweb.com/website_design/image_maps.asp
  49. 49 http://www.entheosweb.com/dreamweaver/layers.asp
  50. 50 http://www.entheosweb.com/website_design/dreamweaver_form_tips.asp
  51. 51 http://www.entheosweb.com/website_design/css_styles.asp
  52. 52 http://www.adobe.com/devnet/dreamweaver/
  53. 53 http://www.adobe.com/devnet/dreamweaver/
  54. 54 http://www.dreamweaver-templates.org/
  55. 55 http://dreamweaverfever.com/
  56. 56 https://addons.mozilla.org/de/firefox/addon/1002
  57. 57 https://addons.mozilla.org/de/firefox/addon/1002
  58. 58 http://www.dwfaq.com/Resources/Extensions/default.asp
  59. 59 http://www.kaosweaver.com/

↑ Back to topShare on Twitter

Co-Founder of Smashing Magazine. Former writer, web designer, freelancer and webworker. Sven is now writing Science Fiction Stories.

Advertising
  1. 1

    Thank you! I was just about to start learning DW so this will come in handy :)

    0
  2. 2

    The link to the Lydia.com Linkpass has been expired :(

    0
  3. 3

    Vitaly Friedman & Sven Lennartz

    April 4, 2007 9:35 pm

    Bas, yes, you’re right. Sorry for inconvenience.

    0
  4. 4

    After Notepad++ dreamweaver is my favorite!!!!

    0
  5. 5

    Does Dreamweaver still produce smelly tag soup?

    0
  6. 6

    Ooo! Dreamweaver is one and only web design & development tool that I use during my Windows XP Pro session. Gotta try some of them.

    Thanks!

    0
  7. 7

    Gotta love this site. Constantly updated with quality content. Many thanks.

    0
  8. 8

    Balakumar Muthu

    April 5, 2007 5:07 pm

    Subversion for Dreamweaver, that’s an good one.

    0
  9. 9

    Gaurav Malhotra

    April 6, 2007 1:11 pm

    Hi,

    I have looked for many Dreamweaver tutorials but have not found
    any good links.

    Thank so much for posting these excellent links.

    Keep up the good work.

    Smashingmagazine.com rocks

    Gaurav

    0
  10. 10

    Is it a joke? Who cares about Dreamweaver? It’s only for hobby developers.
    In the real world you should use a notepad like Scite, or other project management ready software, and you’re on the right way.
    I’m really disappointed in Smashin mag beacause of this article (or ad?).

    0
  11. 11

    how install Dreamweaver on Ubuntu/linux?

    0
  12. 12

    Wasatch Software

    April 23, 2007 8:23 am

    Great list of Adobe Dreamweaver resources. Thank you for putting this together!

    0
  13. 13

    Kind of ironic to say that wikis are causing the downfall of wysiwyg editors and the first link is from a wiki lol.

    0
  14. 14

    Buri – are you living in a CAVE? I agree 1% about the notepad a good place to start – but with the color coding features and support for a ton of programming languages DW is an excellent professional choice – not to mention that it supports a number of platforms – ColdFusion, PHP, ASP/ASP.NET, JAVA, yada, yada yada… and with CS3 Spry and other cool tools

    Good luck finding that one broken div tag, that causes your page to break, in your 10,000 lines of nested ASP.NET code in Note Pad!!!

    Notepad = beginners
    DW or other GUI for PROS!

    0
  15. 15

    You forgot to add VTC to the tutorials list – they have over 60,000 video tutorials including a good selection for Dreamweaver

    0
  16. 16

    One more to add to the list: JustDreamweaver.com

    There’s a big list of Dreamweaver extensions, both free and commercial, tutorials and links to a lot of other web design resources.

    0
  17. 17

    The link to the Lydia.com Linkpass has been expired :(

    0
  18. 18

    Careful when you try descending from your ivory tower for a loo break. There are plenty of people who use Dreamweaver to get them on their way to becoming a programming god, like you clearly are…

    Always has to be one, doesn’t there? Loser.

    0
  19. 19

    How do I stop my video on my web page from being downloaded. I used a hyperlink so viewers can see a larger version of the video but I don’t know how to block the video from being downloaded.

    0
  20. 20

    nearly geek link is dead for SVN4DW – so sad.

    0
  21. 21

    I’d like to add one more extension for DW and the Joomla CMS.
    The Joomla Template Kit

    I’m the author but I think it fits this list ;)

    Cheers,
    Brian

    0
  22. 22

    Great tutorials here! I hope to apply these in building my portfolio site,

    0
  23. 23

    SVN4DW doesn’t get updated anymore, and is getting hard to find. Luckily, theres a new one called Subweaver thats open source and is available here: http://code.google.com/p/subweaver/

    0
  24. 24

    Great links. Just an FYI for WordPress developers, ThemeDreamer extension for Dreamweaver with CS4 support is now out. Kiss those frustrating file assemble/disassemble days goodbye. Alse has code and online documentation links to make things easier.

    http://www.themedreamer.com

    0
  25. 25

    I’m looking for a tutorial or guide in using the dreamweaver extension for Joomla templates. I got the extension, but it seems very confusing in seeing the default teplate code as to where to place each code snippet. The client wants the same design like Linkto use the same style like this for my clients joomla CMS

    0
  26. 26

    Does anybody know of a good source for an updated tutorial. i.e. something that was made recently on Dreamweaver cs5?

    0
  27. 27

    Great list of tutorials! I have been searching all over the web for good tutorials for beginners and have found this site to be very inspirational. You guys might also want to check out http://www.webnoobie.com, that guy does awesome video tutorials for beginners on adobe products, web design and I find a lot of cool downloads there. Keep it up Smashing Mag, I love it!

    Jason

    0
  28. 28

    This is a great resource list of dreamweaver tools. Is there a way to recommend more sites to this already impressive list? http://www.ascendtraining.com/ has a great selection of adobe tutorials on their site that can benefit anyone trying to learn dreamweaver.

    0
  29. 29

    I am looking to learn more on Dreamweaver as this program was not taught in our Visual Communication (AAS) course. These tutorials use Dreamweaver 8! Is there or will there be an updated tutorial lesson(s) ??

    0

↑ Back to top