ArtsAutosBooksBusinessEducationEntertainmentFamilyFashionFoodGamesGenderHealthHolidaysHomeHubPagesPersonal FinancePetsPoliticsReligionSportsTechnologyTravel

Photoshop And Dreamweaver

Updated on November 11, 2014

Photoshop and Dreamweaver - A Reliable Combination

Ever since I got interested in web design and implementation, I have relied on what I consider to be the best two programs for this - Adobe's Photoshop and Dreamweaver to get fantastic results. Of course each works well on its own, but together they are a force to be reckoned with especially with the added features in the CS6 of each.

Photoshop is the industry standard image editing program for professional raster graphics and other digital art, while Dreamweaver is a web development application. Both are owned by Adobe Systems.

If you haven't got to grips with either of these applications yet or think they are too complicated - don't worry, there are so many excellent tutorial sites which will walk you through every detail of design and layout, whether you are a beginner or a seasoned pro.

Dreamweaver CS5.5
Dreamweaver CS5.5

About Dreamweaver CS5.5

Create modern websites

Adobe Dreamweaver CS5.5 is a comprehensive professional toolset for designing and deploying compelling websites and mobile applications. Using powerful coding tools or the state-of-the-art visual interface, create advanced sites and applications using HTML5, CSS3, and jQuery support for desktops, phones, and tablets.

Dreamweaver CS5.5 is the current version.

Features of Dreamweaver

As a WYSIWYG Presto-based editor, Dreamweaver can hide the HTML code details of pages from the user, making it possible for non-coders to create web pages and sites.

Example of CSS layout

Adobe has increased the support for CSS and other ways to lay out a page without tables in later versions of the application, with the ability to convert tables to layers and vice versa.

Dreamweaver allows users to preview websites in many browsers, provided that they are installed on their computer. It also has some site management tools, such as the ability to find and replace lines of text or code by whatever parameters specified across the entire site, and a templatisation feature for creating multiple pages with similar structures. The behaviours panel also enables use of basic JavaScript without any coding knowledge.

Dreamweaver can use "Extensions" - small programs, which any web developer can write (usually in HTML and JavaScript). Extensions provide added functionality to the software for whoever wants to download and install them. Dreamweaver is supported by a large community of extension developers who make extensions available (both commercial and free) for most web development tasks from simple rollover effects to full-featured shopping carts.

Like other HTML editors, Dreamweaver edits files locally, then uploads all edited files to the remote web server using FTP, SFTP, or WebDAV. Dreamweaver CS4 now supports the Subversion (SVN) version control system.

Photoshop CS5
Photoshop CS5

About Photoshop CS6 & CC

The flagship product of Adobe Systems

Adobe Photoshop, or simply Photoshop, is a graphics editing program developed and published by Adobe Systems. It is the current and primary market leader for commercial bitmap and image manipulation. It has been described as "an industry standard for graphics professionals" and was one of the early "killer applications" on the Macintosh.

Photoshop CS5, the current twelfth iteration of the program, was officially announced on 23 September 2008 and released on 15 October 2008. "CS" reflects its integration with other Creative Suite products, and the number "6" represents it as the sixth version released since Adobe re-branded its products under the CS umbrella.

Adobe Photoshop CS5: Content-Aware Fill on YouTube - It's not sneak peek any more!

Features of Photoshop

Photoshop has strong ties with other Adobe software for media editing, animation, and authoring.

Files in Photoshop's native format, .PSD, can be exported to and from:

Adobe ImageReady

Adobe Illustrator

Adobe Premiere Pro

After Effects

Adobe Encore...

... to make professional standard DVDs and provide non-linear editing and special effects services, such as backgrounds, textures, and so on, for television, film, and the Web. For example, Photoshop CS broadly supports making menus and buttons for DVDs. For .PSD files exported as a menu or button, it only needs to have layers, nested in layer sets with a cuing format, and Adobe Encore DVD reads them as buttons or menus.

