1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

What Html Editor do you use?

Discussion in 'HTML & Website Design' started by aim_high, Feb 25, 2008.

  1. CriminalOrigins

    CriminalOrigins Peon

    Messages:
    276
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #61
    I use Notepad++ for my HTML and Topstyle Lite for my CSS. I like the coloring Notepad++ provides, and the auto indenting Topstyle Lite gives me.
    SEMrush
     
    CriminalOrigins, Feb 27, 2008 IP
    SEMrush
  2. csource

    csource Peon

    Messages:
    30
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #62
    i used just notepad
     
    csource, Feb 27, 2008 IP
  3. kk5st

    kk5st Prominent Member

    Messages:
    3,481
    Likes Received:
    366
    Best Answers:
    28
    Trophy Points:
    335
    #63
    People who want productivity choose a powerful text editor, free or not. As it happens, the best text editors are usually free. Dreamweaver does not support high productivity in a platform agnostic world.

    Dreamweaver is at best a very expensive editor with nothing to separate it from run-of-the-mill editors.

    Actually, the reverse is closer to the truth. The newcomer lacks proficiency and seeks out 'helper' apps such as Dreamweaver. He also tends to buy before understanding exactly what he needs, which would explain the proliferation PS ownership by those wanting to slice and dice and export to html. That's the sign of an amateur.

    No, the pro web developer buys hosting on an as needed basis. Hosting is more the domain of the webmaster or site owner. Neither of these is by definition a developer. (Though a developer may be a webmaster or owner—I don't include "web designers" as they're the least part of site development)

    The newbie probably doesn't know enough to use available free software such as Emacs, GIMP, Inkscape, ftp, ssh, scp, cvs, Apache, PHP or MySQL. These are all top-line applications, and generally superior for the specific job over the proprietary, non-free program.

    What you don't know doesn't bother me all that much, it's what you do know that just ain't so.

    cheers,

    gary
     
    kk5st, Feb 27, 2008 IP
    bigrollerdave likes this.
  4. bigrollerdave

    bigrollerdave Well-Known Member

    Messages:
    2,112
    Likes Received:
    52
    Best Answers:
    0
    Trophy Points:
    140
    #64
    I admire you taking the time to create such an indepth post almost 2 years and was on sitepoint before that for a few years. My quote was nothing more then my observation over the many years spent on forums and seeing tons of threads like this. It doesn't apply to everyone but a majority of the people it does. I personally only use dreamweaver because I was taught dreamweaver in highschool and it just sort of stayed with me. I don't think any programs can match all of dreamweavers functions and features or even the support that comes with it which is why it costs so much. You can get it on ebay for fairly cheap though. Like I said thought not everyone follows these general rules but a majority of users do.
     
    bigrollerdave, Feb 27, 2008 IP
  5. kk5st

    kk5st Prominent Member

    Messages:
    3,481
    Likes Received:
    366
    Best Answers:
    28
    Trophy Points:
    335
    #65
    I did not argue the number of people using authoring crutches, but rather your characterization of their skill levels. That a bunch of people use those apps does not argue for their being productive tools.

    Soi disant web designers who use Dreamweaver or Photoshop to design/write their html pages are not skilled craftsmen, and cannot be until they quit using them as prototyping tools.

    Photoshop is an excellent image manipulation program that churns out crap for html. Use it for your graphics. Even there, it is overkill. PS is a print graphics application first, and suitable for the web secondarily. Unless you do print graphics, you're spending a lot of money on unused and unusable features. GIMP is written from the ground up for web graphics, and is free. Likewise, free Inkscape is said by some to be better than Illustrator (I know my graphics consultant has shown a preference for Inkscape after years of Illustrator use).

    DW has a lot of site management tools, each of which are available as very efficient fixed purpose programs. Many of the tools are actually contra-productive, working only for maintainers who have DW themselves. Use them and you're locked in to a specific vendor product. Any site I author can be maintained or refactored by anyone on any platform. That's the kind of sites professionals develop. You can use DW in an agnostic manner, but then you've paid a lot of money for unusable features. I use Emacs, which is free. It doesn't have a lot of those site management features[1], but all those applications are free[2], and can be run directly from within Emacs.

    So talk up the number of people that use DW, but do not equate its use with any degree of professionalism. Truly professional developers do not use DW.

    cheers,

    gary

    [1] It is loaded with enough features, that it scares folks, thinking they'll never be able to learn it. Following the *nix philosophy of doing one thing and doing it well, Emacs is a small core editing program with the capability of accepting extensions written by anyone for any purpose. Many of the extensions have become a standard part of the distributed code. The point being you only need to learn that which you use.

    [2] See my previous post for a list of some of those features.
     
    kk5st, Feb 27, 2008 IP
  6. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #66
    I won't say someone's not a professional if they'd rather have stuff like code-completion or ftp built-in. Dreambeaver's a tool, that's all. I've been told that I'll never be a professional because I couldn't just walk into some other company which used DW and sit down and use it. Oh well. Guess I get to stay an amateur the rest of my working life : ) I'll likely never work for a company that will pay 570 euros for a glorified text editor.
     
    Stomme poes, Feb 28, 2008 IP
  7. Dan Schulz

    Dan Schulz Peon

    Messages:
    6,032
    Likes Received:
    434
    Best Answers:
    0
    Trophy Points:
    0
    #67
    And to which I tell them that the definition of a professional is someone who gets compensated for doing a job.

    And if they don't like it, too bad.
     
    Dan Schulz, Feb 28, 2008 IP
  8. TayFun KesKin

    TayFun KesKin Peon

    Messages:
    2
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #68
    You can use Notepad ++, it support auto completion. You can find supported program languages notepad++'s web site.

    Free, Speedy and Good :)

    TayFun KesKin
     
    TayFun KesKin, Feb 28, 2008 IP
  9. xcelent88

    xcelent88 Guest

    Messages:
    662
    Likes Received:
    10
    Best Answers:
    0
    Trophy Points:
    0
    #69
    I use personally Notepad++ and DreamWeaver. Both are good :)
     
    xcelent88, Feb 28, 2008 IP
  10. drywallinfoman

    drywallinfoman Peon

    Messages:
    30
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #70
    I just downloaded Dreamweaver CS3.

    I went through the very basic tutorial to get the feel for the interface designing a table-based sample site. Did another basic tutorial on CSS and started designing with absolute positioned blocks with a float thrown in for good measure. Love it!

    Basically, I only use the WYSIWYG to initially add properties to my CSS div's. Then I go to code. I agree that if you only use wysiwyg, you are in the dark, but to use it sparingly for initial design (assuming you know what you are doing) saves a lot of time! And, if you are at the bottom of the learning curve, it allows you to quickly get feedback as you experiment with your design.

    A good book or two is very helpful to have as well.
     
    drywallinfoman, Feb 28, 2008 IP
  11. Dan Schulz

    Dan Schulz Peon

    Messages:
    6,032
    Likes Received:
    434
    Best Answers:
    0
    Trophy Points:
    0
    #71
    You do understand that absolute positioning for layout is a bad idea, right?
     
    Dan Schulz, Feb 28, 2008 IP
  12. aim_high

    aim_high Peon

    Messages:
    167
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #72
    what method do you prefer to use?
     
    aim_high, Feb 28, 2008 IP
  13. Dan Schulz

    Dan Schulz Peon

    Messages:
    6,032
    Likes Received:
    434
    Best Answers:
    0
    Trophy Points:
    0
    #73
    Floats and negative margins when appropriate.
     
    Dan Schulz, Feb 28, 2008 IP
  14. drywallinfoman

    drywallinfoman Peon

    Messages:
    30
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #74
    No, I am new to this. Why is it a bad idea?
     
    drywallinfoman, Feb 28, 2008 IP
  15. Dan Schulz

    Dan Schulz Peon

    Messages:
    6,032
    Likes Received:
    434
    Best Answers:
    0
    Trophy Points:
    0
    #75
    Absolute positioning takes an element (DIV, UL, P, whatever) completely out of the flow, meaning that other elements cannot flow around them. If one element is larger than another (like a sidebar column for example) adjacent to it, it'll literally cover up whatever's below it (like the footer that tends to be below sidebar contents). With floats, you have the ability to "clear" the flow and return to a normal state, as can be seen here:

    http://www.dan-schulz.com/temp/2columnlayout/
    http://www.dan-schulz.com/temp/3columnlayout/ (this one's REALLY advanced - I can whip up a simpler version for you if you want)
     
    Dan Schulz, Feb 28, 2008 IP
  16. drywallinfoman

    drywallinfoman Peon

    Messages:
    30
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #76
    I noticed this about absolute positioning and thought perhaps I was doing something wrong. One element can easily blanket over the other. Thanks for the comment.

    Do you know of a source of some fairly simple templates using float positioning?
     
    drywallinfoman, Feb 28, 2008 IP
  17. Dan Schulz

    Dan Schulz Peon

    Messages:
    6,032
    Likes Received:
    434
    Best Answers:
    0
    Trophy Points:
    0
    #77
    If you want just the code, look at the two links I gave you. If you need a tutorial, let me know and I'll whip one up for you.
     
    Dan Schulz, Feb 28, 2008 IP
  18. aim_high

    aim_high Peon

    Messages:
    167
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #78
    Floats only go to the absolute right and left though right? What if you wanted like a 4 column lay out?
     
    aim_high, Feb 28, 2008 IP
  19. Chuckun

    Chuckun Well-Known Member

    Messages:
    1,161
    Likes Received:
    60
    Best Answers:
    2
    Trophy Points:
    150
    #79
    Chuckun, Feb 28, 2008 IP
  20. Dan Schulz

    Dan Schulz Peon

    Messages:
    6,032
    Likes Received:
    434
    Best Answers:
    0
    Trophy Points:
    0
    #80
    You mean like this? (I also have a live version available right here.) Oh, and this doesn't have a SINGLE HACK FOR IE either. :cool:

    Tested on IE 6, IE 7, Firefox, Opera and Safari 3. Try getting Dreamweaver to do THAT in design view.

    
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html lang="en">
    	<head>
    		<title>Untitled Document</title>
    		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    		<meta http-equiv="Content-Style-Type" content="text/css">
    		<meta http-equiv="imagetoolbar" content="no">
    		<meta name="description" content="A brief description of the current page goes here.">
    		<meta name="keywords" content="keywords, go, here, only, once, page, content, has, been, finished">
    		<style type="text/css" media="screen">
    			
    			* {
    				margin: 0;
    				padding: 0;
    			}
    
    			body {
    				background: #FFF;
    				color: #000;
    				font: normal 85%/150% tahoma, verdana, arial, helvetica, sans-serif;
    				letter-spacing: 1px;
    			}
    
    			h1, h2, h3, h4, h5, h6 {
    				background: transparent;
    				color: #DC143C;
    				font-family: georgia, garamond, "times new roman", times, serif;
    				font-weight: bold;
    			}
    
    			h1 {
    				font-size: 1.55em;
    				line-height: 1.8em;
    			}
    
    			h2 {
    				font-size: 1.25em;
    				line-height: 1.3em;
    			}
    
    			h3 {
    				font-size: 1.05em;
    				line-height: 1.1em;
    			}
    
    			h4 {
    				font-size: 0.95em;
    				line-height: 1em;
    			}
    
    			h5 {
    				font-size: 0.85em;
    				line-height: 0.9em;
    			}
    
    			h6 {
    				font-size: 0.75em;
    				line-height: 0.8em;
    			}
    
    			img {
    				border: 0;
    				vertical-align: bottom;
    			}
    
    			#container {
    				background: #EEE;
    				color: inherit;
    			}
    				#header {
    					background: #0CF;
    					color: #000;
    					height: 80px;
    				}
    
    				#menu {
    					float: left;
    					position: relative;
    					width: 12em;
    				}
    					#menu li {
    						display: inline;
    						height: 1.5em;
    						line-height: 1.5em;
    						list-style: none;
    					}
    						#menu li a {
    							display: block;
    							height: 1%;
    							padding: 0.25em 0 0.25em 1em;
    							text-decoration: none;
    						}
    
    						#menu li a:hover, #menu li a:active, #menu li a:focus {
    							background: #CCF;
    							color: inherit;
    						}
    				
    				#content {
    					float: left;
    					margin: 0 -20em 0 -12em;
    					width: 100%;
    				}
    					#content .wrapper {
    						background: #FFF;
    						color: inherit;
    						margin: 0 20em 0 12em;
    						padding: 0 1em;
    					}
    						#content .wrapper p {
    							padding: 0.5em 0;
    						}
    				
    				#ad-bar {
    					background: #CDE;
    					float: left;
    					height: 200px;
    					width: 10em;
    				}
    					#ad-bar div {
    						padding: 0 0.5em;
    					}
    
    				#sidebar {
    					background: #CFA;
    					color: inherit;
    					float: left;
    					height: 300px;
    					width: 10em;
    				}
    					#sidebar p {
    						padding: 0 0.5em;
    					}
    
    				#footer {
    					background: #F9C;
    					clear: left;
    					color: inherit;
    					height: 1%;		/* triggers hasLayout in IE 6 */
    				}
    					#footer em {
    						display: block;
    						font-style: normal;
    						padding: 0.5em 0 0.5em 1em;
    					}
    		
    		</style>
    	</head>
    	<body>
    		<div id="container">
    			<div id="header">
    				<img src="#" width="200" height="80" alt="Logo" title="">
    			</div>
    			<ul id="menu">
    				<li><a href="#">Menu Item</a></li>
    				<li><a href="#">Menu Item</a></li>
    				<li><a href="#">Menu Item</a></li>
    				<li><a href="#">Menu Item</a></li>
    				<li><a href="#">Menu Item</a></li>
    				<li><a href="#">Menu Item</a></li>
    			</ul>
    			<div id="content">
    				<div class="wrapper">
    					<h1>Web Page Title</h1>
    					<p>
    						Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In quis erat.
    						Nulla auctor consectetuer erat. Sed est tellus, laoreet et, faucibus et,
    						cursus ut, lectus. Nulla scelerisque, mi vel commodo consequat, turpis
    						ligula congue ligula, eget pellentesque turpis augue quis diam. Nulla
    						facilisi. Etiam commodo quam in metus. Etiam nec nisi ac nisl molestie
    						fermentum. Donec ligula ipsum, venenatis in, egestas vel, commodo
    						bibendum, est.
    					</p>
    					<p>
    						Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In quis erat.
    						Nulla auctor consectetuer erat. Sed est tellus, laoreet et, faucibus et,
    						cursus ut, lectus. Nulla scelerisque, mi vel commodo consequat, turpis
    						ligula congue ligula, eget pellentesque turpis augue quis diam. Nulla
    						facilisi. Etiam commodo quam in metus. Etiam nec nisi ac nisl molestie
    						fermentum. Donec ligula ipsum, venenatis in, egestas vel, commodo
    						bibendum, est.
    					</p>
    				</div>
    			</div>
    			<div id="ad-bar">
    				<div>(Ads Go Here)</div>
    			</div>
    			<div id="sidebar">
    				<p>(Sidebar Goes Here)</p>
    			</div>
    			<div id="footer">
    				<em>Copyright &#38;#169; 2006-2008, The Monster Under the Bed. All Rights to Scare Unsuspecting Children Reserved.</em>
    			</div>
    		</div>
    	</body>
    </html>
    
    Code (markup):
     
    Dan Schulz, Feb 28, 2008 IP