Which is the best HTML editor?

I strongly suggest sticking with Notepad++. The only other editor I would condone using is Dreamweaver, because out of all editors I’ve seen, it’s the closest to being an industry standard. Not like it really matters, there really isn’t an adopted program for web editing across many companies, unlike with Photoshop which pretty much is an industry standard.

There is simply no advantage provided by any of the editors you recommend. If you want to be an HTML master, you need to know the markups and their attributes very intimately, and using an editor will remove part of this.

I’ve never used Homesite, but I just looked into it now. I can’t see why anyone would use it. It seems to be an in-between of Notepad++ and Dreamweaver. I’m assuming it comes with a code auto completion function, but this is exactly what you want to avoid if you truly want to become an HTML master.

I would never purchase any HTML editor that wasn’t Dreamweaver, and Dreamweaver is way overkill for newbies (as well, it sprinkles its own code around your document). I believe a good reference book (or even better, reference website) for looking up tags and attributes, and a simple code editor like Notepad++, is all you need as a rookie.

Coda, if you’re on a Mac. It might be overkill if all you need is an HTML editor, but it’s an amazing web-development suite.

Sorry ANAPHASE, but I’m a PC. As for being a code master, I’m all for that. This HTML thing seems so complicated right now, especially when I take a look at the source code for some web sites, but I guess the more I get into the easier it will get.

Do you think Fluther.com used an HTML editor or do you think they used a WYSIWYG?

Well, I do know that the design of Fluther started as a Photoshop (or similar) image, and it was left to Ben and Andrew to translate it into code, so they would know for sure. Based on my opinion of looking at their code, I’d say they did not use Dreamweaver, and may in fact have created it via raw HTML coding, but using some editor as the lines are tab-indexed for the most part.

If I were doing it (my workflow is similar, in that I design in Photoshop then translate to HTML), I would start off by using a pre-existing and verified (in terms of W3C compatibility) basic structure design (I’ll have to find you a link later), then add elements using Dreamweaver, most times relying on my own hand coding.

You simply cannot rely on WYSIWYG editors. I mean, today’s editors are far better than the ones in the past, but it’s a simple fact that if you rely on the WYSIWYG to produce your code, you can only use the WYSIWYG to try and fix the problems created by lack of compatibility of browsers. On the other hand, if you are an HTML master, you can dive deep into the markup tags and fix the problem.

Also, if you’re doing anything dynamic, strict HTML validation is the key to relatively painless debugging, and Dreamweaver has odd notions about what’s valid.

Definately use Notepad++ and just refer to w3c for questions. HTML gets easier as you go, it will be slow at first having to constantly look up things like creating links, adding pictures, etc, but after a few weeks of constant HTML you will move along at a much faster pace.

Also @dynamicduo is right about WYSIWYG editors, I used to work at an agency that had their own proprietary ColdFusion WYSIWYG. It made adding content very easy for clients, but after a few years the editor started to become outdated and all of the sudden our clients were victims of updates, if a new browser popped-up and caused the site to display improperly the clients had to wait for the ColdFusion cowboys to fix the issue. Don’t get me wrong WYSIWYGs have their place, but usually that place is a large company that has a lot of hands in their website(s).

Learn to hand code HTML!

Thanks again people. I hear what you’re saying and I believe it. I guess I’m just frustrated with the slow learning process, which of course has to do with me, not the markup language. But having to still learn HTML, XHTML, XML, and CSS, and Javascript (I don’t even know what JS is) I feel a bit overwhelmed.

Also I’m struggling to understand the design structure for modern sites. Like do I use <TABLE> to design the site or do I would I use <FRAME>?

I guess I can see why so many people turn to WYSIWYGs. Recently (since I’m still learning HTML) I used QuarkXPress 8 as my WYSIWYG editor for a simple web site I made for myself and I have to say that it looks pretty good on IE8, and Firefox. But I do feel what you guys are saying about learning HTML and I still plan to continue studying it.

You use neither tables nor iframes. You use CSS, put your content in DIVs on the HTML page and position them via CSS (either internally or in an file you call).

