New web design - learn Dreamweaver first?

I welcome the Dreamweaver community.

After 30 years in print design, I finally made a decision to learn a little something about web design. With this goal in mind, when I updgraded to CS6, I bought "CS6 Design and Web Premium" package. The package includes Dreamweaver, Fireworks and Flash Pro. But I'm a bit confused where to start.

I always buy the Adobe "Classroom in a book" series to learn the basics or new aspects of Adobe products. All three applications have equivalents of the IPC and I think I'll but the first IPC Dreamweaver, Fireworks and Flash Pro?

So that demand, it's the right direction? I noticed on some forums of discussion that some use Fireworks more than Dreamweaver: I want to just make sure I'm on the right track.

Any suggestion would be appreciated.

Clinton

Welcome to the community of DW, Clinton!

30 years - which is an experience that you have up your sleeve!

Web Design, fine, it works this way. It is in 2 parts - to start:

  • Design / layout / layout / wired / UI (two see it differently) - but the end goal is the same - to create the "design", in itself, that your site will look like
  • Development / slicing / Compositing / CSSing / PSD - CSS (again, different references) - make the "design", you did in an application such as Photoshop or Fireworks to be "web-friendly" - in other words, making .html and .css files that are the "basics" for a Web site

Most web developers (including me) use Photoshop to create cuts of design (PSD files) we send back a million times the customer to get their approval. Then "decide" elements such as backgrounds, boxes, etc... Then open Dreamweaver, write the tag ""-which is the 'what' you want to display on your website (content, tables, boxes, widgets, snippets, etc...). Then, 'style' using 'CSS' Web site - for the match at the "PSD" that the customer had approved.

That's it: I don't know if I could have put it more!

CSS - Cascading Style sheet - is a piece of code that tells browsers how your website should be displayed. Height, spacing, margins, width, color, type of display, etc... With the birth of CSS - 3, things are even easier. A few key elements that can make the CSS-3 are lets say, Gradients, rounded edges, etc... (for which, you had to use a real .png or .jpg image in CSS - 2). Now, CSS - 3 can give you the same exact effect with no use of an image.

HTML - now that HTML5 quickly supplanted the old web standards, you have decided to start your 'web journey' at the right time, I would say. HTML5 has infinite possibilities of creation 'sensitive' Webdesign - reactive, which means Monotype, multi-devices - for desktop computers, Tablet & mobile phones.

With all that said, that Dreamweaver CS6 has some great tools for HTML5 standards like 'fluid Grid Layout"- with which you create 1 design, code 3 different documents CSS and BAM - your website will be optimized for all devices 3.

Fireworks - certainly usable for web design. CS6 Fireworks has also some great tools such as 'Generator of CSS' gives you the CSS code for an item of the chosen design - in other words, the design in Fireworks, go over it, fireworks will generate the CSS code for you.

jQuery - you should watch this - a few great 'plugins' that you can use in your website design / development. Now that 'Flash' is a kind of death (modern Pocket PCs do not support Flash), jQuery is your friend. Best part is completely open source.

The next step - dynamic Web sites - as its name suggests, you can get in the construction of more "interactive" sites - such as a shopping cart, etc... then once you get a good shot of some basic CSS HTML &. And if you decide to use jQuery, you will get also a script - what is essential to build interactive websites as you progress.

You can take a look at this video on Youtube. I know that there not too many views. But I personally think it's a good place to start with Fireworks - http://www.youtube.com/watch?v=NrJmyYfNu1M

This maybe go a little above your head right now - since you are a beginner to the top. But, feel free to ask questions as and when you have one, and we will be happy to help you! The world needs more of web designers / developers after all!

All the best.

-ST

Tags: Dreamweaver

