Every Wix Studio fix we catalog

Add descriptive alt text to every image on your store so search engines can understand them and all shoppers can access your content.

On Wix Studio

1. In Wix Studio Editor, click any image to select it.
2. Click the 'Settings' icon in the floating toolbar above the image.
3. Locate the 'Alt Text' field in the settings panel and enter your descriptive text.
4. Changes auto-save; repeat for each image on the page.
5. FOR PRODUCT IMAGES: Manage them from the Dashboard > Store > Products panel, same as standard Wix eCommerce.

Shorten your meta description to 150–160 characters so Google displays your full message in search results instead of cutting it off with "…".

On Wix Studio

1. In Wix Studio, open the relevant page in the editor.
2. Click the Pages panel (top-left), hover over the page name, click the three-dot menu, and select 'SEO Basics'.
3. Edit the 'Meta Description' field, keeping it under 160 characters. The live snippet preview updates as you type.
4. For Wix Stores product pages, manage SEO from the Wix dashboard → Wix Stores → Products → select product → SEO panel on the right.
5. Publish the site to apply changes.

Add a single, descriptive H1 heading to every page that currently lacks one, so search engines and shoppers immediately understand what the page is about.

On Wix Studio

1. Open the Wix Studio editor and select the page needing an H1.
2. Click the main heading text element (or add one via the '+' Add panel → Text → Heading 1).
3. With the element selected, open the text style dropdown in the toolbar and choose **'Heading 1'** to ensure it is tagged as `<h1>`.
4. For Wix Stores product pages managed through Studio, the product title widget automatically outputs an H1 — ensure the product name is descriptive under Wix Stores → Products.
5. Publish and verify using browser Dev Tools or a headings inspector extension.

Write a unique meta description of 120–160 characters for every page so Google has compelling snippet text to show in search results.

On Wix Studio

1. In Wix Studio, open the Pages panel → select a page → click 'SEO' in the page settings sidebar → fill in the Meta Description field.
2. For product/collection pages, navigate to the site's eCommerce dashboard and follow the same product/category steps as Wix eCommerce above.
3. Use the bulk SEO CSV tool: Dashboard → Marketing & SEO → SEO Tools → 'Bulk SEO' to export and fill in descriptions for many pages at once.

Add an og:image meta tag to every page so social media platforms and messaging apps display a rich preview image when someone shares your store's link.

On Wix Studio

1. In Wix Studio, open the site editor and select the page in the Pages panel.
2. Click the page settings (gear icon or three-dot menu) → SEO → scroll to the Social Share / Open Graph section → upload or select your 1200×630 px og:image.
3. For dynamic product pages, map the og:image field to the product's main image field via the CMS dataset / dynamic page settings so every product page automatically uses its own image.
4. Set a site-wide fallback in the Wix Studio dashboard under SEO Settings → Default Social Image.

Add an og:title meta tag to every page so your store looks great when shared on Facebook, Pinterest, LinkedIn, and other social platforms.

On Wix Studio

1. In Wix Studio, open the site editor and select the page you want to fix from the Pages & Menus panel.
2. Click the page settings (gear icon) → SEO tab → set the 'Page Title' field. Wix Studio maps this to the og:title tag automatically.
3. For dynamic pages powered by a CMS dataset (e.g. a Products collection), click the dynamic page settings → SEO tab → use the dynamic field connector to bind 'Page Title' to the relevant collection field (e.g. 'Title' or 'Name').
4. For full custom control, use the Wix Studio 'Custom Meta Tags' section (in the SEO tab of page settings) to manually add: property: og:title | content: [your title or dynamic field].
5. Publish the site and validate with the Facebook Sharing Debugger.

Add a unique, descriptive title tag (30–60 characters) to every page that is missing one.

On Wix Studio

1. In Wix Studio, open the Pages panel → hover over the page → click the settings (gear) icon.
2. Select 'SEO' from the panel that appears → edit the 'Page title' field.
3. For store products: access the site Dashboard → Store Products → select the product → SEO section → 'Page title'.
4. Publish the site for changes to go live.

Reduce every page to exactly one H1 tag that clearly describes the page's main topic, removing or converting all extra H1s to lower-level headings (H2, H3, etc.).

