Jump to content


Photo

Dreamweaver and fireworks


  • Please log in to reply
8 replies to this topic

#1 aussie11

aussie11

    New member

  • New Members
  • 11 posts

Posted 26 December 2009 - 06:37 PM

Hey to all
Just trying to wrap my head around web development, dreamweaver, fireworks and everything related, including css.
Loved the dw tutes by stefan.
This is probably a dumb question, but i'm new to all this so bear with me. Many times i see people have built entire web pages
in fireworks, but then they slice it up to import to dreamweaver, instead of just exporting it complete.

What is the purpose of this? Is it because the file size, and the loss of quality when the image is optimized in fireworks before exporting? I am curious about this, and the answer will probably be apparent as I head down the learning curve, but may be
some can just tell me.
Thanks
aussie
  • 0

#2 virtual

virtual

    Advanced Member

  • Advanced Member
  • PipPipPipPip
  • 883 posts
  • LocationLa Jolla, California

Posted 28 December 2009 - 12:19 PM

Very briefly, if you make your design in Photoshop or in Fireworks it is just one big image. This mockup is very useful so that you have something tangible you can show a client, that he can approve or modify, before you get into the actual coding of the site.

To make the image functional in a website, you then need to slice up the different parts that you are going to use for different elements in your website. For example, the main background image, if it not just a colour, would be separate from the images that you would use for the header, footer or for navigational purposes.

File size is also important, and each image that you use on the web should be saved "optimized for the web".
  • 0
Lynne
180virtual

#3 aussie11

aussie11

    New member

  • New Members
  • 11 posts

Posted 28 December 2009 - 10:11 PM

Thank you for the enlightenment. Make sense now that I have heard it.
Regards
aussie
  • 0

#4 philmonk

philmonk

    New member

  • New Members
  • 6 posts
  • LocationOxford, UK

Posted 20 January 2010 - 09:51 AM

Think Fireworks for prototyping, Dreamweaver for building.

Fireworks is useful because you can quite easily prototype a fully functional website and show to a client without the need to start coding all the HTML and CSS. It's also easier to make changes, especially structural ones if the client doesn't like something.
  • 0

#5 Stefan

Stefan

    Stefan Mischook

  • Administrators
  • 4,161 posts
  • LocationMontreal Canada

Posted 20 January 2010 - 12:00 PM

Very briefly, if you make your design in Photoshop or in Fireworks it is just one big image. This mockup is very useful so that you have something tangible you can show a client, that he can approve or modify, before you get into the actual coding of the site.


That's the way to do it. Get the final approval to the design before even writing one line of HTML or CSS.

Stef
  • 0
StudioWeb makes teaching web design and programming easy: StudioWeb

#6 WebZombie

WebZombie

    New member

  • New Members
  • 2 posts

Posted 24 February 2010 - 04:43 PM

I'm currently a web design student. I have a question that I haven't gotten an answer to but not for lack of trying. While I don't need client approval before implementing my Photoshop (with slices), I am stuck on how to actually get dreamweaver to import my images (sliced up so its like 20 images). My professors could tell me how to slice it up, but they seem clueless when asked how to implement them. Feeling frustrated as I'm just trying to do my portfolio site, and this seems like something that would be basic for an education in web design!
  • 0

#7 Ben

Ben

    Administrator

  • Administrators
  • 5,552 posts
  • LocationChico, CA

Posted 24 February 2010 - 04:54 PM

Well, there are three ways to add images to Dreamweaver.

-- Add the images through the code view using HTML (http://www.tizag.com/htmlT/images.php)
-- Add the images through the code view using CSS (http://www.tizag.com.../background.php)
-- Add the images through the design view: by selecting Insert > Image

I would highly suggest that you learn the actual code that makes up webpages -- it's a lot faster and more efficient for you to understand what you are doing. Dreamweaver can generate some code for you, but if you don't understand what it is doing you'll have significant trouble troubleshooting when you have issues.
  • 0
Benjamin Falk
Falken Creative : Twitter

#8 WebZombie

WebZombie

    New member

  • New Members
  • 2 posts

Posted 25 February 2010 - 01:37 PM

Well, there are three ways to add images to Dreamweaver.

-- Add the images through the code view using HTML (http://www.tizag.com/htmlT/images.php)
-- Add the images through the code view using CSS (http://www.tizag.com.../background.php)
-- Add the images through the design view: by selecting Insert > Image

I would highly suggest that you learn the actual code that makes up webpages -- it's a lot faster and more efficient for you to understand what you are doing. Dreamweaver can generate some code for you, but if you don't understand what it is doing you'll have significant trouble troubleshooting when you have issues.


Thanks for your help! Actually I figured it out last night before going to bed, which is a huge relief. Now onto other problems (i.e., converting away from tables, which is my next assignment).

I've found that the design view is only useful for getting a general picture of what the site will look like as well as preview. Before posting, one problem I noticed was that my CSS wasn't linked correctly to the page. After some other tweaking, the preview now looks almost right!
  • 0

#9 Ben

Ben

    Administrator

  • Administrators
  • 5,552 posts
  • LocationChico, CA

Posted 25 February 2010 - 01:41 PM

I've found that the design view is only useful for getting a general picture of what the site will look like as well as preview. Before posting, one problem I noticed was that my CSS wasn't linked correctly to the page. After some other tweaking, the preview now looks almost right!


I've heard that Dreamweaver CS4's preview is pretty good, but the older the version, the more issues the preview has, especially when dealing with CSS. Like you say, the preview is a guide only. Don't trust the preview -- test your site in actual browsers.
  • 0
Benjamin Falk
Falken Creative : Twitter




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users