Similar Questions

  • Help - new Web design - need help to create a web gallery

    Hello world

    I am new to web design. I'm working on my first site and I have a bunch of images (approximately 30 or more) I want to put in a web gallery with captions. I know there are a ton of tutorials Gallery out there, but I'm a little hesitant, which might work better for me. You see although I Flash I am not too well known in it yet so I use mainly Dreamweaver to create my whole site. I'm also not sure how to allow visitors to view a Flash site - is - it downloads required to display it? That's why I'm kind of leaning towards not not using a Flash due to my lack of accessibility inexperience and the user web gallery. I'm basically looking for a web gallery with thumbnails on the side or at the top or bottom that if clicked open the picture in a larger preview area. I also have captions under each photo. I also want it to look sharp or professional (with a clean container, it sits in) do not like some of those that I see that you can create in DW automatically that looks as it did in the 1980s, haha.

    If you guys can point me in the right direction, I would be very grateful. I know I still have a lot to learn, but I appreciate the help.

    Thank you!

    And while we're name commercial products, I find it an excellent product

    http://www.WebAssist.com/PHP-scripts-and-solutions/powergallery/

    GRAMPS

  • IM new web design and need advice

    Hello

    Im very new web site design and need some advice. Ive been designing with Photoshop, Illustrator and Indesign for a few years and say im at a high level of proficiency with them.

    I am now wanting to move in design for the web. I just learned html and css and I'm learning Flash and Dreamweaver. I have so many questions that I put everything at once.

    The first question is how all of these de-it-ur-self sites using CMS affect the market of the Web designers? It reduces demand for web designers because most people will now be able to build their own Web site using templates.

    Secondly, what languages/programs, and in what order do you think would be useful for someone like me who wants to double as a graphic designer/web designer to know.

    I went to see a professor on the subject and he said that if I am primarily a designer (who am) as opposed to a developer I should just learn html, css and javascript. But others said that, beyond the creative skills of a designerit is very useful for a freelance or someone in the job market learn MySLQ, ASP, coldfusion, PHP, and many others.

    Please give me advice. Your suggestions will be much appreciated.

    Thank you.

    "How do all these sites of-it-ur-self with the help of CMS affect the market for web designers?"

    of course, it has an impact on the way people develop Web sites. but I don't think that the market will suffer serious problems from it. There are very many companys who want professional web developers with a unique design and structure. You can, of course, deal with it using wordpress & co. by yourself. not as a whole structure, since it will be maybe not quite adaptable. You can use it as a structure for articles as well - on blog.banklupe.de: they designed a unique structure for the Web site and used the CMS of wordpress for the blog - and has adapted, he would comply with the CI. the advantage: wordpress is easy to use and webdesigner have better to do than post blog - writers can do themselves.

    --> the market is constantly changing, just learning how to benefit from. :-)

  • Web design learning programs

    Hello

    I would like to start learning web design programs, I'm a print designer and I think I should start thinking to introduce, what programs should I learn so I can get hired.,.

    Thank you.

    Muse or Dreamweaver... ask specific questions in the forums for these programs

    Forum of https://forums.adobe.com/thread/1929760 to find a forum for your program list

  • new Web design - when you import PNG, gray of the background

    Hey there,
    When I import a transparent PNG in dreamweaver, the background, it is grey when I publish.
    I can change the background of the cell, but then, when Gray published...
    what I am doing wrong?

    Thank you
    Matthew

    ocycproductions wrote:
    > Hey there,.
    > When I import a transparent PNG in dreamweaver, the bottom
    > behind it is grey when I publish.
    > Can I change the background of the cell, but when it is
    > published... Gray...
    > what am I doing wrong?

    http://www.TJKDesign.com/articles/png_overlay_with_no_extra_markup.asp

    HTH.

    --
    Thierry
    Articles and tutorials: http://www.TJKDesign.com/go/?0
    Perfect FAQ page: http://www.TJKDesign.com/go/?9
    Templates CSS - P: http://www.TJKDesign.com/go/?1
    CSS tabs menu: http://www.TJKDesign.com/go/?3

  • I have a question comparing Dreamweaver and Muse.  Can I create a website with Muse, then learn Dreamweaver, and edit the site Web of Muse?  Or would I need to start over with a new Web site based on Dreamweaver?

    I have a question comparing Dreamweaver and Muse.  Can I create a website with Muse, then learn Dreamweaver, and edit the site Web of Muse?  Or would I need to start over with a new Web site based on Dreamweaver?

    I went the same route. I started to want to learn web design and the Muse is an excellent tool. The code it generates, however, not to use it in Dreamweaver. This could be done, I think this isn't worth it, even for a real Geek. Once you get to Muse you will find there are things missing, stuff, you want to do, but are just tough in Muse or you can buy a widget. It is possible in DW and you get which through subscription, so it makes sense. Me what I know now, I'll go directly to DW to learn, except if you want results right now. If you don't want something to cause I stay with Muse and maybe learn to animate CC to add some pizazz to the site. If you only want a simple layout and a couple supporting stick with Muse pages if you want a larger site use DW. Good luck and check out this page to Muse on Google Plus Adobe Muse for beginners - community - Google +...

  • I am a student and I bought the web of adobe design premium in my first year. Recently, my computer got crashed and I had to buy a new one. I'm trying to figure out how to reinstall adobe web design premium on my new computer.

    I am a student and I bought the web of adobe design premium in my first year. Recently, my computer got crashed and I had to buy a new one. I'm trying to figure out how to reinstall adobe web design premium on my new computer.

    Click on the drop-down list below the product you wish to download. Then you will receive the link to download the installation file.

  • I have a site designed iWed which I can't = up to date. I want to design a new Web site with a different place (everweb?) How can I get rid of the current site? I want to use the same domain name.

    I have a designed iWeb site I need to update. I know I can't use iWeb so want to design and publish a new Web site. I want to use my current domain name. How can I get rid of the existing site?

    So, you want to delete this Web site. That's right?
    If so, you can make trought accessing the website 'admin panel' or 'FTP '.

    An administration panel (or "administration panel") is a site that your host/domain provides to you, where you can change everything you want - even is for 'FTP', 'FTP' is a server where you access your Web site and change what you want, and that includes delete the current Web site.

    Questions please ask.

  • I am a student in learning Dreamweaver and for our first sensitive assignment, it must include a sensitive video of YouTube.  I don't use a Bootstrap - I simply uses percentages to make sensitive elements.  I was able to insert video but cannot

    I am a student in learning Dreamweaver and for our first sensitive assignment, it must include a sensitive video of YouTube.  I don't use a Bootstrap - I simply uses percentages to make sensitive elements.  I was able to insert the video but can't make it sensitive.  I guess I should put a div around the iframe and make this 100% div width/height auto but apparently that's not true, because that does not affect the video.  Thank you very much.

    Any advice will be greatly appreciated!

    Here's a good page that goes into how to make a sensitive youtube embed video...

    Video fluid width

  • I have been designing a new Web site and when I publish on BusinessCatalyst the index page shows a sign 'coming soon '? This has never happened before and I don't know how to solve this problem?

    I have been designing a new Web site and when I publish on BusinessCatalyst the index page shows a sign 'coming soon '? This has never happened before and I don't know how to solve this problem?

    I have published on an existing site, but also a new site, but I get the same message?

    Hello

    Open the page that wants to set as your home page,

    Click on more action-> set as start page

    Now visit the site again, it should be good.

    Let me know if you have any question.

  • get a new computer.  I need to reinstall my creative suite adobe 6 web design and premium.  My drive is not helping and is nor the web site.  Please, please help.

    get a new computer.  I need to reinstall my creative suite adobe 6 web design and premium.  My drive is not helping and is nor the web site.  Please, please help.

    P.S. If you don't like our help, you can always contact customer service.

  • WordPress and Adobe who gather in Web design

    A few years ago, I really leaned on the Adobe software for my web design and development. I was able to cut out a massive image I had created and jump them in Adobe Dreamweaver to make the required code changes. Once I learned how, I then go into Adobe Flash and add new features like the old logos that can turn etc.

    But now things have changed and everything seems to be done in the web interface or Notepad ++. Simple designs are becoming more popular than ever, because mobile devices don't want an image rich process of loading long whenever they load a web page. Sites like SearchBuzz have only the logo created in Adobe software now.

    I agree that CC is a great value for what you get, but PhoneGap appears to be the only way that mobile are focused on Adobe software when it comes to web design and development. And it's really only for the applications.

    What else did offer Adobe that can help a mobile web based to flourish?

    Ash

    First of all, let's get our clarified conditions.

    Mobile applications-

    Here are the widgets that people download to their mobile device.  These applications are built specifically to run on an Android or iOS, Blackberry, etc... Apps don't usually have nothing to do with the web site of the company.  Applications range from updates on the traffic/tracking the weather, your health/fitness, productivity, entertainment, weight loss/dieting, games, GPS, you name it, it's probably not there...

    jQuery Mobile is often used to build the mobile application while PhoneGap is used to compile the application for specific devices and then download it to a distribution site like Google or Apple App store game.

    Mobile web site development .

    It is a different discipline.  The Web sites that run on desktop computers, computers laptops, tablets and mobile devices are called adapted.  Adobe has many ways to help web site designers to create responsive web sites.

    Moreover, there are 3rd party extensions & frames that you can use in DW to go start your sensitive web designs.


    http://www.Initializr.com/

    All that being said, if I were to build a WordPress site, I would certainly use a sensitive commercial theme as starting point.  There is no sense to reinvent the wheel.

    Nancy O.

  • Web pages will not regenerate after I make changes, (Web Designer) very frustrated!

    Web pages will not update or refresh for at least 5 minutes or more, very frustrated.
    It is not my browser, I have two computers, one with a XP with Win7 and win 7 (only 3 months) does not update the pages, I use force refresh all the time.
    It makes me crazy, I'm a Web Designer and I can't work like this. What is going on? and how do I fix it?

    Specific developer resources include:

    MSDN IE development forum (post these questions here instead)
    http://social.msdn.Microsoft.com/forums/en-us/iewebdevelopment/threads

    Tip: When you post in the developer forums, always include a link to your web site or pages to test in your first post.

    IE Developer Center
    http://msdn.Microsoft.com/en-us/IE/default.aspx

    Learn how IE8
    http://msdn.Microsoft.com/en-us/IE/aa740473.aspx

    Expression Web SuperPreview for Internet Explorer (free and autonomous visual tool for debugging for IE6, IE7 and IE8)
    http://www.Microsoft.com/downloads/details.aspx?displaylang=en&FamilyID=8e6ac106-525d-45d0-84db-dccff3fae677

    Expression Web SuperPreview Release Notes
    http://www.Microsoft.com/expression/products/Web_SuperPreviewReleaseNotes.aspx

    Validators:
    http://validator.w3.org/
    http://Jigsaw.w3.org/CSS-validator/

    =========================

    You'll find user support for Internet Explorer in this MS forum: http://social.answers.microsoft.com/Forums/en-US/InternetExplorer/threads

    Quote your full version of Windows (for example, WinXP SP3;) Windows XP 64 - bit SP2; Vista SP1; Vista 64 - bit SP2; Win7; Win7 64 bit) as well as your current version of IE (for example, IE6, IE7, IE8) in your first post.

    ~ Robear Dyer (PA Bear) ~ MS MVP (that is to say, mail, security, Windows & Update Services) since 2002 ~ WARNING: MS MVPs represent or work for Microsoft

  • How to create an Admin page that allows a person to change the Web site? (dreamweaver CC)

    I designed my entire Web site and uploaded to the server, however, I now have to design an admin page that will allow a person to change the site from this page. For example, change some images and text.

    Please help me on the steps of the creation of the admin page. I am completely new to web design. I understand that it is bound to PHP. I can't find useful tutorials online.

    Nothing built into DW that can do all this for you. If you do not have a good knowledge of PHP or other language server-side and how to work with databases like mySQL, you won't be able to do it by yourself in the short term. Learning enough PHP to create a house content management system and to keep the system secure, takes time. Beyond copy / paste, 1-2-3 step style tutorials. A book titled PHP Solutions by David Powers would be a great place to start but.

    If you are more interested in getting up and runing quickly, look into an existing CMS like WordPress, instead. Everything you need is already built and most hosting companies now offer facilities of WP as part of your standard package. It's a little more complicated to work with DW and WP, chances are that you wouldn't need DW at all, especially if you're new to web design in general.

  • Failed to get @font-face to work on my new web site

    Hello world

    I can't @font-face to work on my new web site.
    I tried before on other websites, and it works beautifully.

    Here is the code I use:

    CSS:
    @charset "utf-8";

    {@font-face}
    do-family: 'Caviar Dreams', without the serif! important;
    make-style: normal;
    SRC:URL ("'... / fonts/CaviarDreams.ttf") format ('truetype');

    SRC:URL("..) ("/ fonts/CaviarDreams.eot") format ('eot');

    SRC: url("..) ("/ fonts/CaviarDreams.svg ') ('svg') format;

    SRC:URL("..) ("/ fonts/CaviarDreams.woff") format ('woff');

    SRC:URL("..) ("/ fonts/CaviarDreams.otf") format ('otf');
    }

    / * Simple fluids
    Note: Fluid requires that you remove the attributes height and width of the media of the HTML
    http://www.alistapart.com/articles/fluid-images/
    */
    IMG, object, embed, {video
    Max-width: 100%;
    }
    / * IE 6 doesn't support max-width so 100% width by default * /.
    . IE6 img {}
    Width: 100%;
    }

    /*
    Properties Grid Dreamweaver fluid
    ----------------------------------
    DW-num-CLO-mobile: 5;
    DW-num-CLO-Tablet: 8;
    DW-num-OCOL-Office: 10;
    DW-gutter-percentage: 25;

    Inspiration of "Responsive Web Design" by Ethan Marcotte
    http://www.alistapart.com/articles/responsive-Web-design

    Golden by Joni Korpi grid system and
    http://goldengridsystem.com/
    */

    / * Mobile layout: 480px and below. */
    {body
    background-image: url (.. / images/background/wraper_bg.jpg);
    background-repeat: repeat no.;
    background-attachment: fixed;
    background-size: 100% 100%;
    do-family: 'Caviar Dreams', without the serif! important;
    }
    {.caviar}
    do-family: 'Caviar Dreams', Arial, Helvetica, sans-serif;
    }
    {.index_bg}
    Width: 100%! important;
    height: 100%! important;
    Background: url (.. / images/graphics/index_bg.png)! important;
    background-size: coverage! important;
    }
    {.welcome_image}
    position: absolute;
    high: 35%;
    Width: 95%! important;
    margin: 2%! important;
    }
    . NAV {}
    color: #FFFFFF! important;
    do-family: "Britannic Bold"! important;
    do-size: 14px;
    Police-weight: lighter! important;
    }
    {.background_white}
    Background: RGBA (255,255,255,0.7);
    }
    {.background_black}
    Background: RGBA (0,0,0,0.65);
    }
    {.background_black_2}
    Background: #000! important;
    }
    {.background_noir}
    Background: RGBA (179,1,1,0.7);
    }
    {.background_purple}
    background: rgba (152,131,201,0.7)! important;
    color: #FFFFFF! important;
    Width: 100%! important;
    height: 25px;
    text-decoration: none! important;
    do-family: 'Caviar Dreams. "
    border: 0px! important;
    margin: 0px! important;
    padding: 0px! important;
    }
    {.background_purple:hover}
    Background: #FFFF00! important;
    Color: #000! important;
    Width: 100%! important;
    text-decoration: none! important;
    do-family: 'Caviar Dreams. "
    border: 0px! important;
    }
    . White {}
    color: #FFFFFF! important;
    }
    . Black {}
    Color:RGBA (0,0,0,1)! important;
    }
    . Red {}
    color: #B30101! important;
    }
    . Yellow {}
    Color: #FFFF00! important;
    }
    {.black_span}
    Background: #000000! important;
    color: #FFFFFF! important;
    margin: 1%! important;
    margin-left: 5px! important;
    padding: 5px! important;
    }
    {.black_span_margin1}
    margin-left: 0px! important;
    }
    {.black_span_margin2}
    margin-left: 0px! important;
    }
    {.border_white}
    border: 3px solid #FFFFFF! important;

    margin: 0px! important;
    padding: 0px! important;

    }
    {.border_gold}
    border: 0px solid #000! important;
    margin: 0px! important;
    padding: 0px! important;

    }
    H1, h2, h3, h4, h5, h6 {}
    do-family: "Britannic Bold"! important;
    Police-weight: lighter! important;
    color: #FFD700! important;
    margin-left: 2%! important;
    margin-right: 2%! important;
    margin-top: 2%! important;
    margin-bottom: 2%! important;
    }
    {p}
    do-family: 'Caviar Dreams', Arial, Helvetica, sans-serif! important;
    do-size: 16px! important;
    color: #FFFFFF! important;
    margin-left: 2%! important;
    margin-right: 2%! important;
    margin-top: 2%! important;
    margin-bottom: 2%! important;
    }

    small .text {}
    do-size: 12px! important;
    }
    {.caviar}
    do-family: 'Caviar Dreams! important;
    }

    I'm trying to use the police Caviar dreams on my new web site, but I can't do things.
    Can someone tell me what the problem is.

    And also I would like to help with IE9, it seems that the header is the display in blue instead of black on IE9 and 10.

    My website adrees is marcoalexwebdesign.site11.com .

    I've solved the problem, it seems trhat in dreamweaver, the fonts ttf, otf, etc. must be in a folder named InDesign and dreamweaver then connects the fonts style sheet to the main stylesheeet with @inport. I had to unisntall the fonts of my windows, and download it again and add tehm with dreamweaver adds the functionality of web fonts.

    Ayway thanks.

Maybe you are looking for