Other website page elements (A to Z)

This section outlines visual elements or functionality that are used less frequently (and typically only when there is a clear user need).

Accordions

Accordions are vertically stacked headings that can be clicked on to reveal or hide content. In an accordion, only the heading is visible on screen.

Planning accordions

Accordions hide information. They also require users to take an extra step (clicking on the accordion) to work out whether the accordion’s content is relevant to them.

Accordions should only be used if they support the user to:

• understand related content sections
• show or hide sections (for example, to show a transcript for a video)
• compare content that might otherwise be placed on separate pages.

Do not use accordions for content that all users need to see.

Creating accordions

• Headings in the accordion should be short and clear. It should clearly describe the content that will be shown once the user clicks on the heading.
• Text within accordions should be simple and easy-to-understand. Links can be included within accordions.

Banners

A notification banner is used to provide visibility and guide users for declared emergencies. The banner sits at the top of every website page and directs users to the main landing page for the emergency. It is referred to as a ‘safety alert bar’ in Squiz.

Research indicates notification banners should be used sparingly, as users can easily miss them. Because of this, Agriculture Victoria only uses banners for declared emergencies.

For best-practice emergency banners:

• Create text that is short, sharp and direct – no more than one or 2 sentences.
• The text provides a brief description of the emergency – and if relevant, why it is a concern.
• A single, short, action-driven in-text link directs people to more information. The link follows guidelines for in-text links.

Calculators and tools

Calculators and tools may be used on the website where we can clearly establish business need or user value. However, the development of these types of tools:

• requires longer time frames
• may require extra budget
• may require engagement with the Online Services Team or third parties.

They will be assessed and developed on a case-by-case basis. Please get in contact with the website team as soon as possible.

Forms

Staff fill in a form to access a service, or supply or report on information.

Forms require planning and have a longer lead time. If you need a form, contact the website team and provide plenty of notice.

Planning forms

Forms are most effective when they reflect user needs and behaviours. Before you start:

• work out the terms and phrases people use when they talk about the topic
• think about what questions you will ask and what information you need to gather
• consider how you will group that information, so the form flows logically, and you get the desired results
• include active instructions that describe what each part of the form does. Provide other information if needed.

Information received through a form can be sent to any email address or number of addresses. The information should be sent to a shared email inbox.

If you have an idea for a form you will need to discuss the scope and requirements with the web team to come up with the best solution.

Frequently asked questions

Frequently asked questions (FAQs) are strongly discouraged on agriculture.vic.gov.au. This is because FAQs:

• make more work for users – they are difficult to scan and understand; they cannot be front-loaded (putting the term that most people are looking for at the beginning of the sentence); and they are often presented in accordions they can’t be viewed at a glance.
• often duplicate other content on the site. This can lead to inconsistency, and it affects search results by creating duplicate, competing content.
• can mean that information isn’t where users expect to find it.

If a question is frequently asked, structure your content so that the question is clearly addressed.

Graphs and charts

Graphs and charts can be used to share information that is too detailed for text. This includes trends, statistical distributions or comparisons.

However, graphs and charts can be hard to read and present accessibility issues. They shouldn’t be used if there’s another format that can meet the user need, such as a list or table.

Make best-practice graphs that are easy to read:

• Use the style and colours outlined in the Agriculture Victoria brand guidelines.
• Keep it simple, where possible. For example, include no more than 3 or 4 data series on a line graph.
• Include a short, clear heading that explains the contents of the graph or chart.
• Label the x- and y-axes.
• Use gridlines only where they help people read the data.
• Include a legend that tells users the meaning of lines, colours and symbols.
• Include all units of measurement, as this helps users understand what the numbers mean.

Accessibility requirements for graphs and charts

• Graphs and charts must include alt text that describes the information in the image. See accessibility requirements: images for details.
• If the information is complex, consider complementing the graph with a table of information. It will be read more easily on a screen reader.
• Make sure that colour is not the only visual means of conveying information. Text labels and patterns can supplement the use of colour.
• Make sure that there is enough contrast between colours.