On Wix Studio

1. Open Wix Studio Editor and go to the affected page.
2. Use the Layers panel (left sidebar) to expand all layers and visually identify every text element.
3. Click each text element and check the HTML tag in the right-side Properties panel. Change any element incorrectly set to 'H1' to 'H2', 'H3', or 'P'.
4. For repeating sections or dynamic pages (CMS collections), edit the template/collection page to fix the heading tag there — it will propagate to all items.
5. Check the global Header component for any H1 tags around the site name or navigation and downgrade them.
6. Publish and verify using browser DevTools → Elements tab, searching for '<h1'.

Remove or replace the `noindex` directive on any page you want Google to find and rank, then verify the change with Google Search Console.

On Wix Studio

1. In Wix Studio, open the Pages panel → hover over the page → click the three-dot menu → SEO Settings → confirm 'Index this page' is enabled.
2. For Advanced SEO tags: Pages panel → SEO Settings → Advanced → check the 'Additional meta tags' field for any `noindex` robots tag and delete it.
3. Global SEO settings: Dashboard → Marketing & SEO → SEO Settings → review any site-level robot directives.

Add HowTo and BreadcrumbList structured data (JSON-LD) to pages that contain step-by-step instructions so Google can display them as rich results and answer-engine snippets.

On Wix Studio

1. Open the relevant page in Wix Studio editor.
2. Click the '+' (Add Elements) panel › Embed & Social › Custom Embed, and insert an HTML embed element.
3. Paste your <script type='application/ld+json'> block into the embed; publish.
4. Alternatively use the site-wide Custom Code panel (Settings › Custom Code) with page-specific targeting.
5. Validate with Google's Rich Results Test.

Add Organization schema markup to your store's homepage so search engines and AI systems can definitively identify your business, logo, and social profiles.

On Wix Studio

1. In Wix Studio, open your site and navigate to the Homepage.
2. Click the SEO panel or go to Site Settings → SEO → Advanced SEO.
3. Use the 'Structured Data Markup' or 'Additional tags' field to paste your <script type='application/ld+json'>…</script> block.
4. Save and re-publish your site, then validate with Google's Rich Results Test.

Add a `sameAs` array to your Organization structured data, linking to your official social profiles, Wikipedia page, LinkedIn, and other authoritative directories so search engines can confidently identify your brand as a distinct entity.

On Wix Studio

1. In Wix Studio, open the site dashboard → Settings → Custom Code.
2. Add a new custom code snippet in the '<head>' section, paste the Organization JSON-LD (with `sameAs`), set it to 'All pages'.
3. Publish the site and verify with Google's Rich Results Test.

Remove or replace the invalid `role="presentation"` (or other disallowed ARIA role) on HTML elements where that role is not permitted, so assistive technologies can correctly interpret your page.

On Wix Studio

1. In Wix Studio, open the page in the editor and select the flagged element.
2. Check the element's Properties & Events panel for any manually set ARIA role attribute; remove any invalid role.
3. For custom components or HTML embeds, open the component's code view and correct or remove the `role` attribute in the markup.
4. Use the built-in Accessibility Wizard (Add-ons → Accessibility Wizard) as a secondary check after saving.
5. Publish and verify with axe DevTools.

Add a descriptive accessible name to every dialog and alertdialog element using aria-label or aria-labelledby so screen-reader users know what the dialog is about.

On Wix Studio

1. In Wix Studio, enable Dev Mode from the top toolbar.
2. Select the panel, popup, or lightbox component that acts as a dialog.
3. In the Properties & Events panel, check whether an aria-label field is available directly on the component (Wix Studio is expanding native ARIA support — check the latest release notes).
4. If no native field exists, use the page's JavaScript code panel to target the rendered dialog element after it opens and set aria-label or aria-labelledby programmatically, similar to the Velo approach for standard Wix.
5. Test using axe DevTools in your browser while previewing the published or staged site.

Remove `aria-hidden="true"` from any element that contains focusable children (links, buttons, inputs), or remove the focusable elements from inside the hidden container.

On Wix Studio

