{"id":187280,"date":"2014-10-29T09:06:07","date_gmt":"2014-10-29T16:06:07","guid":{"rendered":"http:\/\/css-tricks.com\/?page_id=187280"},"modified":"2024-03-28T07:14:29","modified_gmt":"2024-03-28T14:14:29","slug":"guest-writing-for-css-tricks","status":"publish","type":"page","link":"https:\/\/css-tricks.com\/guest-writing-for-css-tricks\/","title":{"rendered":"Guest Writing for CSS-Tricks"},"content":{"rendered":"\n<p>Interested in guest writing for CSS-Tricks? We love <a href=\"https:\/\/css-tricks.com\/authors\/\">guest writers<\/a> around here! It&#8217;s always a win-win-win.<\/p>\n\n\n\n<ol>\n<li><strong>It&#8217;s a win for our readers,<\/strong> as they get to learn from your experience. Nobody knows exactly what you know.<\/li>\n\n\n\n<li><strong>It&#8217;s a win for you, the writer.<\/strong> We have a budget for guest writing of $300 for most articles, payable via PayPal or DigitalOcean credit. Complex production-focused topics may be paid out up to $400. <\/li>\n\n\n\n<li><strong>It&#8217;s a win for our website.<\/strong> We exist on content that people who make websites want to read.<\/li>\n<\/ol>\n\n\n<h2 class=\"simpletoc-title \">Table of Contents<\/h2><ul class=\"simpletoc-list\"   >\n<li>\n<a  href=\"#what-to-keep-in-mind-when-guest-writing\">What to keep in mind when guest writing<\/a><\/li><li>\n<a  href=\"#possible-topics\">What you should write about<\/a><\/li><li>\n<a  href=\"#the-audience\">Audience, tone, and length<\/a><\/li><li>\n<a  href=\"#pitch\">Submit your proposal<\/a><\/li><\/ul>\n\n<h3 class=\"wp-block-heading\" id=\"what-to-keep-in-mind-when-guest-writing\">What to keep in mind when guest writing<\/h3>\n\n\n<ol>\n<li>Write the article you wish you found when you Googled for it. (Chris&#8217; <a href=\"https:\/\/twitter.com\/chriscoyier\/status\/925081793576837120\" rel=\"noopener\">tweet<\/a>)<\/li>\n\n\n\n<li>Deliver a <q>sensation of lived experience and professional acumen<\/q>. (<a href=\"https:\/\/css-tricks.com\/the-popeye-moment\/\">Frank Chimero<\/a>) <\/li>\n<\/ol>\n\n\n\n<p>Would <em>you<\/em> be happy to land on this article from a search? Are you speaking to me, developer-to-developer, from experience?<\/p>\n\n\n<h3 class=\"wp-block-heading\" id=\"possible-topics\">What you should write about<\/h3>\n\n\n<p>We&#8217;re looking for <strong>technical<\/strong>, <strong>referential<\/strong>, and <strong>instructional<\/strong> content, and veering away from editorial. Think &#8220;How to X&#8221; by default, in the realm of building websites. We also skew toward the front end, so the technologies around HTML, CSS, and JavaScript, as well as the widening circle of front-end concerns like site builders and frameworks<\/p>\n\n\n\n<p>We prefer if you are motivated <em>because you have something you very much want to share<\/em>. And, that you have a <em>deep knowledge<\/em> on this topic. You are <em>excited<\/em> about it. You&#8217;re <em>ready<\/em> to tell people about it on CSS-Tricks. That&#8217;s what makes for good guest writing on CSS-Tricks.<\/p>\n\n\n<h3 class=\"wp-block-heading\" id=\"the-audience\">Audience, tone, and length<\/h3>\n\n\n<p>The audience of CSS-Tricks is front-end web designers and developers at all different points in their professional journeys. We&#8217;re not going to tell you to target your articles at some arbitrary skill level like &#8220;beginner&#8221; or &#8220;advanced&#8221; \u2014 what you should target is <em>clarity<\/em>. Everyone appreciates an article written that makes technology understandable. You can generally assume basic knowledge of HTML, CSS, and JavaScript, except when covering those basics adds to the clarity of your article.<\/p>\n\n\n\n<p>The tone should be:<\/p>\n\n\n\n<ul>\n<li>Comprehensive and written for all experience levels<\/li>\n\n\n\n<li>Technically detailed and correct<\/li>\n\n\n\n<li>Practical, useful, and self-contained<\/li>\n\n\n\n<li>Friendly but formal<\/li>\n<\/ul>\n\n\n\n<details >\n  <summary>\n          Examples      <\/summary>\n  \n\n<ul>\n<li>Sara Soueidan wrote <a href=\"https:\/\/css-tricks.com\/guide-svg-animations-smil\/\">a great well-researched in-depth post<\/a> on SMIL. <\/li>\n\n\n\n<li>Tim Evko <a href=\"https:\/\/css-tricks.com\/hassle-free-responsive-images-for-wordpress\/\">wrote about solving a problem he was having<\/a> in WordPress surrounding responsive images, and built an entire plugin for it.<\/li>\n\n\n\n<li>Zell Liew wrote a book about Susy and <a href=\"https:\/\/css-tricks.com\/build-web-layouts-easily-susy\/\">wrote a tutorial<\/a> on re-creating the CSS-Tricks layout with Susy in part to promote that book. Joni Trythall <a href=\"https:\/\/css-tricks.com\/look-svg-light-source-filters\/\">did similar<\/a> with her book release.<\/li>\n\n\n\n<li>Tobias G\u00fcnther <a href=\"https:\/\/css-tricks.com\/deal-merge-conflicts-git\/\">wrote about a common problem in Git<\/a>, a problem he&#8217;s solved pretty well in building his own app, Tower.<\/li>\n<\/ul>\n\n\n\n<p>Authors have their own dedicated page on the site. For example, <a href=\"https:\/\/css-tricks.com\/author\/scofennell\/\">Scott Fennell<\/a>.<\/p>\n\n\n<\/details>\n\n\n<p>The loose goal for length is<strong> 600 words<\/strong>. An article can be shorter if it&#8217;s extremely useful and clear. Or an article can be a huge guide covering tons of details on a technology. <\/p>\n\n\n\n<p><strong>Always good:<\/strong> <\/p>\n\n\n\n<ol>\n<li>A healthy amount of relevant images\/videos. Images have proper alt text and may have captions. Images may not be meme\/joke pics or pictures of code.<\/li>\n\n\n\n<li>Blocks of code that get right to the most important concepts.<\/li>\n\n\n\n<li>Demos. <a href=\"https:\/\/codepen.io\/\" rel=\"noopener\">CodePen<\/a>, if possible; other interactive code embeds, if needed.<\/li>\n<\/ol>\n\n\n<h3 class=\"wp-block-heading\" id=\"pitch\">Submit your proposal<\/h3>\n\n\n<p>You&#8217;ll need to write the article to the best of your ability upfront to provide a sense of your writing style, concept, and professional acumen. It doesn&#8217;t have to be perfect. There <em>will be<\/em> an editing process that happens after that.<\/p>\n\n\n\n<p class=\"is-style-explanation\">If you don&#8217;t have the time to write an article that may not be published on CSS-Tricks, we totally understand, but we can&#8217;t commit to publishing anything without seeing a complete draft. If you&#8217;d like to send in a shorter pitch instead, to get a signal on if the idea is worth pursuing, that&#8217;s fine, but no publishing decision will be made until a complete draft is in.<\/p>\n\n\n\n<p class=\"ticss-31d3f76c\">We ask everyone to fill out this form to guest post on CSS-Tricks, whether you have written for us before or are a new writer. We will never share your private information without your expressed permission. Thank you in advance for taking the time.<\/p>\n\n\n<div data-tf-live=\"01HT2PD4YPTS9MMJQYVR2189FD\"><\/div><script src=\"\/\/embed.typeform.com\/next\/embed.js\"><\/script>","protected":false},"excerpt":{"rendered":"<p>Interesting in guest writing on CSS-Tricks? It can be a great thing for everyone: you, our readers, and the site itself. Read up on what our expectations are, what you can expect, and what the workflow is like.<\/p>\n","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"sig_custom_text":"","sig_image_type":"featured-image","sig_custom_image":0,"sig_is_disabled":false,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"footnotes":""},"tags":[924],"acf":[],"jetpack-related-posts":[{"id":147848,"url":"https:\/\/css-tricks.com\/lodge\/learn-jquery\/","url_meta":{"origin":187280,"position":0},"title":"Learn jQuery from Scratch","date":"August 22, 2013","format":false,"excerpt":"This series will take you from zero to being confident in writing and working with jQuery and JavaScript.","rel":"","context":"Similar post","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2017\/03\/guide-jquery.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":323112,"url":"https:\/\/css-tricks.com\/almanac\/properties\/i\/inline-size\/","url_meta":{"origin":187280,"position":1},"title":"inline-size","date":"October 14, 2020","format":false,"excerpt":"inline-size is a logical property that defines the width of an element when the writing-mode is horizontal, or the height of the element when the writing-mode is vertical. .element { \u00a0 inline-size: 700px; \u00a0 writing-mode: vertical-lr; } As you might have guessed by the example above, the writing-mode property changes\u2026","rel":"","context":"Similar post","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":326293,"url":"https:\/\/css-tricks.com\/almanac\/properties\/t\/text-orientation\/","url_meta":{"origin":187280,"position":2},"title":"text-orientation","date":"November 27, 2020","format":false,"excerpt":"The text-orientation property in CSS aligns text in a line when working with a vertical writing-mode. Basically, it rotates either the line by 90\u00b0 clockwise to help control how vertical languages are displayed \u2014 much like the way text-combine-upright rotates groups of characters within a line of text in a\u2026","rel":"","context":"Similar post","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":324840,"url":"https:\/\/css-tricks.com\/almanac\/properties\/m\/max-inline-size\/","url_meta":{"origin":187280,"position":3},"title":"max-inline-size","date":"November 3, 2020","format":false,"excerpt":"max-inline-size is a logical property in CSS that defines the maximum width of an element when the writing-mode is horizontal, or the maximum height of the element when the writing-mode is vertical. .element { \u00a0 max-inline-size: 500px; \u00a0 writing-mode: vertical-lr; } CodePen Embed Fallback As you might have guessed by\u2026","rel":"","context":"Similar post","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":322833,"url":"https:\/\/css-tricks.com\/almanac\/properties\/i\/inset-block\/","url_meta":{"origin":187280,"position":4},"title":"inset-block","date":"October 9, 2020","format":false,"excerpt":"inset-block is a shorthand logical CSS property that sets the length that an element is offset in the block direction combining inset-block-start and inset-block-end. It's sort of like declaring top and bottom except its starting and ending points are determined by the element's direction, text-orientation and writing-mode, just like other\u2026","rel":"","context":"Similar post","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":332616,"url":"https:\/\/css-tricks.com\/almanac\/properties\/m\/margin-inline-start\/","url_meta":{"origin":187280,"position":5},"title":"margin-inline-start","date":"January 14, 2021","format":false,"excerpt":"The margin-inline-start property in CSS defines the amount of space along the outer starting edge of an element in the inline direction. It's included in the CSS Logical Properties Level 1 specification, which is currently in Working Draft. .element { margin-inline-start: 25%; writing-mode: vertical-lr; } The starting edge in the\u2026","rel":"","context":"In \"margin\"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"_links":{"self":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/187280"}],"collection":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/comments?post=187280"}],"version-history":[{"count":9,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/187280\/revisions"}],"predecessor-version":[{"id":377627,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/pages\/187280\/revisions\/377627"}],"wp:attachment":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media?parent=187280"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/tags?post=187280"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}