See also: Agriculture Victoria brand guidelines | Graphs and charts (Australian Government Style Manual)

Images

Images include photos, diagrams, graphs, illustrations and graphics – any visual element. They provide a visual depiction of the information provided on the page.

Planning and taking images

Images on content pages must have a clear purpose and provide value to the audience. They should not be used solely for decoration. This is because images increase page load times and are difficult to make accessible on smaller devices.

For best-practice advice on taking photos with your phone, see the Agriculture Victoria brand guidelines.

All images published on the website must have permission (copyright) for use prior to submitting the web request. If the image was taken by an Agriculture Victoria staff member, permission is assumed.

Selecting images

Dos

• Images should be high quality, easy to understand and relevant.
• Images should be natural in style, and tell the story of Victorian agriculture.
• If images are used with the ‘shard’ design device, make sure that the image remains easy to understand.
• If images include text, ensure it is readable.
• If there are multiple images on a page, they must be consistent in design and style.
• Ensure images promote farm safety. This includes showing people wearing helmets and other safety gear: HazChem signs, buildings and tractors in good repair. See images for promoting farm safety for more detailed guidance.
• Where relevant, include images to help users identify pests, weeds, and animal or plant diseases. If possible, offer comparisons (for example, of two similar looking pests, or against an object for size).
• Provide images in JPG or PNG format to support fast page load times.

Don’ts

When choosing images, do not use:

• images of places obviously outside of Victoria
• highly posed and stylised stock images
• cartoon-style imagery
• GIFs
• poorly lit, low quality, blurry or pixelated images
• images that include the Agriculture Victoria logo.

Writing captions

• Include alt text for all images. See accessibility requirements for details.
• Include captions for all images that provide users with information. Decorative images (for example, on landing pages) do not require captions.
• Captions should be specific, clear and provide context to users. They do not need to be a full sentence.
• Images do not need a ‘figure’ number if there are only a few images on the page. They should only be used in complex long-form reports with many images. They take the format Figure [X]: [Caption]
• Captions use sentence case, which means that only the first word and proper nouns are capitalised. Don’t use a full stop to end the caption.
• All captions on a page should use the same sentence structure.

Accessibility requirements for images

For images to be accessible, they must include alternative text (alt text). Alt text is a visually hidden description of what appears in an image. Screen readers announce alt text so users can understand what the image is displaying.

Alt text also supports SEO, and helps users to understand what is being shown if the image fails to load.

When creating alt text ensure you do the following:

• Write alt text that provides the same key information as the image. If there is text in the image, write that text in the alt text.
• Be descriptive but concise and specific; you don’t have to mention every detail. Use a maximum of 100 characters.
• Avoid repeating large amounts of information; if a caption already explains the image, you might use very brief alt text.
• Don’t start your alt text with ‘image of…’. Screen readers will tell the user it’s an image so you don’t need to repeat it.
• Images that are purely decorative should use a null alt text tag (alt=“”) rather than including a description of the image.

Always consider contrast when selecting an image, as some people can’t see images with low contrast.

See also: Agriculture Victoria Brand Guidelines (PDF) | Images (Australian Government Style Manual) | Alt text, captions and titles for images (Australian Government Style Manual)

Logos and co-branding

Partner logos may be included on website pages relating to specific initiatives, programs or projects where there is a clear organisational benefit for Agriculture Victoria.

Page owners must check the agreement between Agriculture Victoria and the partner for any requirements for logos (for example, whether the logo needs to appear or how logos are ordered.) Use of co-branding or logos is also subject to approval from the business area, communications and – in some cases – strategic communications. For best practice logos and co-branding:

• use the co-branding component designed for the website
• ensure that minimum size and clear space guidelines are followed for all logos. See the Agriculture Victoria Brand Guidelines.

