Boss say "No More Dreamweaver?"

[p2409]

Doing things the DW way is a choice with big ramifications. Either everyone uses it or noone at all I reckon. I'd hate to work in a place where a few people chose to use DW then force everyone else to maintain its quirky, bloated and just plain weird code. DW/Coldfusion etc. - 90s technology that seems sort of irrelevant today.

[webnology]

Hey, let's all go back to the VI editor ;-)

Off course DW is a productivty booster. And it has nothing to with PHP, ASP, or whatever other language. Try to talk and explain to the developers how to best 'filter' the problems you' re having. Don't loose DW. If you ue it in the correct way, it's not such a dirty code as people say.

[Stormrider]

'The correct way' is 'In code view only'.

My boss used to use dreamweaver, it really screws around with the code, adding its own indenting rules and playing about with things. Hopefully there are options to turn that kind of rubbish off though.

[yollyP]

A good approach is very effective rather than having "tantrums" galore. Anyway, he's your boss and he knows best, although you are most qualified to do the decision in relation to your designing scheme, but...hmmmm just do what you think is best for your job.

[Enoch Root]

Okay … I'm not an expert on Dreamweaver (I use it reluctantly at the office because I must). How do I replace all instances of 'foo' with 'bar', but only on lines that start with a digit?

That's a single command in Vim:

:g/^[0-9]/s/foo/bar/g

So if your statement is true, there must be an equivalent feature in DW, but I can't find it. We use DW MX 2004, though. Perhaps it was added in a later version?

There is an option to "use regular expression" in the find and replace dialog in CS3. I can't remember if it was there in earlier versions.

[AutisticCuckoo]

There is an option to "use regular expression" in the find and replace dialog in CS3. I can't remember if it was there in earlier versions.

I know, but I can't get it to work. I tried finding ^(\d.*)foo and replacing it with $1bar (which isn't fully equivalent, but would work if you applied it repeatedly), but DW says it doesn't find anything. And yes, I did check the 'Use regular expression' box.

My point was that there are far more powerful editors than DW, and I was challenging Stephen's claim that DW could do everything all other editors can do. Even if there's a workaround for this specific issue, there are other powerful commands in, e.g., Vim that DW will never be able to match.

For instance, I don't think you can show multiple files in a single tab in DW, or use multiple copy/paste buffers.

[Bayliss Trevor]

The bottom line is that you are a designer so you should either give the programmer photoshop .psd files with the design and he/she does the design or you have to learn css and xhtml and give him her proper validated code. You should not be using tables for design only for tabular data.
What I would suggest is you take a screen grab of your design that you made in dreamweaver and send that to your programmer. You either need to change your job spec or get trained in css/xhtml.
I really would have thought you would have taken the time to learn xhtml it is not difficult especially as it seems that is your job!! Good luck with the studies

[Bayliss Trevor]

Or maybe ask your boss to give you some time to learn css and xhtml/send you on a course or maybe he could put aside an hour or two each day so you can sit down with the programmer and he could teach you. hths

[gRoberts]

I started off with Dreamweaver and moved swiftly to a text editor with syntax highlighting.

There are a lot different text editors with additional features to aid web development. All of my xhtml, css, javascript and php is done by hand.

My choice of text editor has the ability to render the file using an internal browser. This way I can toggle between a live view and a code view of the code using a combination of keys.

My only draw back is FTP. Unfortunately the ftp clients built into said text editors are usually rubbish, so i've had to resort to using FireFTP which has been good for a while but its starting to annoy me (uploading empty files.)

I may see what DW CS4 is like as I remember the upload/download feature was probably the best part of it.

[JimmyP]

Okay … I'm not an expert on Dreamweaver (I use it reluctantly at the office because I must). How do I replace all instances of 'foo' with 'bar', but only on lines that start with a digit?

That's a single command in Vim:

:g/^[0-9]/s/foo/bar/g

So if your statement is true, there must be an equivalent feature in DW, but I can't find it. We use DW MX 2004, though. Perhaps it was added in a later version?

FIND: ((\r|\n)\d+.*?)(Foo)
REPLACE: $1Bar

[Dark Tranquility]

Well, I believe you are using DW in the design view, which is the wrong way to code web pages! Not to mention the fact that you are still using tables to hold your content which is very bad! I don't know the motives of your boss… But if he's stopping the use of DW to have you code your pages by hand with a decent Text editor and to channel you towards stopping the use of old bad techniques (like using tables for design), and guide you to understand that will have to obey semantics rules and only use tables for tabular data then he’s doing the right thing IMO!
You will lose some time learning but in the end the benefits will be really bigger IMO...

Okay … I'm not an expert on Dreamweaver (I use it reluctantly at the office because I must). How do I replace all instances of 'foo' with 'bar', but only on lines that start with a digit?

That's a single command in Vim:

:g/^[0-9]/s/foo/bar/g

So if your statement is true, there must be an equivalent feature in DW, but I can't find it. We use DW MX 2004, though. Perhaps it was added in a later version?