1. Open Wix Studio and select the page or panel containing the flagged element.
2. For Studio-native components, use the Layers panel to identify the element; click it and check the Properties panel for any custom ARIA attributes set through the Studio UI.
3. For custom-coded components (using the Dev Mode / code editor), open the component's source and locate `aria-hidden`; restructure the markup so no focusable element is a descendant of an `aria-hidden="true"` container.
4. If the issue is in an installed Wix App, contact the app developer, as Studio-installed app markup may not be editable directly.
5. Publish and verify using axe DevTools in the browser.

Ensure every ARIA parent role contains only its required, permitted child roles — and remove focusable elements (e.g. tabindex on img or a) that are not allowed inside that ARIA context.

On Wix Studio

1. Open Wix Studio and select the component (e.g. a custom menu or gallery block) that contains the ARIA violation.
2. If the component is a native Wix Studio widget, the ARIA is system-generated — report the issue to Wix Studio support. For custom components built with Studio's Dev Mode, open the code panel.
3. In the custom component code, correct the role attributes: ensure each child element has the role required by its parent (e.g. children of role="menu" must have role="menuitem").
4. Remove tabindex from img or a elements that are invalid children of the parent ARIA role; add it to the correctly-roled element instead.
5. Publish and verify with axe DevTools.

Wrap every ARIA child role (such as `tab`, `option`, `listitem`, `row`, etc.) in the correct required ARIA parent container role (such as `tablist`, `listbox`, `list`, `rowgroup`, or `grid`) so assistive technologies can correctly interpret the widget's structure.

On Wix Studio

1. In Wix Studio, select the component containing the flagged element on the canvas.
2. If it is a native Wix Studio component, use the Properties & Events panel to check for an ARIA role field; if unavailable, file a support request.
3. For custom-coded sections or HTML embeds, open the code editor and wrap child role elements in a parent element with the required ARIA role (e.g., `<div role="tablist">`).
4. Use the Wix Studio Accessibility Checker (site settings) plus Chrome DevTools Accessibility panel to verify the fix.

Audit every ARIA attribute on your pages and correct any that point to a non-existent element ID, use a disallowed value, or reference an empty/misspelled target so that assistive technologies can correctly interpret your page.

On Wix Studio

1. Open Wix Studio and navigate to the page with the failing element.
2. Select the element on the canvas, then open its Accessibility Settings panel to review and correct any label or description values that map to ARIA attributes.
3. For custom code using Velo, open the Code panel for the page or site, find the relevant $w() call where the ARIA attribute is set, and correct the value.
4. Publish and verify with the axe browser extension.

Add a valid, correctly matched `autocomplete` attribute to every personal-data form field so browsers and assistive technologies can autofill them reliably.

On Wix Studio

1. Open Wix Studio Editor for your site and enable Dev Mode (toggle in the top bar).
2. Select the input element in the canvas or locate it in the Layers panel.
3. In the Properties & Events panel on the right, switch to the Code tab; you can set element attributes programmatically using $w('#inputId').setAttribute('autocomplete', 'given-name') in the page's code file.
4. Alternatively, open the relevant page's code file (Page Code panel at the bottom) and add $w.onReady(function(){ $w('#firstNameInput').setAttribute('autocomplete','given-name'); }); for each field.
5. Preview the page and test autofill in the browser.

Add a visible or programmatically accessible name to every button so screen readers can announce what it does.

On Wix Studio

1. Open your project in Wix Studio. Select the button component on the canvas.
2. In the Properties panel on the right, look for the 'Accessibility' section and enter a descriptive label in the 'ARIA Label' field.
3. If editing a custom-coded section, open the code panel and add aria-label="Descriptive name" directly in the JSX or HTML of the component.
4. Use Velo (the Wix dev environment) for dynamic buttons: e.g. $w('#myButton').setAttribute('aria-label', 'Open cart');
5. Publish and validate with the axe browser extension.

Find every empty heading tag on your store and add meaningful, visible text to it — or remove the tag entirely if it serves no structural purpose.

On Wix Studio

1. In Wix Studio, open the relevant page and open the Layers panel from the left toolbar to see every element, including hidden ones.
2. Identify any Text elements set to Heading style (H1–H6) that contain no text. Click each and either add descriptive text or delete the element.
3. For component/section templates reused across pages, edit the base component and fix the heading there so the fix propagates everywhere it is used.
4. Use the built-in Accessibility Wizard (Site → Accessibility Wizard) to surface and step through remaining issues, then republish.

