Can You Tell if a Site Was Built By Manual Coding or With a WYSIWYG Ed

Diferentiate between Manually Coded and WYSIWYG editor built site?

[mikefemi100]

Hey folks, for your hardcore web developers/designers, if you look at the source code of a site, can you determine if it was built by manual/hand coding, or with a WYSIWYG editor like dreamweaver or frontpage?

If you can tell the difference, can you please tell me what those differences are.

Thank you.

[tangor]

Welcome to Webmasterworld, mikefemi100!

Many WYSIWYG editors will insert a "meta" generator statement in the head element revealing who shot john. Some create extraordinarily complex Span elements for text styling and thus reveal it was not hand coded.

I've never been particularly concerned about this as I hand code everything... but it is an interesting question. Hopefully others will have more to say.

[mikefemi100]

Thanks tangor... that was quite helpful... and I have indeed gone to check a wysiwyg created site that i did but didnt find any such statement.

Anymore takers on this?

[LifeinAsia]

This reminds me of a few years back when a popular web editor had a free trial period. After that, if you continued to use it without purchasing, it would add something like "*** BUILT WITH ILLEGAL COPY OF <BrandName> WEB EDITOR ***" to the meta title of the page.

Anyone could go in and easily edit out text with another editor. But not many people did- if you searched on that string in Google, tens of thousands of sites came up. :)

[Demaestro]

I would say I can always tell.. I would like to see the code from an editor that made it hard to know it was auto generated.

Usually the white space is enough to give them away.

[tangor]

The sites that "get me" are "MSO" ie. html conversions from MS OFFICE. :)

Demaestro is correct. If 300 words of content comes out as 4k in size before pictures, it's generally auto/editor generated.

[johnblack]

Wouldn't say I was 'hardcore' ;-) but here's my 2c

I would agree with the whitespace comment. View the source of two pages side by side. If the html is laid out the same way, then they are probably using a template of some sort. The template of course could be hand-crafted.

For dreamweaver I looked at one of my sites. I use libraries so if you see this kind of line

<!-- #BeginLibraryItem "filename.lbi" -->

then they've used dreamweaver. It was the only thing I could spot. I also use DW templates but there was nothing specific in the html to suggest I had.

Sort of a whitespace thing, but I would imagine that people would indent their html if it was hand-built to make it easier to read whereas WYSIWYG it could be all over the place.

Meaningful class names may also be an indicator of a hand-crafted site.

Anyway hopefully food for thought for ya.

[Demaestro]

DW templates but there was nothing specific in the html to suggest I had.

If you define editable sections within your DW template then it is in the source as well.

[johnblack]

Indeed, it seems the pages I looked at are not from a template. Ooops.

Anyway here's another line to look for

<!-- InstanceBeginEditable name="name" -->

[milosevic]

Apart from the templating stuff already mentioned:

Look for classes called .style1, .style2 etc in the CSS.

<p>&nbsp;</p> in the HTML source is another common giveaway, as are structural <br>s.

Scripts that start with "MM" such as MM_preloadImages is another common one as these were built into Dreamweaver.

People that use WYSIWYG usually aren't very fluent with CSS (or they wouldn't need to use WYSIWYG for layout/design) and this is often very apparent looking at the stylesheet.

Look for longhand rules that have been added to the stylesheet by the WYSIWYG like:

border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #FFFFFF;

Instead of border-bottom: 1px solid #fff;

Rules like "background-repeat: no-repeat;" are a giveaway.

Usage of six letter hex codes for greyscale colours instead of three is another indication, as most people hand coding would not bother but editors don't try to use 3 letter codes.

Something else I notice repeatedly (but can't explain why) is poorly thought selector schemes, in particular where almost every element uses a class of "generic_content" or "generic_paragraph" etc instead of using an element selector to set how styles should appear by default.

If you see selectors like (real world examples from a commercial Dreamweaver built site):

#mainContent.normal #generalForm

or

.genericTableB .blankCell (lol)

You are most likely looking at a WYSIWYG created site (or someone who seriously misunderstands how to use CSS)