SEO configuration - ariel-fer/Araena GitHub Wiki

[[TOC]]

Topics added without confirmation needed:

Added global cannonical Tags to Webflow H1-6 order Image Alt tags added Reviewed that no issues appear in any pages from the Webflow's audit feature

Title Tags and Meta Descriptions:

Title tags: no more than 60 characters Meta Description: between 50 and 160 characters.

Home

Title Tag: Wizard on Demand: Technical content marketing agency Meta Description: At Wizard on Demand, we create and execute technical content marketing strategies for software companies. Learn more about the problems we solve. Open Graph Image: image.png

Blog posts

Title tag: Blog - Wizard on Demand Slug: /blog Meta Description: Read about our approach to technical content marketing that helps software companies generate relevant traffic and get more customers. Open Graph Image: image.png

Our Team

Title tag: Our Team - Wizard on Demand Slug: /our-team Meta Description: Read about our approach to technical content marketing that helps software companies generate relevant traffic and get more customers. Open Graph Image: image.png

Careers at Wizard on Demand

Title tag: Careers - Wizard on Demand Slug: /careers Meta Description: Interested in working at Wizard on Demand? Have a look at our current openings. Open Graph Image: image.png

Course

Title tag: Technical Writing Tips - Wizard on Demand Slug: /course Meta Description: Our technical writing tips are based on our team’s experience creating content for leading software companies around the world. Join the mailing list to receive regular tips from us. Open Graph Image: image.png

Contact Us

Title tag: Contact us - Wizard on Demand Slug: contact-us Meta Description: Get in touch with us to see if we can help Open Graph Image: image.png

Careers Post (CMS)

Title tag: {CMS NAME} - Careers at Wizard on Demand Slug: Meta Description: {CMS JOB DESCRIPTION SUMMARY} Open Graph Image: image.png

Blog Post (CMS)

Title tag: {CMS NAME} - Wizard on Demand Slug: Meta Description: {CMS POST SUMMARY} Open Graph Image: image.png

Slugs in Blog posts

These must be short. if we need to modify them, we must also set a redirect to old urls since these were already indexed by search engines.

Help us help you:

Slug: /post/collaborating-with-our-technical-content-marketing-agency Proposed Slug: /post/help-us-help-you

28 Top Technical Writing Blogs, Tools, and Resources

Slug: /post/top-technical-writing-blogs-tools-resources Proposed Slug: /post/technical-writing-resources

Why Work as a Technical Writer

Slug: /post/why-work-as-a-technical-writer Proposed Slug: /post/work-as-technical-writer

How Technical Content Writers Feature in Our Content Creation Process

Slug: /post/how-technical-content-writers-feature-in-our-content-creation-process Proposed Slug: /post/technical-content-writers-role

Content attribution for SaaS - A case study with FlowMapp

Slug: /post/content-attribution-for-saas

Audience Research Process: A Case Study with Archbee

Slug: /post/audience-research-process-a-case-study-with-archbee Proposed Slug: /post/audience-research-case-study

5 Tips for Choosing a Technical Content Writer for Your Marketing Team

Slug: /post/5-tips-for-choosing-a-technical-content-writer-for-your-marketing-team Proposed Slug: /post/choosing-technical-content-writer

Why You Should Be Hiring a Technical Content Agency and Not a Freelance Technical Writer

Slug: /post/why-you-should-be-hiring-a-technical-content-agency-and-not-a-freelance-technical-writer Proposed Slug: /post/why-hire-a-technical-content-agency

Pending updates from WoD:

  • NEED TO ADD POST Summary to "Audience research process: A case study with Archbee"
  • Shorten summary for "5 Tips for Choosing a technical content writer for your marketing campaign"

#Web accesibility

Making sure site is accesible and usable for everyone

Mobile friendly

  • Revise if there is no horizontal scroll on smaller breakpoints

Make typography accessible

  • Set typography on REMs instead of pixels(px overwrite users default settings)

Check contrast between text and background

  • Use text color contrast ratio from webflow

Captura.PNG

Line height

  • Set line height for paragraphs between 1.3 and 1.7

High legible font

  • Easily distinct between characters

Line length

  • Set line length for paragraphs and block posts between 45 and 75 characters per line(max width on webflow)

Alignments

  • Aline block posts and paragraphs text to the left

Site structure

  • Access to all pages as few clicks as possible
  • Avoid orphaned pages(pages that are not linked with the site)

Made sitemap on home page

  • Section/page that contains links to every page from the site ###Hyperlinks
  • Avoid using generic labels inside those labels
  • Write something descriptive about the link

Breadcrump navigation

  • Adding this helps orienting the user
  • The user can see where they are image.png

Semantic HTML tags

  • Help the user to interpret the content
  • Select the element and set their respective tag
  • Select the element that contains the navigation links and set it the tag=nav
  • Select the element that contains the header and set it the tag=header
  • Select the element that contains independent content and set it the tag=article
  • Select the element that contains the footer and set it the tag=footer
  • Select the element that contains contact information and set it the tag=address

Make sure to fix any internal links broken links

Use simple language

  • Keep sentences short and easy to understand
  • Avoid technical terms

Google my business

#Core web vitals Perfoming badly on these metrics will result in lower organic traffic ###How long does the site takes to load(LCP) Poor LCP can be caused by:

  • Slow server response time
  • Render blocking javascript or css
  • Slow resource load times
  • Cliente-side rendering ###How long does the site takes to become interactive(FID) Poor FID can be caused by:
  • Long tasks
  • Long JS execution
  • Large JS bundles
  • Render blocking JavaScript ###FID and LCP can be tackled together by following these steps:
  • Self-host fonts: In case of using Google fonts, Webflow host them by default but they slow our site, so we can self-host it. Go to the font and download the woff2 file from the font and upload it on the custom font configuration.
  • Avoid using reCAPTCHA: reCAPTCHA will load on every page of your site. Use custom code to add it only in the page that you need.
  • Minify your code: This will help you removing unneeded code. On advanced Publishing options tick all of the boxes.
  • Do not overuse interactions: Interactions slow down the site, instead try to use interactions and animations from the CSS panel because they are way lighter.
  • Delete unused interactions and CSS
  • Delete any non-critical JavaScript
  • Optimize your images
  • Compress your images: You can compress jpg, jpeg, .png and webp assets in Webflow. Go to the images panel and extend it, select the images and press compress
  • Set loading to lazy if you want to load images quicker and only if the users scroll into them. Lazy loading is the default option nowadays but you should take into account this in older sites. ###Stability of the site while loading(CLS) CLS can be caused by:
  • Images Ads, embeds & iframes without dimensions
  • Dynamically injected content
  • Webfonts causing unstyled content

Can be avoided by:

  • Using transform properties to animate elements instead of changing the width and the height of an element
  • Avoid inserting elements above other elements
  • Always include size attributes on your images and video elements (go to images and videos and define a fixed width and height instead of leaving them at auto). One option is to set the same dimensions of the image on width and height.
  • Using custom code to reserve space for dynamically injected content
⚠️ **GitHub.com Fallback** ⚠️