Fix heading tags so they follow a logical, sequential order (H1 → H2 → H3…) without skipping levels anywhere on the page.

On Wix Studio

1. In Wix Studio Editor, click a text/heading element and open the 'Text Style' dropdown in the Properties panel on the right.
2. Select the appropriate Heading level (H1–H6) that maintains sequential order relative to surrounding headings on the page.
3. Use CSS customization (via the Inspect panel or custom CSS) to adjust visual appearance without changing the semantic heading level.
4. Publish and verify with the axe DevTools browser extension.

Add a valid `lang` attribute to the `<html>` element so browsers and assistive technologies know what language your page is written in.

On Wix Studio

1. In Wix Studio, the `lang` attribute is controlled the same way as in standard Wix — through the site's language settings.
2. Go to the Wix Studio dashboard → Settings → Language & Region and confirm your primary language is correctly set.
3. Wix Studio automatically renders the correct `lang` attribute based on this setting; no template editing is needed.
4. For multi-language projects, ensure each language is properly configured under the Multilingual section so every translated page gets its own correct `lang` value.

Set a valid BCP 47 language code on the `lang` attribute of your page's `<html>` element (e.g., `lang="en"`) so browsers, screen readers, and search engines correctly identify the page language.

On Wix Studio

1. In Wix Studio, the `lang` attribute is controlled by the site's language settings, not directly editable in the canvas.
2. Open your site in Wix Studio → click the Site Settings (gear icon) → Language & Region, and confirm the primary language is set correctly.
3. For multilingual sites, use the Wix Multilingual panel to ensure each language has a valid locale assigned.
4. Publish the site and verify via page source. If the attribute is still invalid, escalate to Wix Studio support.

Remove or empty the alt attribute on images whose caption or surrounding text already describes them, so screen readers don't announce the same information twice.

On Wix Studio

1. In Wix Studio, click the image element on the canvas → open the Properties panel on the right → find 'Alt Text' and clear the field if surrounding text duplicates it.
2. For images inside CMS-connected repeaters or collections: go to the Content Manager → select the relevant collection → find the image field's associated alt-text field and clear redundant entries.
3. Publish the site and re-test with axe DevTools browser extension to confirm the fix.

Ensure your site's banner landmark (<header> or role="banner") sits at the top level of the page, not nested inside another landmark region.

On Wix Studio

1. Open your project in Wix Studio. In the left-hand Pages & Layers panel, locate your Header block at the top of the page structure.
2. Ensure the Header block is at the root level of the page hierarchy — it should not be placed inside a Section, Container, or any other block that carries a landmark role.
3. If header elements are nested inside a Section, select them in the Layers panel and drag them up to the Header block level.
4. Re-publish and verify with the axe DevTools browser extension.

Move your footer element (or any element with role="contentinfo") to the top level of the page so it is not nested inside another landmark region.

On Wix Studio

1. Open Wix Studio editor and open the Layers panel (left sidebar).
2. Locate the Footer section in the layer hierarchy. It should appear at the root level, not indented as a child of any Section or Container.
3. If it is nested, drag it out of the container to the root level in the Layers panel.
4. If you have injected custom HTML via an Embed Code element that includes a `<footer>` or `role="contentinfo"`, click that element, open the code, and restructure so the footer is not wrapped inside another landmark element in your custom markup.
5. Publish and verify with axe DevTools.

Ensure your page has only one banner landmark (a single `<header>` element or `role="banner"`) so assistive technologies can navigate your site correctly.

On Wix Studio

1. Open your project in Wix Studio and open the Layers panel (left sidebar).
2. Identify all elements marked as 'Header' — only ONE should exist site-wide.
3. Click any secondary 'Header' element → open its Settings/Properties panel → change its semantic role or element type to a regular 'Section' or 'Div'.
4. If the duplicate is coming from a custom-coded widget or Velo (JavaScript) component, edit the component's HTML in the Velo code panel: change any <header> tag to <div> and remove role="banner".
5. Publish the site and verify with the axe DevTools browser extension.