Accessibility requirements for logos and co-branding

Write the full name of the organisation in the logo alt text.

See also: Agriculture Victoria Brand Guidelines (PDF)

Maps

There are 2 types of maps on the website: interactive maps and static images of maps. Both present challenges and should only be used if there is a clear user and organisational need.

Static maps are challenging to make compliant with website accessibility standards. They can also be difficult to view on smaller digital devices.

Interactive or dynamic maps will be assessed on a case-by-case basis. They need to be embedded by the Online Services Team and therefore require longer publishing times. Depending on the map, they may also require extra budget or engagement with third-party providers. Contact the website team as soon as possible if you plan on publishing an interactive map.

Text

• Label the map with a clear title.
• Include a detailed text description that captures and summarises the information displayed in the map. This text is placed under the map.
• Always give credit to the map provider, such as including the Google logo and any relevant data provider names. Include copyright details and seek permission if the map is not owned by Agriculture Victoria.

Design

• Where possible, use the colour palette and fonts outlined in the Agriculture Victoria Brand Guidelines.
• Always include a north arrow and an indication of scale, such as a scalebar.
• Always include a legend that explains lines, colours and symbols.
• Choose recognisable symbols that align with standard cartographic conventions.
• Add markers to highlight important locations. You can provide extra information through interactive information windows.
• Include intuitive controls like zoom buttons and panning options for user interaction. Enable keyboard navigation for these controls.

Accessibility requirements for maps

Maps capture complex information so it’s important they are accessible:

• Ensure all map labels and text are large enough to be easily read on different screen sizes.
• Coloured text makes it hard for screen readers to distinguish information. Use shapes or text in addition to colour to convey meaning.
• If the map uses colour-coded regions, use appropriate colour combinations for good contrast between map features and background.
• Use shading and cross-hatch patterns instead of colour fills, and simple shapes.
• Use appropriate semantic HTML elements and Accessible Rich Internet Applications attributes to allow screen readers to interpret map information.
• Graphs and charts must include alt text that describes the information in the image; see accessibility requirements: images for details.

See also: Use graphs, charts and maps if they explain complex information (Australian Government Style Manual) | Use of colour (WCAG success criterion 1.4)

PDFs and other documents

All content on agriculture.vic.gov.au is digital-first. This means that all content must be published in HTML by default. This aligns with accessibility best practice and Australian law.

PDFs, Excel and PowerPoint files are difficult to make accessible and there are several reasons why we should avoid them on the website:

• They can be challenging for people using screen readers or other assistive technologies, as they often can’t use tagging to describe headings and other elements. It can also be difficult to navigate complex layouts.
• They lack scalability and often appear distorted on different screens. As about 60% of our users are on mobile devices, this provides a poor website experience.
• Large file sizes can slow download times, particularly for users with limited bandwidth (such as farmers out in the field).
• Navigating documents is cumbersome, with no easy way to link directly to specific sections.
• Search engines can struggle to index PDF content due to poor tagging. This hinders discoverability.
• Maintaining consistency is difficult as PDFs can be easily shared and downloaded. This makes it hard to ensure people are using the most up-to-date information.

If user research clearly shows there is a specific user need for a PDF or another document, it may be included on the website. However, the document must always have an HTML page equivalent. Usually this requires a Word document equivalent if the content is not html. It should only be a secondary source of information that’s already on your website page.

To send document files to the website team, attach them to your website request. If you have more than 5 files in your request, please use a zip file.

File naming and format

• File names should be clear, succinct and specific. Users should understand what they’re clicking through to.
• File names use sentence case; see capitalisation.
• Do not include a version number or date in the file name; this helps to avoid broken links.
• Include the document size and type in parentheses after the file name. Do not separate with an en dash or colon.

Linking to PDFs and other documents

Ensure any links (for example, from another website page) link to the equivalent HTML page, not the PDF or document. This helps to prevent broken links and gives users context about the file.

