how to quickly mock-up design a website within 10 minutes in Fireworks.
This Video shows how to design a website home page from beginning to end. You’ll see a few design tips and tricks that you can apply to your own project or website.
@kreativedevelopments Thanks for the info but actually I did need to specify a height they way I was building my site. For height I placed height:100% in the CSS and that corrected my error. Not placing it in their created havoc with my styling.
@pecatyree I use Camtasia studio to edit my videos. Not sure about the last question, but no I can’t publish the website from the Fireworks program that I use. You still have to ftp the files over.
umm umm umm err err eerm. You offer good advise but most annoying to listen using these “words” and most annoying duplication of words and tutting sounds. Hope this helps.
@whytimjenkins Fireworks is just like Photoshop. Think of it as a lighter version. It doesn’t have all the PS bells and whistles but it has pretty much everything you need for creating solid web graphics and exporting to jpegs, etc. I use it just as you described. Create mock-ups, then slice and code with dreamweaver or any text editor of choice.
so is fireworks like a photoshop for web design? i’m a bit confused about where it could fit in to my work flow. i currently design in photoshop and slice it up/crop it to create my elements, then code it in dreamweaver.
I’ve favorited so i can use this when i can be bothered to make my portfolio look good! My current one has just been done in photoshop and iweb, so it’s kinda basic… Plus my dreamweaver cs4 glitches so none of the buttons have images! =S
Thank you for taking the time to develop. A suggestion – it would be helpful to talk through some of the tools you are using during the design process for those who are at the front end of the learning curve. That said, this is a great video with a clean, streamlined design approach.
@GeoAl09 The dimensions for this site I believe was like 900px in width. I use anywhere from 800px to 960px, it’s really up to you. And yes, it should be the same inside all browsers.
I just used the rectangle tool in the tool bar section. It’s the tool normally on the left side tool bar in the “vector” section. It’s where you can draw rectangles, circles, etc.
Probably a stupid question, but how do you save them as html files or whatever, so that they’re ready to be put in my ftp programme?
Is there something that Fireworks can and illustrator or photoshop cant?
thanks for the vid really informative
@pakt40 Yeah if you set it to 100% it auto expands with content. I’ve designed a site but it looks like crap.. im not a good designer
@kreativedevelopments Thanks for the info but actually I did need to specify a height they way I was building my site. For height I placed height:100% in the CSS and that corrected my error. Not placing it in their created havoc with my styling.
@pakt40 you dont need a height, cause it expands in the browser with content
@mlwebco ok
@pecatyree I use Camtasia studio to edit my videos. Not sure about the last question, but no I can’t publish the website from the Fireworks program that I use. You still have to ftp the files over.
wat video studio editor do you use and can your
website actually be published
umm umm umm err err eerm. You offer good advise but most annoying to listen using these “words” and most annoying duplication of words and tutting sounds. Hope this helps.
great video
brazilians congratulation you
@whytimjenkins Fireworks is just like Photoshop. Think of it as a lighter version. It doesn’t have all the PS bells and whistles but it has pretty much everything you need for creating solid web graphics and exporting to jpegs, etc. I use it just as you described. Create mock-ups, then slice and code with dreamweaver or any text editor of choice.
so is fireworks like a photoshop for web design? i’m a bit confused about where it could fit in to my work flow. i currently design in photoshop and slice it up/crop it to create my elements, then code it in dreamweaver.
Seems like fireworks would cut out a few steps.
i like this template you created, it’s very clean.
I’ve favorited so i can use this when i can be bothered to make my portfolio look good! My current one has just been done in photoshop and iweb, so it’s kinda basic… Plus my dreamweaver cs4 glitches so none of the buttons have images! =S
Thank you for taking the time to develop. A suggestion – it would be helpful to talk through some of the tools you are using during the design process for those who are at the front end of the learning curve. That said, this is a great video with a clean, streamlined design approach.
@GeoAl09 The dimensions for this site I believe was like 900px in width. I use anywhere from 800px to 960px, it’s really up to you. And yes, it should be the same inside all browsers.
what are the dimensions of the white space? is it the same as inside a web browser like firefox or IE?
@GeoAl09 thanks, glad you liked it.
amazing video!
Nice Video dude
Nice Work, Well I only make Advance Tutorials of FireWorks CS4.
Thanks Brian!
Great job. This is the first time I’ve seen someone design a page completely within FW. Nice workflow!
I just used the rectangle tool in the tool bar section. It’s the tool normally on the left side tool bar in the “vector” section. It’s where you can draw rectangles, circles, etc.