What we find

This is an overview of what types of problems Squidler can find.

Functional Problems

Broken images

Broken images are much like broken links — pointing to resources that don't exist or that can't be shown. In many cases this results in an ugly frame with a small icon inside.

Broken links

Perhaps the most commonly experienced problem on the web, and something you and your users surely have seen more than enough of.

Squidler finds links to missing or broken pages, both by identifying status codes and network errors, but also by looking at the content of the target pages, as many single-page applications and other dynamic rendering techniques don't respond with proper status codes.

Image of Squidler on a laptop
warning
bug_report
report

Dead ends

Pages with no internal links, i.e. links followed during Squidler tests, are considered dead ends. Pages that don't show any such links within a few seconds trigger this problem.

Incorrect restoration of scroll position

When navigating from one page to another, and then navigating back, some pages fail to restore the scroll position to where the user started. Especially on long pages with lots of scrolls, like product listings or social media websites, this can be very confusing and frustrating for users.

This problem also applies to forward navigating of the browser history.

Images displayed with incorrect proportions

A common issue in responsive layouts, is that images get squeezed out of proportion. This can also happen if you explicitly set incorrect dimensions that don't match the actual image dimensions.

Slightly horizontally scrollable pages

When some elements that are too wide cause the layout to overflow, there's unindented horizontal scrolling. This often happens at certain viewport widths or specific dynamic content, like long words.

When there's a relatively small horizontal scrollability, Squidler considers it a problem.

Broken pages

Broken pages are those where the server responded with a status code indicating a bad request or server error. Squidler can also identify pages without such status codes, but where the content indicates a broken page.

Blank pages

Blank pages, those without any visible text or media within a particular viewport, are considered problems. This is because they indicate a problem with the page, such as a missing resource, JavaScript errors, bad responsive layout, or other rendering issues.

Missing titles

Pages with missing titles negatively affect the user experience and SEO.

Code visible in content

With many programming languages, frameworks, and frontend rendering technologies, there's a risk that code snippets or other technical artifacts end up visible on the page. This can be a security risk, or just look bad or be confusing. Some common examples include:

  • undefined and null
  • NaN and Infinity
  • [object Object]
  • $\math\markup$
  • {"json": "literals"}
  • {{templates}}

If you intend to render code, make sure to wrap it in <code> tags to avoid false positives.

Accessibility

Image of Squidler on a laptop
hearing
blind
accessibility_new

Accessibility problems

Squidler uses Axe-core to test against Web Content Accessibility Guidelines (WCAG 2.0, 2.1), Section 508 of the Rehabilitation Act, and other international standards of web accessibility.

Read more about the Axe-core rules on the ACT Rules website.

Color Contrast Issues

Insufficient contrast between text and background colors. Problems with graphical elements that lack adequate contrast for visibility.

HTML Structure and Semantics

Missing or improper use of elements. Incorrect heading hierarchy. Missing < title > or descriptions that aid screen readers.

ARIA Misuse

  • Incorrect use of ARIA roles, properties, or states (e.g., aria-hidden="true" on focusable elements).
  • Redundant ARIA attributes when native HTML elements already provide the functionality.

Forms and Input Accessibility

  • Missing or improperly associated <label> elements for input fields.
  • Unclear error messages or lack of error messages that can help developers find the problem
  • Missing aria-required or invalid attributes on form elements.

Keyboard Navigation

  • Elements that are not focusable using the keyboard (e.g., links or buttons without proper attributes).
  • Inconsistent focus order, making navigation difficult.

Interactive Elements

  • Missing or incorrect attributes on buttons, links, and other interactive components.
  • Issues with modals, dropdowns, and accordions not being accessible to screen readers or keyboard users.

Image and Media Accessibility

  • Missing or empty alt attributes on images.
  • Inadequate or missing captions for videos.
  • Missing attributes like role="presentation" for purely decorative images.

Dynamic Content

  • Missing live region roles (aria-live) for dynamic updates that need to be announced to screen readers.
  • Improper focus management when new elements like modals appear.

Accessibility API Compatibility

  • Elements that don’t expose the correct information to accessibility APIs, affecting assistive technologies.

Miscellaneous Issues

  • Duplicate id attributes in the DOM.
  • Missing <html lang> attributes to indicate the page language.
  • Missing or incorrect landmarks for navigation.

Language

Image of Squidler on a laptop
language
translate
subtitles

Spelling, grammar, and style

Squidler uses LanguageTool to extract and check for language-related problems. Multilingual pages are supported, and our HTML-aware extract eliminates a lot of false positives.