Ensure each page contains exactly one `<main>` landmark element (or one element with `role="main"`) so screen-reader users can navigate directly to the page's primary content.

On Wix Studio

1. In Wix Studio, open the page in the Editor. Click on each section/container and check its element settings — avoid assigning 'role="main"' via custom attributes to more than one element.
2. Open the site's custom code panel (Site › Custom Code or the Dev Mode panel) and search for any injected 'role="main"' strings in head or body code snippets.
3. If using Velo (Dev Mode enabled), inspect the page's '$w' element tree in code and ensure no custom HTML component outputs a '<main>' tag when one already exists in the page structure.
4. Test with WAVE or axe DevTools browser extension on the published or preview URL.

Add a single `<main>` landmark element (or `role="main"`) to every page so that screen-reader users and assistive technologies can skip directly to the primary content.

On Wix Studio

1. Open the page in Wix Studio Editor.
2. Click the primary content section (the body area between Header and Footer) to select it.
3. In the right-hand Inspector panel, scroll to 'Advanced' → 'Semantic HTML Tag' and select `<main>` from the dropdown.
4. Optionally set the element's ID to `main-content` for the skip link target.
5. Ensure no other section on the page is also tagged as `<main>`.
6. Publish and verify with the axe DevTools browser extension.

Add a descriptive, screen-reader-accessible label to every link on your store so assistive technologies can announce where each link leads.

On Wix Studio

1. Open your project in Wix Studio and switch to Dev Mode (toggle in the top toolbar).
2. Select the unnamed link element on the canvas; in the Properties & Events panel, add an aria-label property with a descriptive value.
3. For image elements inside links, select the image, open its Settings panel, and fill in the Alt Text field.
4. For custom coded components (using Velo/JavaScript), open the relevant .js or JSX file in the code panel and add aria-label or alt attributes programmatically.
5. Publish and verify with the axe DevTools browser extension.

Remove or raise the `maximum-scale` value in your site's `<meta name="viewport">` tag so mobile users can pinch-to-zoom freely.

On Wix Studio

1. In Wix Studio, open your project and navigate to Site → Settings → Custom Code.
2. Add a custom `<meta name="viewport" content="width=device-width, initial-scale=1.0">` tag in the Head section to override any restrictive default.
3. Publish and verify pinch-to-zoom on a real mobile device.

Add a single, descriptive `<h1>` heading to every page so screen readers and search engines can identify the page's main topic.

On Wix Studio

1. Open Wix Studio and navigate to the page.
2. Select the primary title text element, open its Style panel, and set the text role to **'Heading 1'** (H1) in the typography settings.
3. For dynamic pages (CMS collections), open the dataset-connected text element, confirm its 'Text style' is set to H1 in the Design panel.
4. Publish and verify with browser DevTools.

Add a descriptive, programmatically associated label to every `<select>` dropdown element on the site so assistive technologies can announce its purpose to users.

On Wix Studio

1. Open Wix Studio and navigate to the page with the dropdown. Click the dropdown component.
2. In the right-hand Properties panel, ensure the 'Label' field is populated with descriptive text. Toggle label visibility on if it is currently hidden.
3. For custom widgets or code components, open the Velo code editor and use: $w('#dropdownId').setAttribute('aria-label', 'Descriptive label text here');
4. Publish and verify with the axe DevTools browser extension.

Remove all positive tabindex values (tabindex="1" or higher) from your store's HTML elements, replacing them with tabindex="0" or relying on natural document order to control keyboard focus.

On Wix Studio

1. Open Wix Studio editor and navigate to the page or component with the issue.
2. If the element is inside a Custom Element or HTML Component, click it → 'Edit Code' and remove positive tabindex attributes from the markup.
3. For Velo/Studio code panels, search your page and masterpage code for 'tabindex' and remove any value above 0.
4. If using a Studio block, select the block → 'Edit Block' → inspect the inner HTML widgets for embedded tabindex values.
5. Publish and verify with keyboard-only navigation.

Remove or mask the X-Powered-By HTTP response header to stop advertising your server technology stack to attackers.

On Wix Studio