BTW Tommy, did you switch to/try Kompozer?

[Another Designer]

Are we talking asp . net here? Bc we're in the wrong forum if so

Dreamweaver has nothing to do with the programming language. It's basically just a glorified text editor.

To question an asp programmers knowledge of html (or even Dreamweaver for that matter) is absurd

Yes I am talking about ASP.NET. It looks like I posted in the wrong forum. My apology.

[Another Designer]

You see most company owners don't know (but they are learning quickly) that by creating these 1999 tabled monstrosities you are in fact excluding about 5% of your potential clients from using your website.

Okay, it's learning time. If I don't use tables (which I finally feel I have mastered), what do you suggest I do? I started using Layers (yes, in Dreameaver), and they never staid in the same place in different browsers.

[AutisticCuckoo]

FIND: ((\r|\n)\d+.*?)(Foo)
REPLACE: $1Bar

That almost works. It only replaces the first occurrence on each line, though.
And it won't work if the first line looks like '123 bla bla foo bla bla'.

According to their own documentation, their regular expressions should support '^' to match the beginning of a line. But apparently that's a lie.

BTW Tommy, did you switch to/try Kompozer?

I don't even know what that is, but we're stuck with DW MX 2004 until we've implemented the new CMS. That's not far off for the intranet, but it won't happen until the end of next year for the external website.

[codythebest]

Drawing on the ground with a stick is better than notepad :P. At the very least get an editor with code colorization.

Neah...no need...Again, I know where my codes are and see the results right away. If there is a mistake, by seeing where, I can fix in no time...
I code since way before DW or frontpage. I began in basic in 1981 with a TRS-80...First HTML attempt in 95 with...notepad...

[Stormrider]

Okay, it's learning time. If I don't use tables (which I finally feel I have mastered), what do you suggest I do? I started using Layers (yes, in Dreameaver), and they never staid in the same place in different browsers.

XHTML/CSS. Hand code the XHTML, then apply styles using CSS.

The document should be marked up using the elements semantically - ie, lists marked up as lists, paragraphs marked up as paragraphs, etc. Ignore the styles or what it looks like for this bit.

Then you can use the HTML elements in your documents to apply styles, background images etc. If you need more elements to hook the styles to, you can use <div> for block level elements, and <span> for inline level ones.

There are a lot of good websites out there that will teach you, but the best way is to play around with it. Learn about the CSS box model, how floats work and you should get a good start.

[Centauri]

There are no such thing as "layers" in html.

