Skip to main content

Avoid bad HTML

As you may know, you can easily put HTML tags in your editor fields, such as the caption field, or the message field on the home page, or even in the head-tags variable, etc. I always encourage my clients to feel free to use some minimal formatting they may want to include in these fields, because doing so is relatively easy and really shouldn't require hiring a professional to do so. I always tell them also, to be careful with the HTML they put in those fields, and DO hire a professional if they find the need to add more complex HTML - for example, beyond just bolding words, or emphasizing phrases, etc. However, I keep coming across stores where merchant-edited HTML nearly bring the store to its knees. Yes, that actually can be done! Why? Because web pages - therefore Yahoo Store pages - are made up of HTML tags, so if you throw a wrench in there, expect things to break....

Adding simple formatting is harmless. You can easily bold words, change the appearance of fonts, etc. It becomes a problem when the merchant believes that throwing a bunch of random HTML code in a variable will somehow come out correct - and if it seems visually Ok, then they assume they did it right. Here is a partial list of problems I see often:

Unclosed Tags
This is probably the most common mistake I see. They start bolding something with a < b > tag, and forget to close it. In this case, it will just end up bolding most everything on the page starting at the opening < b > tag. But, things can get worse. If you include a tag that actually affects layout, for example an opening < div > tag or < table > tag, that stray tag can potentially break your page's layout completely. And, taking it a step further, if you open a < style > or < script > tag, but don't close them, the page may stop rendering completely (i.e. come up blank.)

Closed tags without opening
This is sort of the opposite of the previous mistake. When you throw in a closing tag without first opening it, you will most likely completely break the layout of your page(s).

Mismatched tags
This is a combination of the previous two. Sometimes people throw in opening tags and closing tags at random, and in random order. If each of your opening tags have closing counterparts but in the wrong order, chances are most modern browsers will figure out what to do, but why make the browser's work miserable? Follow this easy rule of thumb: if you open a tag, such as < b >, when you are done with it, close it. That's really it.

Including main document tags such as < html >, < head > , or < body >
These are not only not necessary because the Yahoo Store templates already put these in the code, they can also break the pages, break JavaScript code, and in extreme cases these extra tags may even cause the search engines to mis-read your pages and not index them correctly.

So if you wanted to write a post-it note for yourself with the most important rules of adding html to your caption fields, write these:

  • If you open an HTML tag, always close it, and in reverse order.
  • Never use these tags in your store editor fields: < head >, < /head >, < body >, < /body >, < html > and < / html >

Comments

Popular posts from this blog

What is product-url anyway?

I keep having to field questions about the product-url field, and since it came up yesterday, I figured I'd try to clear up all the confusion about it.

So the name product-url suggests that whatever you type in there will become the URL of that product. Unfortunately, this is not the case, or rather, not in the intuitive way. The URL you enter there will be used as the URL for that product in Yahoo Shopping, on the built-in search results page, and on the shopping cart page, however, the URL you type in there DOES NOT actually change the physical URL of the page.
What is the URL of a page in a Yahoo Store? In any Yahoo Store built in the store editor, the URL of a page is the store's domain name and the page ID + .html. For example, in my store at www.ytimes.info, I have a page whose id is rtml101, thehrefore, the URL of that page is http://www.ytimes.info/rtml101.html.
Why would you want to change the URL? For SEO reasons, it is believed to be better to have a URL that includ…

Referencing Files from Yahoo! Web Hosting Securely

Now that hopefully most of you you have your stores secured (if not and need help, we offer a Secure Storefront Preparation Service here), you may have been faced with the question of how to reference files (images, CSS, JavaScript, src) if those files are stored on your Yahoo! store's web hosting account. Obviously using the old HTTP: method won't work, so something like this

< img src="http://site.ytimes.com/image.jpg" />

will not work. Nor can you simply change the http: part to https: , because as of this writing, only the store editor portion of a Yahoo! Store can be made secure, the web hosting portion cannot.

First a side note: if this sounds totally Greek to you because you have never heard of the web hosting part of your Yahoo! Store, you may have a legacy Yahoo! store account and not a Merchant Solution one. With a legacy store account you will only have the store editor part and no hosting account, in which case none of this applies to you.

The good n…

Really Quick Trick to Improve Page Load Speed of a Yahoo Store a Little Bit

With Google getting more and more aggressive about wanting web sites to be quick to load (particularly on mobile), we often find ourselves trying to find even the smallest of tweaks to nudge up that page speed score even if by a tiny bit. Here is a quick trick you can do completely on your own, without having to ask a developer, that will probably bump up your Google PageSpeed score by a couple of points.

First a short disclaimer: this trick is only applicable if you have enabled the Yahoo! Badge in your Store Manager, under Live Insights & App Gallery.

Before you start, you may want to check your site's Google PageSpeed (the home page is a good place to start) both as a benchmark, and also to get a glimpse at how fast (or slow) Google believes your site (or home page) is. Here is the link:

https://developers.google.com/speed/pagespeed/insights/
Ok, so if you did enable the Yahoo! Badge, your site includes a small Yahoo Live Store badge, much like this:


When you hover over the …