Customizing the Look and Feel of reCAPTCHA Using Inline Styles

Google reCAPTCHA

Important: Version 1.0 of the reCAPTCHA API is no longer supported, please upgrade to Version 2.0.

recaptchalogoJVF Consulting is a web design company that can help you with anything you need. This includes the customization of free services such as reCAPTCHA which is meant to protect your website from spam and abuse.

reCAPTCHA uses an advanced risk analysis engine to keep automated software from engaging in abusive activities on your site, but the standard reCAPTCHA widget looks horrible out of the box, but thanks to JVF it can be styled easily.

recaptchastandard

Once you’ve successfully installed reCAPTCHA on your site, we can turn it from a standard reCAPTCHA style into a transparent style.

You can apply CSS styles to the reCAPTCHA widget to change its colors and other visual properties. This way it looks more neutral, unlike the standard one, by giving it a better look and feel for your website page. This method works by setting the reCAPTCHA theme to “clean”, then adding in the inline styles within the page at the very end, so it loads last.

cleantheme
inlinestyles

Use the “!important” directive in your CSS, so that when you call it in your CSS, it won’t matter because it’s usually the last call. Put the styles within the HTML directly on the page, at the end, this makes it the last reference and those styles will be applied.

At the end of all this, it should be transparent and look like the picture below.

recaptureexample

Can I customize the reCAPTCHA v2 widget?

Yes. reCAPTCHA offers two themes, light and dark. To choose a theme, simply set the data-theme attribute in the grecaptcha.render parameter. Or, use the Invisible reCAPTCHA. Using the Invisible reCAPTCHA you have more control over the UI.

Google Does Not Use Keyword Meta Tags!

As professional website designers we are always conforming to the latest techniques in SEO (search engine optimization) in order to be successful in the SERP’s (search engine result page’s). We found that our new customers are now doing their history before choosing a web design firm to make sure their final product will perform correctly in all search engines. The term used mostly by our new customers is “keyword meta tags”. They want to make sure we include these meta tags, in hopes their website will increase in the SERP’s. They then pass us a huge list to embed into their website header. At JVF Consulting we do include keyword meta tags to all of our custom websites, but we really hate to break the news, Google does not use keyword meta tags! 

Next time you’re reading an article on SEO and it tries to convince you to optimize the keyword meta tags to your website remember this. Googlebot does not even bother to index or interpret those keyword meta tags, but rather extract the keywords from the content of your website. When Matt Cutts the famous Google SEO software engineer was asked, “Does Google ever use the keyword meta tags in its web search ranking?” His response was, “In a word, no. Google does sell a Google Search Appliance, and that product has the ability to match meta tags, which could include the keywords meta tag. But that’s an enterprise search appliance that is completely separate from our main web search. Our web search (the well-known search at Google.com that hundreds of millions of people use each day) disregards keyword metatags completely. They simply don’t have any effect in our search ranking at the present time.” 

If you still do not believe us, here is a Google Webmaster video explaining it all. This is not breaking news by any means, but there are still people out there who are putting too much thought and effort into their meta tags.