Website: https://deniz-estate.com/ru/
Problems:
Hreflang:
For each language version of the website, it is necessary to specify the current ones in the <Head> tag:
<link rel="alternate" hreflang="ru" href="https://deniz-estate.com/ru/" />
<link rel="alternate" hreflang="uk" href="https://deniz-estate.comua/" />
<link rel="alternate" hreflang="pl" href="https://deniz-estate.com/pl/" />
<link rel="alternate" hreflang="en" href="https://deniz-estate.com/en/" />
WebP Image Support Module:
It is necessary for the module to automatically convert images to WebP format
Additional actions required:
Verify that WebP images are actually delivered to browsers
Enable and test Lazy Load
If a plugin (e.g., WP Rocket, native lazy load, Gum) is used, ensure that:
Check sizes and responsiveness
Check caching
Run Lighthouse test
Run the page through Google Lighthouse (in DevTools)
Ensure there are no warnings regarding images (size, format, lazy load, etc.)
Result:
Images load quickly without breaking the layout
No duplicates or excess weight
WebP works
Lighthouse image metrics show no errors
Ensure that all buttons on the site:
Are properly marked (<button> or <a>)
Work with keyboard
Are accessible for screen readers
Meet WCAG 2.1 and Lighthouse recommendations
1. Semantics
Use only native tags:
<button> — for actions (submit, close, open, etc.)
<a href="..."> — for page navigation
Prohibit using <div> or <span> as buttons (unless role="button" + tabindex + handling Enter/Space — but better to replace with <button>)
2. Button type
3. Keyboard accessibility
Buttons should activate with keys:
4. aria-attributes and descriptions
Ensure accessibility of all form elements
Goal: Improve accessibility for users with special needs and comply with WCAG standards.
Check and correct the behavior of the country selection field (phone input)
Actions to take:
The element .iti__selected-flag should not be focusable by itself unless it manages input.
Remove tabindex="0" and role="combobox" from elements that are not active controls.
Ensure that keyboard navigation (Tab) moves strictly between interactive elements (input, select, button).
Check for the presence and correct markup of the submit button
Actions to take:
Improve ARIA attributes
Actions to take:
Leave aria-label or aria-labelledby if no label exists, but it is preferable to use <label> as the main means.
If there is field validation, add aria-describedby="message-id" and aria-invalid="true" on error.
Test focus and navigation
Test manually:
Tab key should move sequentially through:
the "Name" field;
the "Email" field;
the phone field;
the submit button.
Enter/Space keys should activate submission and clickable elements.
There should be no "jumps" or focus on decorative blocks.
Reduce delays when connecting to third-party services
Identify all third-party scripts being loaded (e.g., analytics, fonts, widgets).
Implement lazy loading for non-essential scripts.
Use async or defer when including third-party JS resources where possible.
Optimize the order of third-party services so they do not block critical page rendering.
Ensure sufficient contrast between background and text color
Use contrast checking tools (e.g., WebAIM Contrast Checker).
Verify that the contrast between text and background meets WCAG minimum requirements:
AA level: at least 4.5:1 for normal text, 3:1 for large text.
AAA level (recommended): 7:1 for normal text.
Ensure correct semantic structure of <li>
Goal: Maintain proper HTML structure and improve content perception by assistive technologies.
Actions to take:
All <li> tags should only be used inside lists <ul>, <ol>, or <menu>.
Exclude cases such as:
<li> outside a parent list;
<div><li>...</li></div> without nesting inside <ul> or <ol>.
Replace incorrect <li> with <div>, <p>, or other semantically appropriate tags if needed.
Ensure list structures are logical and properly nested (nested lists display and style correctly).
Fix incorrect ARIA role assignments
Goal: Ensure proper operation with assistive technologies (screen readers, VoiceOver, etc.).
Actions to take:
Exclude cases such as:
Assigning role="button" to <button> — this is redundant;
role="link" on <a> with href — also redundant;
Using deprecated roles or non-existent values.
Use only valid values from the official WAI-ARIA specification.
Verify that all ARIA roles are logical in context, for example:
role="navigation" — for menu blocks;
role="dialog" — for modal windows;
role="alert" — for error and warning notifications.
Correctly fill in the href attribute for links
Goal: Ensure proper navigation and link behavior on the site.
Actions to take:
All <a> tags must have a filled href attribute. Avoid:
href="";
href="#" — only if used with JavaScript, and then with preventDefault() (in popup forms).
For external resources — absolute URLs with https:// protocol and rel="nofollow noopener noreferrer".
If the link opens in a new tab (target="_blank"), be sure to add:
Additional:
After implementing all points, conduct an audit:
- Lighthouse (in Chrome DevTools, "Audit" or "Check" tab);
- axe DevTools — for in-depth accessibility testing.
It is recommended to record test results with screenshots before and after changes.
