Adobe Dreamweaver CS3

Hello, today I decided to consider the most popular program for web development and server software. Why is it the most popular? Because it is universal. This is an excellent environment for the creation of html code, and to create a php, javascript and asp scripts. Also, you’ll easily be able to create css styles for your website. Do not experienced Webmasters, certainly attract the possibility of visual web site. You can real-time to see how things have changed your page, depending on your settings. Details about the program, I will write later in our review. I also give lessons to work with Adobe Dreamweaver.
What is the price of the software:
You can buy cheap Adobe Dreamweaver CS3 for only $ 99.95, the online store d-softwarehouse.com. Also not expensive to buy for $ 100.95 in unisoft-usa.com. These stores offer OEM versions of software for home use. After purchasing the software you can download it at once without wasting money on shipping and saving time.
Product Overview:
Adobe Dreamweaver CS3 - the program for the development of modern websites. Features release supports CSS and verification work in different browsers. Adobe Dreamweaver CS3 provides the opportunity to work with technologies XML, JavaScript, PHP, Adobe ColdFusion, ASP and ASP.NET. Wednesday for the development of Ajax-applications to create a product that can perform various functions related to the receipt of information from RSS feeds and databases to the creation of visual effects. Just the possibility of establishing a site based on the tag DIV. Using the platform Spry effects in Adobe Dreamweaver CS3, you can easily improve the appearance of your website. Compatibility with Adobe Photoshop CS3 allows any part of the project Photoshop CS3 insert directly into Dreamweaver CS3. Integration with Adobe Bridge provides easy access to project files and applications. Using Adobe Dreamweaver Device Central, you can create and test web pages for mobile devices. One of the main features of this release - to focus on simplifying the key points of design and layout if you want to begin to explore any technology, like Ajax, using CSS, CSS-automatic bugs in browsers, this leads to the release of all you need Spry framework for Ajax increasing number of developers willing to use Ajax, but I do not know why.

In addition, many Ajax-frame has several drawbacks - many are not compatible with some browsers, and others - to understand the complexity and writing. Live - available at Adobe Labs. Lightsome designed in such a way as to be able to work with him and the designers and developers. The ability to use HTML and CSS - it’s convenient for designers, but Spry and has great potential for Web developers. And the code gets quite easy to understand and use, and visual aids integrated into Dreamweaver CS3 allow more simplified and the creation of widgets and visual effects in a few mouse clicks. If you are accustomed to the hands of the code, and then in this case, you will be satisfied with testing for compatibility with browsers ensure proper delivery of CSS-instructions in different browsers - it is one of the many problems that Dreamweaver CS3 successfully resolved. Spent many hours on the lessons learned by the developers and designers, and tried to solve the problem of incompatibility between different browsers, with any instructions CSS Dreamweaver CS3 automatically finds the code, which can lead to incorrect rendering of the leading browsers to tell about the causes and solutions of possible problems. In addition, be able to meet your CSS-problems with a new resource Adobe - CSS Advisor: community of developers and designers of our code validator checks code for XHTML and CSS-standards. Dreamweaver CS3 - it is the first tool to automate the search and the most popular set of CSS-bugs, which enables the development of cross-browser integration with Adobe Photoshop designers often enough to handle the necessary files in Photoshop or fireworks. Sometimes there is a problem with copying and pasting files edited in Dreamweaver. This process can be simplified and improved. Now, using Dreamweaver CS3 and Photoshop CS3, you can directly copy and paste the image in Dreamweaver. Simply select the type of compression and file, as well as a place to insert into the document. Dreamweaver CS3 remember the source file, so you can easily edit the file. And all this is done very quickly addition to copy and paste, you can import it into Dreamweaver CS3 directly Photoshop CS3-paper, but Dreamweaver CS3 now understands PSD files. All of this applies to the Fireworks CS3 CSS Layouts Quite often, users are more likely to abandon the table format and the transition to Div-DTP. This means that the benefits of using CSS is clear, but because you need a lot of use. We offer a selection of templates to take advantage of one-, two-or 3-column templates that can be installed, as well as the “elastic” width.

Basic Lesson: “How to start work with Adobe Dreamweaver”

If you need more lessons with illustrations, , write about that comment and I will do it for you. Or visit this site http://www.learnwebdesignonline.com/htmlcourse/index.htm

Starting Dreamweaver
These lessons along with the screen shots has just been recently revised to use the latest Macromedia Dreamweaver 8 which was released in September 2005. Dreamweaver 8 is a major release and does contain many new features such as code collapse, word wrap, additional CSS support, zooming in design view, etc. However, if you choose not to upgrade, Dreamweaver MX version is acceptable for use in this course.

When you start up Dreamweaver for the first time after installing it, it might as you …

How to start workong with dreamweaver