1. Same as Wix above — Wix Studio sites run on Wix's managed infrastructure. HTTP headers cannot be configured by the site owner.
2. For Wix Studio sites using Velo backend functions that proxy to external services, suppress X-Powered-By at the external service layer.

Add a Content-Security-Policy (CSP) response header to every page so browsers block unauthorized scripts, styles, and resources from loading.

On Wix Studio

1. Same constraints as Wix — Wix Studio does not expose server-level HTTP headers via the editor.
2. Use Cloudflare as a proxy in front of your Wix Studio site and configure the CSP header via Cloudflare Transform Rules (Dashboard → your domain → Rules → Transform Rules → Modify Response Headers).
3. For Velo-enabled projects, use Wix's backend HTTP Functions to set headers programmatically on API responses.

Add a DMARC DNS TXT record at _dmarc.yourdomain.com to protect your domain from email spoofing and phishing.

On Wix Studio

1. In Wix Studio, open the site project and go to the Site Dashboard → Settings → Domains.
2. Follow the same DNS steps as Wix above — either manage the TXT record in Wix's DNS panel (if the domain is Wix-managed) or log in to your external DNS provider.
3. Add a TXT record: Host = '_dmarc', Value = v=DMARC1; p=none; rua=mailto:dmarc@yourdomain.com
4. Ensure any transactional email (Wix automations, contact forms) is authenticated with SPF/DKIM via Wix's email settings before escalating to p=quarantine.

Add a Permissions-Policy HTTP response header to explicitly restrict which browser features (camera, microphone, geolocation, etc.) your store's pages are allowed to use.

On Wix Studio

1. Like standard Wix, Wix Studio does not provide access to server-level HTTP response headers.
2. Proxy your site through Cloudflare and use Transform Rules → Modify Response Headers to add: Name = 'Permissions-Policy', Value = 'camera=(), microphone=(), geolocation=(), payment=(), usb=()'.
3. Verify with Chrome DevTools → Network tab → Response Headers.

Add the `X-Content-Type-Options: nosniff` HTTP response header to every page of your store so browsers never guess at file types.

On Wix Studio

1. Like standard Wix, Wix Studio serves pages with X-Content-Type-Options: nosniff by default — confirm in browser dev-tools.
2. For custom Velo backend/web module code in Wix Studio, add the header to any HTTP function responses: response.headers.set('X-Content-Type-Options', 'nosniff');
3. Reach out to Wix Studio support if you find the header absent on standard page responses.

Renew your SSL/TLS certificate before it expires to keep your store secure, trusted, and visible in search results.

On Wix Studio

1. SSL is automatically managed by Wix Studio — same infrastructure as Wix.
2. Check status in Wix Studio Dashboard → Settings → Domains → confirm each domain shows a valid SSL certificate.
3. Ensure HTTPS redirect is enabled: Settings → SSL/HTTPS → 'Redirect HTTP to HTTPS' toggled on.
4. Verify DNS records are correctly configured if a custom domain SSL is not activating.

Enable auto-renew on your domain registration and set calendar reminders well before expiry to prevent accidental loss of your store's address.

On Wix Studio

1. Same domain management location as Wix: account avatar → Domains for Wix-registered domains.
2. For client sites managed in Wix Studio, check each site's domain settings individually under the site dashboard → Domain.

Add a correct `lang` attribute to your site's `<html>` tag so browsers, search engines, and assistive technologies know what language your store is written in.

On Wix Studio

1. In Wix Studio, the lang attribute is controlled by the site's language settings, same as standard Wix.
2. Go to your site's Dashboard › Settings › Language & Region and confirm your primary language is correctly set.
3. For multilingual sites, use the Wix Multilingual panel to add languages; each version will automatically carry the correct lang attribute.
4. You cannot hand-edit the <html> tag directly; rely on the language settings to output the correct value.

Confirm your store has a correct responsive viewport meta tag so it displays properly on phones and tablets.

On Wix Studio

1. Wix Studio (the successor to Editor X) automatically outputs a correct responsive viewport meta tag — no manual configuration is required.
2. Ensure you are not injecting a conflicting viewport tag via the site's Custom Code panel (Wix Studio Dashboard → Settings → Custom Code).
3. Verify your live site passes Google's Mobile-Friendly Test.