- handbook
- Company
- Company
- Board
- Communications
- Decision making
- Guides
- KPIs and OKRs
- principles
- Remote Work
- Security
- Asset Management Policy
- Business Continuity & Disaster Recovery Policy
- Data Management Policy
- Information Security Roles and Responsibilities
- Operations Security Policy
- Risk Management Policy
- Third-Party Risk Management Policy
- Human Resources Security Policy
- Access Control Policy
- Incident Response Plan
- Cryptography Policy
- Information Security Policy and Acceptable Use Policy
- Secure Development Policy
- strategy
- values
- Operations
- Product
- Feedback
- Metrics
- Node-RED Dashboard
- personas
- Pricing Principles
- Principles
- Product Categories
- Responsibilities
- Strategy
- Versioning
- Customer department
- Customer
- Hubspot
- Marketing
- How we work
- Marketing
- Video
- Boiler Plate Descriptions
- Marketing - Website
- Customer Stories
- Webinars
- Social Media
- blog
- Sales
- Engineering & Design Practices
- Design
- Engineering
- contributing
- Front End
- Packaging Guidelines
- Platform Ops
- Project Management
- Releases
- Security Policy
- tools
- Internal Operations
- People Ops
# Marketing Website
- All written content should be in UK English.
- All page titles should summarise the content, keep the URL length as short as practical and use Kebab Case.
- All images should use informative alt tags which clearly describe the point of an image rather than all the details. Alt tags should be no longer than 60 characters.
- When mentioning FlowFuse Concepts (terminology) where possible we should link to an explanation of that concept.
- All written content should use the Oxford Comma. We believe the Oxford Comma reduces the ambiguity of written technical content.
# Events Banner
To update the event banner that appears at the top of the Website, you will need two pieces of information:
- The title of the Webinar
- URL that the Webinar Registration is hosted at
Once you have those, you can update the following file:
Update the href="" value of the <a> tag to update the Event URL, and change the title inside the middle <span>
You should also ensure that the banner is not disabled in this file. If it is, it would look like this:
{# {% include "../components/events-banner.njk" %} #}. Please remove the comment symbols {# and #} to enable the banner.
# Images
All images on the website, whether part of the blog or otherwise, are run though an image pipeline, that compresses, resizes and converts the images to reduce file size and improve page loading speed.
That pipeline also generates x2 versions of images for high DPI screens if the provided image is large enough.
The first build locally will take roughly a minute, while the cache remains intact, all future builds should take only a few seconds.
Guidelines for including images:
- Downsize the image to at maximum two times the width it will be displayed (1300px for blog prose)
- Ideally use JPEG for lossy ok images, and PNG for others (they will be converted to AVIF and WebP regardless)
- Wherever possible use:
- The markdown image include tag in blog prose:
- You can use the
@skiptag to disable the image pipeline entirely for an image
- You can use the
- The NJK shortcode in website body:
{% image "./relative-path-to-image.png", "Image alt tag for screen readers", [150] %}- Where 150 is the maximum width the image will be displayed on the page (source image should be two times this width)
- The markdown image include tag in blog prose:
- GIFs can grow incredibly large, consider using a video in a modern format if the animation is longer than a few seconds
# Meta Keywords
Meta keywords are a type of metadata that provide information about the content of a webpage. They are commonly used by search engines to understand the topics covered in a page and improve its visibility in search results.
# Default Keywords
By default, each webpage on the FlowFuse website includes a set of predefined keywords: Node-RED, Application Developement, IoT, IIoT, Low-Code, Open-Source, open source. These default keywords are relevant to the overall theme of the website and help categorize the content.
# Priority of Keywords
When it comes to determining which keywords to include in the meta tags of a webpage, FlowFuse follows a specific priority order:
-
Tags: The tags assigned to the content take precedence and are included as meta keywords. These tags are used to categorize the content and provide relevant context.
-
Meta Keywords: If no tags are available, the meta keywords specified in the front matter of the webpage are used. These meta keywords are specifically defined for each page and offer additional context.
-
Default Keywords: These keywords are always included and provide general information about the website's content. They can be appended to the keywords obtained from previous points. If neither tags nor meta keywords are present, the default keywords are used as a fallback option.
# Adding Meta Keywords
To specify meta keywords for a webpage, include them in the front matter of the Markdown file. Here's an example:
---
title: Example Page
meta:
keywords: flowfuse, flows, manufacturing
---# Reviewing Pull Requests
When creating a PR and requesting a review from a FlowFuse team member, please consider if the content is ready to be released ASAP or if its release should be to a particular schedule. If you don't want the reviewer to merge the content (in effect put it live on the website) mark the PR as a draft in GitHub. If you are reviewing a website PR and it is not marked as draft you can merge it, otherwise simply review and where appropriate approve the PR.