Photoshop revolves around editing pixels, unlike Adobe Illustrator which uses vectors. When an image is rendered into Photoshop, it is compiled by millions of single-colored pixels. At its core, Photoshop works by manipulating each individual pixel. Pixels are manipulated according to whichever tool is being used. In the case of other tools, such as Blending Modes, the pixels are modulated according to their relations with other pixels. Individual colors are encoded by a 3-part scale: red values, green values, and blue values (RGB). Each value is measured on a scale of 0 to 255, with saturation increasing proportionate to number scale. A value of Red: 255 Green: 0 Blue: 0 will be rendered as pure red. All 3 values at 255 will be rendered as white, all values at 0 will be rendered as black, etc.

Photoshop can utilize the color models RGB, lab, CMYK, grayscale, binary bitmap, and duotone. Photoshop has the ability to read and write raster and vector image formats such as .EPS, .PNG, .GIF, .JPEG, and Fireworks. It also has several native file formats:

  1. The .PSD (Photoshop Document) format stores an image with support for most imaging options available in Photoshop. These include layers with masks, color spaces, ICC profiles, transparency, text, alpha channels and spot colors, Clipping paths, and duotone settings. This is in contrast to many other file formats (e.g. .EPS or .GIF) that restrict content to provide streamlined, predictable functionality. Photoshop's popularity means that the .PSD format is widely used, and it is supported to some extent by most competing software.
  2. The .PSB (Large Document Format) format is a newer version of .PSD designed for files over 2 gigabytes.
  3. The .PDD (PhotoDeluxe Document) format is a version of .PSD that only supports the features found in the discontinued PhotoDeluxe software.

Photoshop Interface

Enhanced collapsible Palette Panes

Photoshop now supports a new interface that's slick and intuitive. Don't worry, things are still in the same place, more or less.

Photoshop is now dressed in collapsible Palette Panes (as one with orange border to the right). The palettes can be docked, minimized into icons or dragged out of the panes to perform the way they always have. This new interface really maximizes screen real estate and lets the application get out of the way of your work. The toolbox can now be displayed as a single column or the standard 2-column for those of us who resist change.

There are new enhancements to the full screen mode (F key). There are now 4 modes:

  1. Standard: The default view.

  2. Maximized: The pasteboard fills the window and the document is enlarged to the maximum possible size without being covered by any palettes.
  3. Full screen with menu: Hides the Status bar and fills the screen with the pasteboard.
  4. Full screen without Menu: Same as previous but without any menu at the top. (This is sometimes called the "presentation mode").

As always, press the TAB key to hide the palettes, but now scroll to the edges of the screen and the interface will elegantly slide out, awaiting your interaction.

Video Niche Sitebuilder

Check this out - it's phenomenal!

What if you could instantly build Tens, Hundreds, or even thousands of those optimized Video Web Sites... without ever lifting a single finger to update them, to add new content, to monetize them?


Video Niche Site Builder (TM)

As easy as 1, 2, 3...