Help users to understand what they’re clicking through to by providing a succinct explanation of the file on the relevant HTML page.

Accessibility requirements for PDFs and other documents

If there is a clear user need for a PDF or another document format, you must support accessibility by:

• creating an equivalent website page
• marking up the PDF or document with the right tags
• checking that assistive technology reads the document’s content in the correct order
• including the file type (for example, PDF) and file size in the file name and link text.

It is very difficult to make PowerPoint and Excel documents accessible. The Victorian Government accessibility guidelines recommend engaging an external vendor to do this.

See also: Long reports and publications | Portbable Document Format (Australian Government Style Manual) | PDF accessibility review (Adobe)

Videos

Videos provide a visual overview of information or a quick explanation of a specific topic. This format works best when it is short, accessible and there is a need to deliver information quickly.

The website team provides basic video and YouTube support; see video and YouTube for specific services.

Planning videos

• All videos must have a clear purpose and provide value to users.
• The video format should suit the information you want to deliver. Always consider if video is the best way to provide the information or tell the story, or whether there’s a more suitable format.

When planning your content, consider how best to present the information you need to deliver:

• Live action videos: Use live action videos to show real-life environments or situations.
• Animated videos: Use animation to convey complex processes or ideas. They are a great format for evolving timelines and charts, moving text on maps and graphs, and interactive graphics. People can usually understand them with or without audio, which can help to reach people from culturally and linguistically diverse backgrounds.

Planning video channels

All video content embedded on the Agriculture Victoria website is also published on the Agriculture Victoria YouTube channel.

Agriculture Victoria website and YouTube

Any content embedded on an Agriculture Victoria website page must support the page’s purpose and add value.

Website videos should be short and focus on one key topic or message. They should be no more than one to 3 minutes long.

YouTube only

Some YouTube content appears on YouTube only and is not embedded in website pages. This applies to longer video formats or content developed for niche audiences. In these situations, you can include a link to the video from relevant website pages.

The Agriculture Victoria YouTube channel does not host webinar content. The Agriculture Victoria website can provide an overview and a link to the recording.

Creating videos

• Keep videos succinct and focused. To keep your audience’s attention, make sure the video is only as long as it needs to be to convey the critical information.
• All videos should be clearly lit, in focus and professional.
• Make sure people are dressed appropriately, and there are no offensive slogans or distractions in the background.
• If you use stock video, ensure that it is crisp, has natural colours, meets common technical standards and is visibly Australian.
• Any speakers must be introduced using a succinct graphic and text overlay (called ‘lower thirds’) that show a speakers’ name, organisation (if relevant) and role. This is usually added in video editing.

Publishing videos

• Videos should be in MP4 format.
• Each video must include a succinct, clear title (fewer than 70 characters) that explains what the video is about. Aim to include keywords so that search engines can find them.
• Each video should also include a brief description that helps users know what they’ll get out of viewing the content. If the video is part of a series, explain this in the description.
• All videos must be accompanied by a separate transcript file (.doc or .txt). The website team will add the transcript in a dropdown accordion at the base of the video.
• For accessibility purposes, a separate SRT file (plain text file used to store subtitles for video content) must also be provided.
• You must have a signed release form from anyone (filmed and/voices recorded) who appears in the video.
• Any music used in the videos must be licensed.
• Stock video must also be licensed, unless it has a Creative Commons licence.

Accessibility requirements for video

• Always provide a transcript for people who don’t want to watch the video or listen to the audio.
• Create closed captions for people who can’t hear the dialogue and other sounds (symbol [CC]). Don’t rely on auto-captioning as this can be inaccurate.
• Include an audio description for people who can’t see the video; this is a narration that provides important details that are only visual.

When using animation, ensure:

• you meet minimum requirements for colour contrast
• that colour is not the only way to convey meaning.

See alsoi: Video and audio (Australian Government Style Manual) | Requirements and standards for video and audio (Australian Government Style Manual)