Ted’s Tool TimeTed VinkeFirst8

5 First8 Blog Writing Tips

February 2016

Ok, you already have GREAT content and a TARGET audience...

NumbersTitles and headings

5 Ways to Improve Your Writing

3 Things That Make a Great Leader

7 White Papers That Can Boost Your Business

10 Mistakes Smart People Never Make Twice

# 1 Attractive Headings & Formatting

Image: http://printingcode.runemadsen.com/lecture-intro/

QuestionsTitles and headings

How to mock configuration in a Grails unit- or integration test?

How to Use iCloud on Your iPhone 5 - For Dummies

How to solve Eclipse error cannot install breakpoint due to missing line number attributes

Headlines and sub-headlines

Titles and headings

Bullets, quotes,

numbers etcFormatting

# 2 Great Visuals

Image: http://i1-news.softpedia-static.com/images/news2/Aaru-s-Awakening-Review-PC-474977-4.jpg

One image

First image is used for the newsletter

Featured image

Featured image need to be set explicitly in current theme for blog overview

Always set Featured Image.Place same or other image in article.

Responsive Images in Wordpress 4.4WordPress automatically creates several sizes of each image uploaded to the media library. By including the available sizes of an image into a srcset attribute, browsers can now choose to download the most appropriate size and ignore the others—potentially saving bandwidth and speeding up page load times in the process.Source: https://make.wordpress.org/core/2015/11/10/responsive-images-in-wordpress-4-4/

Just insert an image full-width

# 3 Code Snippets

Image: http://aaronbartholomew.com/wp-content/uploads/2014/03/clean-code.jpg

<code>Inline code between <code>

1. Find candidates e.g.

“tasks”

<code>Inline code between <code>

2. Select the correct piece

<code>Inline code between <code>

3. Add the code style

(menu of Alt-Shift-X)

<code>Inline code between <code>

4. Done. Possibly repeat.

Now we have some inline code, for single statements...

...but we also have complete code listings.

Crayon Syntax Highlighter

Insert codeCode listing with Crayon

1. We want to insert code

here

Insert codeCode listing with Crayon

2. Use the <> button

Insert codeCode listing with Crayon

3. Paste or type code

Insert codeCode listing with Crayon

4. Select the language e.g. Java or XHTML

Insert codeCode listing with Crayon

5. Code has been inserted

Default detection not always works

Using “Default” Explicitly set to “XHTML”

Vertical code is more mobile-friendly

Avoid scrolling onsmall viewports

We can have Crayon word-wrap a block of code

Prefer reformattingvertically yourself

# 4 Relate With BusinessImage: http://tlists.com/wp-content/uploads/2015/09/business-plan-images.jpg

Link to servicesRelate with business

# 5 Exposure!

VoxxedSubmit an article

VoxxedSubmit an article

Further reading

• 5 Tips for Writing Blogs About Technical or Complex Topics

• How to Write Headlines That Make People AND Google Read Onward

• How to write technical blog?

• 93.700.00 other hits for https://www.google.nl/search?q=writing+a+technical+blog

• WordPress.org

• Crayon Syntax Highlighter (WordPress)

• Crayon Syntax Highlighter (GitHub)

• Responsive Images in WordPress 4.4

• Responsive Images in Practice (Eric, Portis, A List Apart)

No, thank you.