I think you should find a book that teaches XHTML and CSS together, or HTML if you can’t find an X one (the only difference is that X is more rigid, and you need to add certain closing elements to stand-alone tags, and a few other small things, it’s really not a different language at all). HTML for the content, CSS for the design and positioning.

XML I would rank pretty low on the list, and it’s not really a language you learn, more as you simply understand how its structure and hierarchy works and voila there it is. Javascript is a bit more intense and you’ll likely want to have a handy guide to look things up for, but it’s all well documented and if you learn it on an as-need basis as I often do, it’s easy to eat in small pieces.

Ah, here’s the site I was talking about before: CSS templates. I often start my designs using these, as they’re valid and perfect, why reinvent the wheel! Download one of those and take a peek. It’s very easy to understand, and a good way to start playing with HTML without having to worry about the rest of the document, etc.

@dynamicduo

What do you <EM>mean</EM> when you when you say that you “design in Photoshop then translate to HTML”?

Most likely, they started with a static screenshot and then cut it into pieces:
logo
repeating header
footer
wallpaper
etc.

They probably used some kind of IDE like Visual Basic and hand coded the pages.

This may not be right, but it seems like a logical approach.

I love Coda and Espresso if you’re on a mac

I mean pretty much just that! I start out with a canvas around 700 pixels wide (I still design for 8×6 compatibility, but I’ll probably change soon), and I design the website using Photoshop’s tools (shape, text, adding photos on layers, etc). At the end, I have essentially a screenshot of what the website should look like. Of course, text and image placement are rough and will not necessarily translate over perfectly, but for things like overall layout, navigation menus, etc, it works very nicely. I do as much of the design and layout in code (such as colors, general layout of the divs, text styling of course) and then insert images from the design as needed (such as for an rollover navigation bar, although I’ve started doing them in CSS recently).

@fireside: Eew, VB, gross. But basically this is right. I create what the site will look like, then create the code that produces this site, adding images wherever needed. I hand code the site in Dreamweaver (in code view), because I like the site management and easy FTP integration.

@dynamicduo – yeah, I’m about at Link’s level, so I barely even know what VB is. I agree that it is a frustrating process to try and learn. Plus, we haven’t even started talking about database structures and queries which adds more layers of complexity onto sites like Fluther. I just spent the past month playing with things like Joomla and Drupal to see if that would be any easier, but I think I’ll just have to learn the old fashioned way.

It’s very hard learning a system like Drupal or Joomla when you don’t know the steps the developers took to creating them. Even I have trouble with them at times. Right now I’m starting to play with a PHP framework called CodeIgniter, it seems to be a good tool to help facilitate dynamic site creation… once I figure it all out :)

I really hope you guys aren’t taught VB for making sites on the Microsoft stack… the default standard nowadays (in my experience) is ASP.NET 2.0 and C# or C++... not saying you couldn’t do it in VB, but it certainly won’t open as many career doors for you than if you were taught C#.

Damn I don’t even know what PHP means lol. But thanks DYNAMICDUO for letting me know to learn C#. I’m learning all these languages at lynda.com and w3school.com. Wish me luck.

Hold the phone, Link :) You don’t need to learn C# to make websites, not immediately at all! Master HTML/CSS first, then introduce dynamic aspects via PHP/MySQL (or ASP/MSSQL), then go on to major web apps with a PHP framework (PEAR is one) or C#/ASP.NET 2.0.

I wish you the best of luck :)

On a mac i’d recommend Coda or TextWrangler.

I would also definately not recommend Dreamweaver, unless your planning on just using its code view, which would seem like a major overkill if so. Therefore i’d recommend Notepad++ on Windows.

Thanks dynamicduo and philo23!

No need to pay for an expensive editor when SharePoint Designer is available FREE from Microsoft (here’s the download page). Very similar to Dreamweaver (in truth they nicked a lot of the functionality) and very easy to use. Will help you understand HTML markup by switching to split view (shows HTML and design of page at same time).

Don’t let the name fool you, this not just designed for editing SharePoint sites. In fact, this is Microsoft’s replacement for the retired FrontPage line of products.

@martyjacobs: Thanks, I didn’t know about SharePoint Designer, nor that it was free. I really appreciate all the feedback form everybody.