CINXE.COM
Ad Design & Specs - EthicalAds
<!doctype html> <html lang="en"> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" /> <meta name="generator" content="Pelican" /> <meta property="og:site_name" content="EthicalAds"/><meta name="description" content="The ad specifications for EthicalAds, and information on what works and what doesn't." /> <meta property="og:description" content="The ad specifications for EthicalAds, and information on what works and what doesn't." /><meta property="og:type" content="article" /> <meta property="og:title" content="Ad Design & Specs" /><!-- Default image --> <meta property="og:image" content="https://www.ethicalads.io/theme/img/logo-opengraph.png" /> <!-- Bootstrap CSS --> <link rel="stylesheet" href="/theme/dist/main.css"> <title>Ad Design & Specs - EthicalAds</title> <link rel="canonical" href="https://www.ethicalads.io/advertisers/ad-design-and-specs/" /> <meta property="og:url" content="https://www.ethicalads.io/advertisers/ad-design-and-specs/" /> <!-- Feeds --> <link href="https://www.ethicalads.io/feeds/all.atom.xml" type="application/atom+xml" rel="alternate" title="EthicalAds Full Atom Feed" /> <!-- Favicons --> <link rel="icon" href="/theme/img/favicons/favicon.svg" type="image/svg+xml"> <link rel="icon" href="/theme/img/favicons/favicon-32x32.png" sizes="32x32" type="image/png"> <link rel="icon" href="/theme/img/favicons/favicon-16x16.png" sizes="16x16" type="image/png"> <link rel="icon" href="/theme/img/favicons/favicon.ico"> <!-- Plausible privacy-friendly analytics --> <script defer data-domain="ethicalads.io" src="https://plausible.io/js/plausible.js"></script> <script async type="text/javascript" src="/_/static/javascript/readthedocs-addons.js"></script><meta name="readthedocs-project-slug" content="ethicaladsio" /><meta name="readthedocs-version-slug" content="latest" /><meta name="readthedocs-resolver-filename" content="/advertisers/ad-design-and-specs/" /><meta name="readthedocs-http-status" content="200" /></head> <body class="bg-light"> <nav class="navbar navbar-expand-lg navbar-light"> <div class="container"> <!-- Brand --> <a class="navbar-brand" href="/"> <img src="/theme/img/ethicalads-logo-blue.svg" class="navbar-brand-img" alt="EthicalAds"> </a> <!-- Toggler --> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <!-- Collapse --> <div class="collapse navbar-collapse" id="navbarCollapse"> <!-- Toggler --> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation"> <span class="fa fa-close"></span> </button> <!-- Navigation --> <ul class="navbar-nav ml-auto"> <li class="nav-item"> <a class="nav-link mr-md-2" href="/blog/">Blog</a> </li> <li class="nav-item"> <a class="nav-link mr-md-2" href="/advertisers/pricing/">Pricing</a> </li> <li class="nav-item"> <a class="nav-link mr-md-2" href="/advertisers/">Advertisers</a> </li> <li class="nav-item"> <a class="nav-link mr-md-2" href="/publishers/">Publishers</a> </li> </ul> <ul class="navbar-nav ml-auto"> <!----> <li class="nav-item lift"> <a class="nav-item btn btn-sm btn-outline-primary" href="/advertisers/">Advertise with Us</a> </li> </ul> </div> </div> </nav> <main> <section class="py-10"> <div class="container"> <div class="mb-8"> <h1 class="font-weight-bold text-center">EthicalAds creative specs & design</h1> <p class="lead text-center">Our ad specifications as well as some tips and tricks</p> </div> <div class="row row-cols-1 row-cols-md-3 mb-8"> <!-- The body --> <div class="col mb-2"> <div class="card shadow-sm h-100"> <div class="card-body"> <h3 class="card-title">Ad body</h3> <p class="card-text">The ad body can be <strong>up to 100 characters</strong> and can include an optional bold headline and call to action.</p> <hr> <div class="text-center small rounded py-3"> <strong>Read the Docs for Business:</strong> <span> You write the docs. We do the rest. </span> <strong>Try it today!</strong> </div> </div> </div> </div> <!-- The image --> <div class="col mb-2"> <div class="card shadow-sm h-100"> <div class="card-body"> <h3 class="card-title">Ad image</h3> <p class="card-text">The image is <strong>240*180 pixels</strong> to support high resolution displays, and is displayed at 120*90px. The image can be optional to support publishers who use text-only ads.</p> <hr> <div class="text-center rounded py-3"> <img src="/images/pages/rtd-ad-example.png" width="120" alt="Ad image example"> </div> </div> </div> </div> <!-- The link --> <div class="col mb-2"> <div class="card shadow-sm h-100"> <div class="card-body"> <h3 class="card-title">Landing page URL</h3> <p class="card-text">The URL is where users land after clicking and can include measurement parameters so you know the traffic came from us.</p> <hr> <div class="text-center rounded py-3"> <code class="small">https://about.readthedocs.com/?utm_source=ethicalads</code> </div> </div> </div> </div> </div> <!-- /row --> <div class="row"> <div class="col col-md-8 mx-auto text-center"> <h2 class="font-weight-bold mb-2">Putting it together: the final ad</h2> <div class="mt-5 loaded raised" data-ea-type="image" data-ea-publisher="unknown"> <div class="ea-content"> <a href="https://about.readthedocs.com/?ref=ethicalads" rel="nofollow noopener" target="_blank"> <img src="/images/pages/rtd-ad-example.png" alt="Read the Docs advertisement"> </a> <div class="ea-text"> <a href="https://about.readthedocs.com/?ref=ethicalads" rel="nofollow noopener" target="_blank"> <strong>Read the Docs for Business:</strong> <span> You write the docs. We do the rest. </span> <strong>Try it today!</strong> </a> </div> </div> <div class="ea-callout"> <a rel="nofollow noopener" href="https://ethicalads.io/">Ad by EthicalAds</a> </div> </div> <div class="mt-5 loaded raised" data-ea-type="text" data-ea-publisher="unknown"> <div class="ea-content"> <div class="ea-text"> <a href="https://about.readthedocs.com/?ref=ethicalads" rel="nofollow" target="_blank"> <strong>Read the Docs for Business:</strong> <span> You write the docs. We do the rest. </span> <strong>Try it today!</strong> </a> </div> </div> <div class="ea-callout"> <a rel="nofollow noopener" href="https://ethicalads.io/">Ad by EthicalAds</a> </div> </div> </div> </div> </div> </section> <section class="container py-5" id="performance-tips"> <h2 class="font-weight-bold mb-8 text-center">Tips to improve your ad performance</h2> <div class="row mb-5"> <div class="col col-md-6 mx-auto"> <ul> <li>Provide 2 or more variations of the ad.</li> <li>Make sure to provide at least one of a headline or call to action.</li> <li>Logo-only images can work but they work best if the brand is well-known to devs.</li> <li>Product images, diagrams, or infographic-style images work very well.</li> <li>Make sure any text in the image is visible and legible. <strong>We recommend using at most 5-7 words</strong> to ensure they are readable.</li> </ul> <p>For more tips and tricks, check out our <a href="/advertiser-guide/">advertiser guide</a>.</p> </div> </div> </section> <section class="container py-5" id="top-examples"> <h2 class="font-weight-bold mb-8 text-center">Top performing examples</h2> <div class="row mb-5"> <div class="col col-md-4 mb-3 text-center"> <div class="loaded raised" data-ea-type="image" data-ea-publisher="unknown"> <div class="ea-content"> <a href="#" rel="nofollow noopener" target="_blank"> <img src="/images/pages/top-ad-example-1.png" alt="Top ad example"> </a> <div class="ea-text"> <a href="#" rel="nofollow noopener" target="_blank"> <strong>Free e-book:</strong> <span> Learn to choose the best open source packages. </span> <strong>Download now!</strong> </a> </div> </div> <div class="ea-callout"> <a rel="nofollow noopener" href="https://ethicalads.io/">Ad by EthicalAds</a> </div> </div> </div> <div class="col col-md-4 mb-3 text-center"> <div class="loaded raised" data-ea-type="image" data-ea-publisher="unknown"> <div class="ea-content"> <a href="#" rel="nofollow noopener" target="_blank"> <img src="/images/pages/top-ad-example-2.png" alt="Top ad example"> </a> <div class="ea-text"> <a href="#" rel="nofollow noopener" target="_blank"> <strong>Compiling to Assembly from Scratch</strong> <span> — the book — </span> <strong>#ARM #TypeScript</strong> </a> </div> </div> <div class="ea-callout"> <a rel="nofollow noopener" href="https://ethicalads.io/">Ad by EthicalAds</a> </div> </div> </div> <div class="col col-md-4 mb-3 text-center"> <div class="loaded raised" data-ea-type="image" data-ea-publisher="unknown"> <div class="ea-content"> <a href="#" rel="nofollow noopener" target="_blank"> <img src="/images/pages/top-ad-example-3.png" alt="Top ad example"> </a> <div class="ea-text"> <a href="#" rel="nofollow noopener" target="_blank"> <strong>Private Cloud in a Box:</strong> <span> Run 100+ VPS and deploy in <10 seconds. </span> <strong>Try Risk-Free!</strong> </a> </div> </div> <div class="ea-callout"> <a rel="nofollow noopener" href="https://ethicalads.io/">Ad by EthicalAds</a> </div> </div> </div> </div> </section> <section class="container py-5" id="we-work-with-you"> <h2 class="font-weight-bold mb-8 text-center">We work with you to help your campaign succeed</h2> <div class="row mb-5"> <div class="col-12 col-md-6 mb-3"> <h4 class="font-weight-bold">Need help with your creatives?</h4> <p>We are happy to help you get your campaign up and running. If you have creatives you're running successfully elsewhere, we can help you adapt them to our ad formats. If you need more help creating ads that convert, let us know. We've run a lot of campaigns on our network and we know what works.</p> </div> <div class="col-md-6"> <h4 class="font-weight-bold" id="faq-how-much">We ensure your ads are working</h4> <p>We check-in on your campaign multiple times with tips about what is working and what isn't. We want your campaign to work well and we give you advice throughout the duration and work with you to make it successful.</p> </div> </div> <p class="mt-6 text-center"> <a href="/advertisers/help-with-your-ads/">Learn more</a> about how we help you run a successful campaign. </p> </section> </main> <!-- SHAPE ================================================== --> <div class="position-relative d-print-none"> <div class="shape shape-bottom shape-fluid-x svg-shim text-dark"> <svg viewBox="0 0 2880 48" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M0 48h2880V0h-720C1442.5 52 720 0 720 0H0v48z" fill="currentColor" /> </svg> </div> </div> <!-- CTA ================================================== --> <section class="pt-6 pt-md-8 bg-dark text-light d-print-none"> <div class="container pb-6 pb-md-8 border-bottom border-gray-300"> <div class="row" id="newsletter"> <div class="col-12 col-md"> <!-- Heading --> <h3 class="mb-3 font-weight-bold">Become an advertiser</h3> <!-- Text --> <p class="mb-6 mb-md-0"> <a class="btn btn-sm btn-primary" href="/advertisers/">Start your campaign today!</a> </p> </div> <div class="col-12 col-md"> <!-- Heading --> <h3 class="mb-3 font-weight-bold">Become a publisher</h3> <!-- Text --> <p class="mb-6 mb-md-0"> <a class="btn btn-sm btn-primary" href="/publishers/">Start earning money from your site</a> </p> </div> </div> <!-- / .row --> </div> <!-- / .container --> </section> <footer class="py-8 py-md-11 bg-dark d-print-none"> <div class="container"> <div class="row"> <div class="col-12 col-md-4 col-lg-3 text-center"> <!-- Brand --> <img src="/theme/img/ethicalads-logo-blue.svg" alt="EthicalAds" class="footer-brand img-fluid mb-2"> <!-- Text --> <p class="text-gray-600 mb-2 text-center">A division of <a class="text-reset" href="https://readthedocs.org?ref=ethicalads-footer">Read the Docs</a></p> <!-- Social --> <ul class="list-unstyled list-inline list-social mt-4 mb-6 mb-md-0 d-flex"> <li class="list-inline-item list-social-item flex-fill text-center"> <a href="https://twitter.com/ethicaladsio" class="text-decoration-none text-gray-600"> <svg aria-hidden="true" focusable="false" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="32" height="32"> <path fill="currentColor" d="M459.37 151.716c.325 4.548.325 9.097.325 13.645 0 138.72-105.583 298.558-298.558 298.558-59.452 0-114.68-17.219-161.137-47.106 8.447.974 16.568 1.299 25.34 1.299 49.055 0 94.213-16.568 130.274-44.832-46.132-.975-84.792-31.188-98.112-72.772 6.498.974 12.995 1.624 19.818 1.624 9.421 0 18.843-1.3 27.614-3.573-48.081-9.747-84.143-51.98-84.143-102.985v-1.299c13.969 7.797 30.214 12.67 47.431 13.319-28.264-18.843-46.781-51.005-46.781-87.391 0-19.492 5.197-37.36 14.294-52.954 51.655 63.675 129.3 105.258 216.365 109.807-1.624-7.797-2.599-15.918-2.599-24.04 0-57.828 46.782-104.934 104.934-104.934 30.213 0 57.502 12.67 76.67 33.137 23.715-4.548 46.456-13.32 66.599-25.34-7.798 24.366-24.366 44.833-46.132 57.827 21.117-2.273 41.584-8.122 60.426-16.243-14.292 20.791-32.161 39.308-52.628 54.253z"> </path> </svg> <span class="sr-only">Twitter</span> </a> </li> <li class="list-inline-item list-social-item flex-fill text-center"> <a href="https://github.com/readthedocs" class="text-decoration-none text-gray-600"> <svg aria-hidden="true" focusable="false" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 496 512" width="32" height="32"> <path fill="currentColor" d="M165.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3.3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5.3-6.2 2.3zm44.2-1.7c-2.9.7-4.9 2.6-4.6 4.9.3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM244.8 8C106.1 8 0 113.3 0 252c0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1C428.2 457.8 496 362.9 496 252 496 113.3 383.5 8 244.8 8zM97.2 352.9c-1.3 1-1 3.3.7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3.3 2.9 2.3 3.9 1.6 1 3.6.7 4.3-.7.7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3.7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3.7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9 1.6 2.3 4.3 3.3 5.6 2.3 1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"> </path> </svg> <span class="sr-only">GitHub</span> </a> </li> <li class="list-inline-item list-social-item flex-fill text-center"> <a href="https://youtube.com/@ethicalads" class="text-decoration-none text-gray-600"> <svg aria-hidden="true" focusable="false" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 310 310" width="32" height="32"> <path fill="currentColor" d="M297.917,64.645c-11.19-13.302-31.85-18.728-71.306-18.728H83.386c-40.359,0-61.369,5.776-72.517,19.938 C0,79.663,0,100.008,0,128.166v53.669c0,54.551,12.896,82.248,83.386,82.248h143.226c34.216,0,53.176-4.788,65.442-16.527 C304.633,235.518,310,215.863,310,181.835v-53.669C310,98.471,309.159,78.006,297.917,64.645z M199.021,162.41l-65.038,33.991 c-1.454,0.76-3.044,1.137-4.632,1.137c-1.798,0-3.592-0.484-5.181-1.446c-2.992-1.813-4.819-5.056-4.819-8.554v-67.764 c0-3.492,1.822-6.732,4.808-8.546c2.987-1.814,6.702-1.938,9.801-0.328l65.038,33.772c3.309,1.718,5.387,5.134,5.392,8.861 C204.394,157.263,202.325,160.684,199.021,162.41z"> </path> </svg> <span class="sr-only">YouTube</span> </a> </li> </ul> </div> <div class="col-12 col-md-4 col-lg-3"> <!-- Heading --> <a href="/advertisers/"> <h6 class="font-weight-bold text-uppercase text-gray-700">Advertisers</h6> </a> <!-- List --> <ul class="list-unstyled text-muted mb-6 mb-md-8 mb-lg-0"> <li class="mb-3"> <a href="/advertisers/ad-design-and-specs/" class="text-reset">Creative Specs</a> </li> <li class="mb-3"> <a href="/publishers/list/" class="text-reset">Top Publishers</a> </li> <li class="mb-3"> <a href="https://www.ethicalads.io/prospectus/ethicalads-advertiser-prospectus.pdf" class="text-reset">Advertiser Prospectus</a> </li> <li class="mb-3"> <a href="https://ethicalads.io/advertisers/calculator/" class="text-reset">Campaign Calculator</a> </li> <li class="mb-3"> <a href="/advertisers/similar-pages/" class="text-reset">Niche Targeting Demo</a> </li> <li class="mb-3"> <a href="/advertisers/faq/" class="text-reset">Advertiser FAQ</a> </li> <li class="mb-3"> <a href="https://server.ethicalads.io/" class="text-reset">Advertiser Login</a> </li> </ul> </div> <div class="col-12 col-md-4 col-lg-3"> <!-- Heading --> <a href="/publishers/"> <h6 class="font-weight-bold text-uppercase text-gray-700">Publishers</h6> </a> <!-- List --> <ul class="list-unstyled text-muted mb-6 mb-md-8 mb-lg-0"> <li class="mb-3"> <a href="/publishers/calculator/" class="text-reset">Revenue Calculator</a> </li> <li class="mb-3"> <a href="/publisher-guide/" class="text-reset">Publisher Guide</a> </li> <li class="mb-3"> <a href="/publishers/faq/" class="text-reset">Publisher FAQ</a> </li> <li class="mb-3"> <a href="/publisher-policy/" class="text-reset">Publisher Policy</a> </li> <li class="mb-3"> <a href="https://ethical-ad-client.readthedocs.io/en/latest/" class="text-reset">Ad Client Documentation</a> </li> <li class="mb-3"> <a href="https://server.ethicalads.io/" class="text-reset">Publisher Login</a> </li> </ul> </div> <div class="col-12 col-md-4 offset-md-4 col-lg-3 offset-lg-0"> <!-- Heading --> <h6 class="font-weight-bold text-uppercase text-gray-700">Content</h6> <!-- List --> <ul class="list-unstyled text-muted mb-0"> <li class="mb-3"> <a href="/blog/" class="text-reset">Blog</a> </li> <li class="mb-3"> <a href="/learning-hub/" class="text-reset">Learning Hub</a> </li> <li class="mb-3"> <a href="/alternative-to-google-ads/" class="text-reset">Google Ads Comparison</a> </li> <li class="mb-3"> <a href="/alternative-to-carbon-ads/" class="text-reset">Carbon Ads Comparison</a> </li> </ul> <!-- Heading --> <h6 class="font-weight-bold text-uppercase text-gray-700">Company</h6> <!-- List --> <ul class="list-unstyled text-muted mb-0"> <li class="mb-3"> <a href="/about/" class="text-reset">About Us</a> </li> <li class="mb-3"> <a href="/contact/" class="text-reset">Contact</a> </li> <li class="mb-3"> <a href="/press/" class="text-reset">Press Kit</a> </li> <li class="mb-3"> <a href="/privacy-policy/" class="text-reset">Privacy Policy</a> </li> <li class="mb-3"> <a href="/terms-of-service/" class="text-reset">Terms of Service</a> </li> <!-- <li class="mb-3"> <a href="/jobs/" class="text-reset">Jobs</a> </li> --> </ul> </div> </div> <!-- / .row --> </div> <!-- / .container --> </footer> <script src="/theme/dist/bundle.js"></script> </body> </html>