Since we will be learning HTML code and will be doing hand-coding as well as the design features of Dreamweaver, select Coder. In actuality, you can choose either and you will still have all the same functionality. Except that the panels will be laid out differently. That’s all. If you had chosen Designer previously, you can switch to Coder by menu Window -> Workspace Lyout -> Coder so that you Dreamweaver will look somewhat like the screen shots in this course.

New Document
Start by creating a new HTML document in Dreamweaver with File ->New

How to create new document with Dreamweaver

XHTML is the new standard. Think of XHTML 1.0 as the version of HTML markup that is after HTML 4.0. We won’t be looking at the XHTML specnow (because the reading is too dry and technical). But just know that this link in W3C’s website (W3 Consortium’s website) is the ultimate reference point since they are the ones who defined XHMTL.

After clicking Create in the above dialog, you will see that the development environment in Dreamweaver is very similar to that of Fireworks in that you have collapsable and tear-able panels.

How to work with Dreamweaver

In Dreamweaver, there is an extra document bar with three buttons “code“, “split“, and “design” to enable you to switch between these three views. If you don’t see this bar, select menu View -> Toolbar -> Document.

Go to the code view now by pressing the code button now. Here you see the default HTML skeleton code that Dreamweaver has generated in your new document.

Dreamweaver has generated html code

These are basically the code that you would write every time you create a new XHTML document. Dreamweaver is nice enough to write them for you. The things in angle brackets are tags. The very first line that has doctype in it. This basically indicates to the browser what version of HTML code we are using.

The <html> tag indicates the start of the HTML document. And the </html> tag indicates the end of the document. Although this is really an XHMTL document, we are going to use the term HTML loosely. Note that tags often comes in pairs: <html> is the start tag, and </html> is the end tag.

You can nest additional tags inside tags. For example, inside the body of the <html> tag are the <head> tags and the <body> tags as indicated. You can say that an HTML document has two sections: a head section and a body section as shown in the above diagram.

The head section contains things like the title of you web page for example. Give our page a title by adding a title of My First Page by doing as shown.

We will now test our page in our browser to see what it looks like. Dreamweaver can launch your browser for you and load the page if you do menu Menu -> Preview In Browser.

If your menu does not have any browsers listed, you can select Edit Browser List in menu above to setup Dreamweaver to become aware of the browsers that you have on your computer.

Dreamweaver needs to have a saved document in order to preview, so it might ask if you want to save the changes made to the current document. Say “yes” and save this file as firstpage.html in a new folder called creativeworks by following these steps…

Saving document with Dreamweaver

Dreamweaver save html document

After Dreamweaver launches your page, you should see the following come up. Notice our title in the window header.
Title was created with Dreamweaver

Right now, it doesn’t matter what browser you use. However, in the Intro CSS course, you will be using both Internet Explorer and Firefox. So you might just want to get those two browsers to start with. If you do not have Firefox, it is a free download.

Dreamweaver has made this testing task easy for you by giving you a shortcut key of F12 and a toolbar button as shown.

So there is no excuse for not testing frequently.
Adding Content
So far our page is empty. We want to add some content to our page. Click the Design button to go to the design view and start typing the following.
<

Switch back to the code view. See how your content is added within the <body> tag.

The body tag is what contains the content of our web page.

Go back to the design view to add another paragraph.

Switch back to code. See how the <p> tag is used to represent paragraph.

There are two tags. One <p> tag (known as the start tag) that indicates the start of the paragraph and one </p>(known as the end tag) that indicates the end of the paragraph. The end tag is the one with a slash right after the first angle bracket. The text “The quick brown fox jumped over the lazy dog.” in between the two tag is known as the body of the tag, or the content of the tag.

What if you don’t want two paragraphs, but two lines by themselves? Go back to the design view and remove the paragraphs so that you have only one line.

Now you want to break the line at the location shown. Just do Ctrl-Enter at that location. (Ctrl-Enter is equivalent to the menu Insert -> HTML -> Special Characters -> Line Break. This menu item is buried so deep that virtually eveyone uses Ctrl-Enter instead.)

And see that the line break tag <br /> was generated…

The line break tag looks a little bit different from the other tags. What is it? It has a slash / just before the second angle bracket. If you look around in the above code, there is not other tag that looks like this.

All tags comes in pair: a start tag plus an end tag. For example, the paragraph tags: <p> and </p>. But where is the end tag for the line break tag? The line break tag does not have content in its body and therefore its start and end tag can be combined into this notation: <br />

About XHTML syntax you can read there:

http://www.htmlgoodies.com/beyond/xml/article.php/3473511
http://www.w3schools.com/xhtml/xhtml_syntax.asp

Share and Enjoy:
  • Digg
  • Sphinn
  • del.icio.us
  • Facebook
  • Mixx
  • Google
  • StumbleUpon
  • Spurl
  • Slashdot
  • Live
  • YahooMyWeb
  • Reddit

Leave a Comment

Please note: Comment moderation is enabled and may delay your comment. There is no need to resubmit your comment.