{"id":875,"date":"2014-12-21T02:53:17","date_gmt":"2014-12-21T02:53:17","guid":{"rendered":"https:\/\/www.santarosawebsite.com\/websitedesign\/?p=875"},"modified":"2014-12-21T03:02:04","modified_gmt":"2014-12-21T03:02:04","slug":"ghost-buttons","status":"publish","type":"post","link":"https:\/\/businesswebsitecenter.com\/websitedesign\/ghost-buttons\/","title":{"rendered":"Ghost Buttons"},"content":{"rendered":"<p>During the next few weeks we are going to address very specific web design elements and attempt to go in more depth as to what they are, what benefits they bring and how to assess if this design item is a good option for your own website.<\/p>\n<p>This week we will start with <strong>Ghost Buttons<\/strong>. We are all familiar with call-to-action buttons asking the visitor to do something immediate such as \u201cClick here to get started\u201d, \u201cBuy this item today\u201d, \u201cEmail us now\u201d and so forth. Ghost buttons are similar but they are not as aggressive in asking the visitors to take an action.<\/p>\n<p>They typically use more subtle wording such:<\/p>\n<ul>\n<li>Take the pledge with us\u2026<\/li>\n<li>Learn more\u2026<\/li>\n<li>Explore\u2026<\/li>\n<li>Investigate&#8230;<\/li>\n<li>Answers to your questions\u2026<\/li>\n<li>Tell me how this works\u2026<\/li>\n<\/ul>\n<p>They are often placed on top of a graphic or photograph. The idea is to integrate them into a section of a page or an image so that they seem \u201cnatural\u201d and not pushy.<\/p>\n<p>We, at <span style=\"color: #214e78;font-variant: small-caps !important;font-weight: bold !important;letter-spacing: 0.5px;\">Business Website Center<\/span>, like to use opacity behind the text of the button so that the visitor can see a pale peekaboo of the image behind.<\/p>\n<p>Sometimes they are accompanied by an icon which illustrates the action call graphically. For a while now, web designers have been using a new graphic empowered font called <strong>Font Awesome<\/strong> which gives out icons instead of letters. What is nice about this trend is that it is used more and more and it is \u201ctraining\u201d Internet users on what each icon means. It is a matter of time before all of these icons are commonly recognized even by novice web users. You already know many yourself like an envelope typically represents a link to the contact page, the Twitter bird a link to Twitter of course, a question mark a link to a FAQ page of some sort, etc.<\/p>\n<p>Finally ghost buttons often have a border to define its text but again it is not as aggressive or intense as a straight forward call-to-action graphic.<\/p>\n<p>The use of the right font, font size and thickness is also very important when adding a ghost button. Each decision you make in the design of your site and details like an action action will have an impact on how the visitor feels about the site. It only takes seconds for a prospective buyers to judge the quality of your company by what they see and read on your site so paying attention to small items like ghost buttons can give you the extra edge you need to pass your competition online.<\/p>\n<p>For more information about this subject, never hesitate to <a title=\"Email our team of website experts today!\" href=\"\/contact.php\">contact us<\/a>.<\/p>\n<figure id=\"attachment_882\" aria-describedby=\"caption-attachment-882\" style=\"width: 300px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/www.santarosawebsite.com\/websitedesign\/wp-content\/uploads\/2014\/12\/ghostbuttonsforwebsites.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"petaluma wp-image-882 size-medium\" src=\"https:\/\/www.santarosawebsite.com\/websitedesign\/wp-content\/uploads\/2014\/12\/ghostbuttonsforwebsites-300x173.jpg\" alt=\"Ghost buttons\" width=\"300\" height=\"173\" srcset=\"https:\/\/businesswebsitecenter.com\/websitedesign\/wp-content\/uploads\/2014\/12\/ghostbuttonsforwebsites-300x173.jpg 300w, https:\/\/businesswebsitecenter.com\/websitedesign\/wp-content\/uploads\/2014\/12\/ghostbuttonsforwebsites.jpg 795w\" sizes=\"(max-width: 300px) 100vw, 300px\" \/><\/a><figcaption id=\"caption-attachment-882\" class=\"wp-caption-text\">Ghost buttons for websites<\/figcaption><\/figure>\n<p>&nbsp;<\/p>\n<p>&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>During the next few weeks we are going to address very specific web design elements and attempt to go in more depth as to what they are, what benefits they bring and how to assess if this design item is a good option for your own website. This week we will start with Ghost Buttons. [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":876,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[10,11,20],"tags":[],"_links":{"self":[{"href":"https:\/\/businesswebsitecenter.com\/websitedesign\/wp-json\/wp\/v2\/posts\/875"}],"collection":[{"href":"https:\/\/businesswebsitecenter.com\/websitedesign\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/businesswebsitecenter.com\/websitedesign\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/businesswebsitecenter.com\/websitedesign\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/businesswebsitecenter.com\/websitedesign\/wp-json\/wp\/v2\/comments?post=875"}],"version-history":[{"count":8,"href":"https:\/\/businesswebsitecenter.com\/websitedesign\/wp-json\/wp\/v2\/posts\/875\/revisions"}],"predecessor-version":[{"id":885,"href":"https:\/\/businesswebsitecenter.com\/websitedesign\/wp-json\/wp\/v2\/posts\/875\/revisions\/885"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/businesswebsitecenter.com\/websitedesign\/wp-json\/wp\/v2\/media\/876"}],"wp:attachment":[{"href":"https:\/\/businesswebsitecenter.com\/websitedesign\/wp-json\/wp\/v2\/media?parent=875"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/businesswebsitecenter.com\/websitedesign\/wp-json\/wp\/v2\/categories?post=875"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/businesswebsitecenter.com\/websitedesign\/wp-json\/wp\/v2\/tags?post=875"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}