TinyMCE in WordPress and maybe elsewhere is rewritting HTML Attributes incorrectly

 

After our recent post on the WordPress.org Forums it became obvious that few people were aware of an issue with TinyMCE creating Attributes where it places Attributes in the wrong order based on Google and internet consistency standards.

 

Below is the Quote from Google Developers Best Practices:

Recommendations
Write your web page content to make compression most effective. To ensure that your content compresses well, do the following:

Ensure consistency in HTML and CSS code. To achieve consistency:

  • Specify CSS key-value pairs in the same order where possible, i.e. alphabetize them.
  • Specify HTML attributes in the same order , i.e. alphabetize them. Put href first for links (since it is most common), then alphabetize the rest. For example, on Google’s search results page, when HTML attributes were alphabetized, a 1.5% reduction in the size of the gzipped output resulted.
  • Use consistent casing, i.e. use lowercase wherever possible.
  • Use consistent quoting for HTML tag attributes, i.e. always single quote, always double quote, or no quoting at all where possible.

Minify JavaScript and CSS. Minifying JavaScript and CSS can enhance compression both for external JS and CSS files and for HTML pages containing inlined JS code and style blocks.

Proven
The Inconsistency was proven in WordPress default themes using TinyMCE4 when placing Code into the “text” mode then Switching to the “Visual” mode where TinyMCE rewrites the HTML Attributes incorrectly.

 

Fixing the Issue
The only Current way to fix the problem at this time (May 9, 2014) is to Manually create all HTML Attributes for Text links and Embeds by hand in the “Text” mode WITHOUT then switching to “Visual” again. The minute you switch to “Visual” mode either now or Later the incorrect Attribute Order will be applied again.

 

Why It’s a Problem
As a Designer I like to watch Google closely, specially anything that can lower Rankings. Recently our own Rankings and some Client CMS Website Rankings dropped drastically without any obvious reason. This prompted us to search our sites for Code Errors and such as is the usual process when rankings drop. We noticed rewrites happening when we viewed the HTML for some Text links where the Title Attribute moved before the href. After manually fixing them and saving without switching to “Visual” mode they stay correct and our Rankings almost instantly started Rising again.

 

After working on Rankings in Google for so many years we’ve learned that any “Suggestion” Google makes (the above quote) is a Demand and frequently seems to affect Rankings in their search engine.

 

Whether it does or not, the simple fact that Website Designers are expected to adhere to Consistency Standards and this forces Inconsistency into our builds. I also have to wonder how far this really goes if as Google ses it causes 1.5% reduction done Correctly… how much is this little “issue” slowing down the WHOLE Internet? 60 Million+ WordPress Users?

 

References:

https://developers.google.com/speed/docs/best-practices/payload?hl=sv

https://core.trac.wordpress.org/ticket/28191

http://wordpress.org/support/topic/title-showing-before-href?

Cost of a CMS Web Design
Cost of CMS Web Design
CMS Website Design Specials

CMS Website Design Packages


Convert HTML to CMS Website Design


Convert to Wordpress CMS Website Design


Blog Archives
Our CMS Website Design
Our Focus:
To provide Affordable CMS Website Design and Convert to CMS Website Design solutions.

Our CMS Design Support:
USA Based Support included FREE for the life of your CMS Website Design.

Our CMS Hosting:
Included FREE for 1 year on all CMS Website Design projects, then just $89.95 Per Year. We also include our Search Engine Optimization and Submission services as part of all design packages.

How much does a cms web design cost

Follow Us Online
LeadWebDesigners BlogLeadWebDesigners on TwitterLeadWebDesigners on LinkedIn
CMS Website Design Clients
  • Business CMS Web Design
  • Corporate CMS Web Design
  • Small Biz CMS Web Design
  • MLM CMS Website Design
  • Splash Page CMS Design
  • Convert HTML to CMS Design
  • Rental Property CMS Design
  • Content Management System
  • Wordpress Blog Design
  • Wordpress CMS Web Design
  • Wordpress CMS Themes
  • HTML to CSS Level3 Design
  • Internet Marketing (SES)
  • Website Optimization (SEO)
  • CMS Website Hosting
  • Domain Name Consulting