Happy Designing, Do Drop a Line And Say Hi!

    0 of 8192 characters used
    Post Comment
    • Binarydog LM profile image

      Binarydog LM 

      6 years ago

      Dreamweaver is an awesome IDE for both developers and designers. Yes, it does take a little time to learn the interface, but to be honest there is no other software out there that I have tried, which comes close to matching it in both features and ease of use. Just my ten pence worth though.

    • profile image


      6 years ago

      Rob, you are way over my head on this. If I ever need help learning to use Dreamweaver, may I come to you? :)

    • profile image


      9 years ago

      Rob, would you believe that I have a whole suite of Adobe software that my company purchased for me in December, and I've only used the Adobe Acrobat app? Dreamweaver is one of the programs that I think I need some training to be able to use appropriately.

    • rob-hemphill profile imageAUTHOR

      Rob Hemphill 

      9 years ago from Ireland

      [in reply to Pukeko] Hi Pukeko. The Dreamweaver book I would highly recommend is Joseph Lowerys - Dreamweaver CS Bible. See link below. I have had this book for 6 months now and it is so comprehensive and covers all aspects clearly. Also, take a look at the good quality video tutorials at, this guy really knows his stuff (also photoshop etc). Good luck!

    • RhondaAlbom profile image

      Rhonda Albom 

      9 years ago from New Zealand

      Hi Thanks for this. It was helpful I just purchased Dreamweaver CS4 and prior to this have only made template based webpages. No clue what I am doing and all the books/videos I find assume you know CS2 or 3 and just give the updates. Any recommendations on a book for beginners?


    This website uses cookies

    As a user in the EEA, your approval is needed on a few things. To provide a better website experience, uses cookies (and other similar technologies) and may collect, process, and share personal data. Please choose which areas of our service you consent to our doing so.

    For more information on managing or withdrawing consents and how we handle data, visit our Privacy Policy at:

    Show Details
    HubPages Device IDThis is used to identify particular browsers or devices when the access the service, and is used for security reasons.
    LoginThis is necessary to sign in to the HubPages Service.
    Google RecaptchaThis is used to prevent bots and spam. (Privacy Policy)
    AkismetThis is used to detect comment spam. (Privacy Policy)
    HubPages Google AnalyticsThis is used to provide data on traffic to our website, all personally identifyable data is anonymized. (Privacy Policy)
    HubPages Traffic PixelThis is used to collect data on traffic to articles and other pages on our site. Unless you are signed in to a HubPages account, all personally identifiable information is anonymized.
    Amazon Web ServicesThis is a cloud services platform that we used to host our service. (Privacy Policy)
    CloudflareThis is a cloud CDN service that we use to efficiently deliver files required for our service to operate such as javascript, cascading style sheets, images, and videos. (Privacy Policy)
    Google Hosted LibrariesJavascript software libraries such as jQuery are loaded at endpoints on the or domains, for performance and efficiency reasons. (Privacy Policy)
    Google Custom SearchThis is feature allows you to search the site. (Privacy Policy)
    Google MapsSome articles have Google Maps embedded in them. (Privacy Policy)
    Google ChartsThis is used to display charts and graphs on articles and the author center. (Privacy Policy)
    Google AdSense Host APIThis service allows you to sign up for or associate a Google AdSense account with HubPages, so that you can earn money from ads on your articles. No data is shared unless you engage with this feature. (Privacy Policy)
    Google YouTubeSome articles have YouTube videos embedded in them. (Privacy Policy)
    VimeoSome articles have Vimeo videos embedded in them. (Privacy Policy)
    PaypalThis is used for a registered author who enrolls in the HubPages Earnings program and requests to be paid via PayPal. No data is shared with Paypal unless you engage with this feature. (Privacy Policy)
    Facebook LoginYou can use this to streamline signing up for, or signing in to your Hubpages account. No data is shared with Facebook unless you engage with this feature. (Privacy Policy)
    MavenThis supports the Maven widget and search functionality. (Privacy Policy)
    Google AdSenseThis is an ad network. (Privacy Policy)
    Google DoubleClickGoogle provides ad serving technology and runs an ad network. (Privacy Policy)
    Index ExchangeThis is an ad network. (Privacy Policy)
    SovrnThis is an ad network. (Privacy Policy)
    Facebook AdsThis is an ad network. (Privacy Policy)
    Amazon Unified Ad MarketplaceThis is an ad network. (Privacy Policy)
    AppNexusThis is an ad network. (Privacy Policy)
    OpenxThis is an ad network. (Privacy Policy)
    Rubicon ProjectThis is an ad network. (Privacy Policy)
    TripleLiftThis is an ad network. (Privacy Policy)
    Say MediaWe partner with Say Media to deliver ad campaigns on our sites. (Privacy Policy)
    Remarketing PixelsWe may use remarketing pixels from advertising networks such as Google AdWords, Bing Ads, and Facebook in order to advertise the HubPages Service to people that have visited our sites.
    Conversion Tracking PixelsWe may use conversion tracking pixels from advertising networks such as Google AdWords, Bing Ads, and Facebook in order to identify when an advertisement has successfully resulted in the desired action, such as signing up for the HubPages Service or publishing an article on the HubPages Service.
    Author Google AnalyticsThis is used to provide traffic data and reports to the authors of articles on the HubPages Service. (Privacy Policy)
    ComscoreComScore is a media measurement and analytics company providing marketing data and analytics to enterprises, media and advertising agencies, and publishers. Non-consent will result in ComScore only processing obfuscated personal data. (Privacy Policy)
    Amazon Tracking PixelSome articles display amazon products as part of the Amazon Affiliate program, this pixel provides traffic statistics for those products (Privacy Policy)