Write the page content using appropriate tags (ie <p> for paragraphs, <h1>,<h2>,<h3> etc for headings, <ul>s and <ol>s for lists etc etc. Then logically group like content in divs according to the layout, and style using css with any graphics used for presentation (to make it look nice) being applied as backgrounds via the css (only graphics that can be considered "content" should be in the html).

This is a complete reversal of the old practice of making a framework (with tables or whatever) and trying to fit content in - nowadays the important thing is the content, and then you style that content to the desired look.

It also means you will be more "extracting" graphic elements from the photoshop mockup rather than slicing the flattened overall image.

I have done a few demos for various members, but can't put my finger on any of those posts at the moment.

[dc dalton]

Okay, it's learning time. If I don't use tables (which I finally feel I have mastered), what do you suggest I do? I started using Layers (yes, in Dreameaver), and they never staid in the same place in different browsers.

Nope, layers are not the way to go. Centauri mentioned it but I will go a little further but before I start let me just say (not aimed at you BTW)

Notepad? Aw come on folks! There are great editors out there and a ton of them ... no one needs to go back to notepad. I used Edit Plus, there is Ultra Edit, DW (in code view only) etc etc.

Anyways back to your question:

Real quick example here, a menu header and some text

old way (your way right now)

<table>
  <tr>
    <td colspan='2'> header image </td>
  </tr>
  <tr>
     <td>  
       <table id='menu'>
         <tr> 
           <td>menu item</td>
         </tr>
         <tr>
           <td>menu item 2</td>
           etc etc etc
         </tr>
       </table>
     </td>
     <td>
         content goes here
     </td>
   </tr>
   <tr>
     <td id='footer'>
        footer info here
     </td>
   </tr>
</table>

MAN that was painful to write!

'New way'

<div id='header'>you header here</div>
<ul id='menu'>
  <li>menu item</li>
  <li>menu item two</li>
  <li>etc ect ect</li>
</ul>
<div id='content'>
  Your content here
</div>
<div id='footer'>
  You footer info here
</div>

Now of course you need to style that but just looking at the code doesn't it make a HECK of a lot more sense than the old way? And granted this is a simplified version, some might (myself included sometimes) wrap the menu ul in a div, there can be all sorts of other elements in the ones above but I think you see the point.

Trust me, once you get into tableless code and really learn it you will look back and say "Why the heck did I EVER use tables?" I know because I say it all the time (yes there was a time when I coded just like you do now)

[Bayliss Trevor]

The way to think about it is that Divs are like tables in that they are divisions where you put your content. You then have to position those divs. So instead of <table></table> use <div> </div> Always start with firefox as it is the most standards compliant. Make a normal html page and save it on your machine. You can put your css in the page you are working on and then use the firefox add on firebug which will let you make changes to the css which you can save on the page and see what happens like using dreamweaver (but with divs!)
Divs are quite easy when you have the hang of things the difficult part will be positioning them, float is normally the best option. Good luck with the divs it is really worth it in the long run!

[Bayliss Trevor]

If you google div page layouts you will find some pages that you can use straight off which will make things a lot easier. You could even use dreamweaver to help you generate css that you can cut and paste and apply to your divs. Hths

[dc dalton]

I wanted to add one point to my code above that some might not immediately recognize and the TRUE beauty of CSS.

<div id='header'>you header here</div>
<ul id='menu'>
  <li>menu item</li>
  <li>menu item two</li>
  <li>etc ect ect</li>
</ul>
<div id='content'>
  Your content here
</div>
<div id='footer'>
  You footer info here
</div>

Notice there is nothing my the tableless example that has anything to do with layout design. (simplified example BTW) So lets say you do a site for a client where the menu is horizontal below the header. Two years from now the client comes back and says "I want you to redesign my site, I want the menu down the right side" Do you have to touch your html code? Nope, not one bit. You simply create a new style sheet that changes the position of the menu, add a style or two to the content div, clear a float or two and BANG the redesign is done.

Now think about what that would take time and money wise in a tabled layout?

See my point?

Here is an example I made up a few years ago to show this 'power' .. go play and you will see what I mean

http://davidcdalton.com/pages/articl...e/menutest.php

[Dark Tranquility]

That almost works. It only replaces the first occurrence on each line, though.
And it won't work if the first line looks like '123 bla bla foo bla bla'.

According to their own documentation, their regular expressions should support '^' to match the beginning of a line. But apparently that's a lie.


I don't even know what that is, but we're stuck with DW MX 2004 until we've implemented the new CMS. That's not far off for the intranet, but it won't happen until the end of next year for the external website.

http://kompozer.net/ I find it quite good... I thought you mentioned it before somewhere and that was my motive to try it. We are using either Vim or Kompozer for the moment... Despite that I own DW CS3 license...

[Tarh]

Notepad? Aw come on folks! There are great editors out there and a ton of them ... no one needs to go back to notepad. I used Edit Plus, there is Ultra Edit, DW (in code view only) etc etc.

I think that when people refer to the use of "notepad" they suggest the use of any "notepad-esque" editor - not necessarily notepad itself. If anyone is still using the actual notepad it's time to upgrade to something with syntax highlighting (absolutely no costs for the benefits). Edit Pad is a very minimalist upgrade for this purpose.

Since then I've moved to Komodo for my PHP editing.

You make an excellent point! And you have to see the ugly primitive websites these two "programmers" were putting out. They were horrendous! Ugly as hell, and I kid you NOT! At least I am putting out half way decent designed websites.

As a programmer I know this position very well. The sites that I design probably look as bad as your colleagues. However, you're failing to identify that web design and web development are two sides to an ultimate goal. In practice, programmers are often bad at designing and designers are often bad at programming (although there's many here at Sitepoint who are an exception to this generalization). When you look at their designs, they may look terrible, but there's another side to it - the code (particularly any server-side code) - which you do not see. As programmers their job is not to produce nice-looking sites (that's your job); their job is to produce compatible, fast, expandable, and manageable websites. All of these things deal with the code that is hidden from you when using DreamWeaver incorrectly, and thus when you present them with poorly coded HTML files (even if they look perfect), it slows down their job.

Rather than consider the amount that dumping DreamWeaver will slow you down, consider the net productivity gain in the system once programmers are given clean HTML code. Depending upon your designing skills and their programming skills, dropping DreamWeaver may or may not be the right choice. Your boss has apparently evaluated this situation and made that decision for you. If you're incapable of quickly programming HTML/CSS by hand, make sure that your boss is aware of this so that it can be factored into the decision.

[BrandonK]

I'm surprised no one mentioed this already. My number 1 complain with DW is the usage of massive HTML comments all over your pages. There's nothing professional looking about having <!-- InstanceBeginEditable name="content" --> type comments everywhere.

As far as an editor goes, I think DW works as well as any hand coding tool. I was a long time advocate of using variants of notepad, but the FTP integration with DW and the ability to manage multiple sites efficiently is amazing.

Another great feature is the ability to compare files when there are conflicting upload files. I know I a lot of other editors have the ability to do this, but I haven't seen any integrate with the ftp server's files as nicely as DW.

[wilwaldon]

I use Dreamweaver and spend about 95% of my time in coding view and just use the interface to see my designs every so often. Coding by hand is much faster for me personally and I use a lot of CSS and Xhtml.

Dreamweaver doesn't put out as much crappy code as it used to, but there are somethings that make me shake my head.

I'd suggest either hiring a front end programmer to do the coding of the site and you can focus on making great designs if that's a possibility?