Overview
This comprehensive guide will walk you through integrating the Accesstive accessibility platform with your Adobe Dreamweaver website. Accesstive helps make your site more inclusive and compliant with accessibility standards through AI-powered tools and monitoring.
What is Accesstive?
Accesstive is an all-in-one accessibility platform that helps websites become inclusive, compliant, and user-friendly. It combines powerful tools like an accessibility assistant widget, AI-based live audits, monitoring, and an intelligent assistant. Designed for businesses, developers, and agencies, Accesstive makes accessibility simple, scalable, and smart.
Key Features
- Access Assistant: Screen-reader and keyboard navigation adjustments
- 40+ Accessibility Features: Font resize, colour contrast, text magnifier, and more
- Access Monitor: Regular scans and analyses
- WCAG Compliance: Addresses common accessibility barriers
- Custom Branding: Fully customizable to match your site design
- Access AI Audit: Real-time scanning with one-click AI fixes
- Access Accy: AI-powered accessibility chatbot
Installation Method
Custom Code Integration
This is the simplest way to integrate Accesstive into your Dreamweaver-built site and works with any static HTML, PHP, or template-based project.
Step-by-Step Instructions:
- Open Your Project in Dreamweaver
Launch Adobe Dreamweaver and open the site or page you want to edit. - Switch to Code View
In the top toolbar, select Code or Split View so you can edit the HTML directly. - Locate the Closing </body> Tag
Scroll to the bottom of your HTML file and find the closing </body> tag. - Add the Script Snippet
Paste the following code snippet right before the </body> tag:
<script async src="https://cdn.accesstive.com/assistance.js" type="module"></script>- Save Your File
Use File → Save (or Ctrl+S / Cmd+S) to save your changes. - Preview Your Site
Use Dreamweaver’s Live View or your browser to verify the widget appears. - Upload to Your Web Server
Publish your updated files using Dreamweaver’s FTP or your preferred hosting method.
Pro Tip
The script loads asynchronously, ensuring it won’t impact your site’s loading speed or performance.
Accesstive Configuration
Once installed, you can configure your Accesstive settings through the Accesstive dashboard:
- Widget Customisation: Match your brand colours and styling
- Feature Selection: Choose which accessibility features to display
- Positioning: Set widget placement and behaviour
- Analytics: Monitor usage and accessibility improvements
Preview and Testing
After installation, you should see the Accesstive widget appear on your website. Here’s how to test it:
- Widget Visibility: Look for the accessibility icon (usually in the bottom corner)
- Feature Testing: Click the widget and try different accessibility options
- Cross-Browser Testing: Verify functionality across different browsers
- Mobile Testing: Check widget responsiveness on mobile devices
Troubleshooting Common Issues
Widget Not Appearing
- Verify the script is placed before the closing </body> tag
- Ensure you saved and uploaded the updated file to your hosting server
- Clear your browser cache and reload the page
Script Loading Issues
- Check the browser console for JavaScript errors
- Confirm the script URL is correct and accessible
- Ensure no other scripts are conflicting
Performance Considerations
Accesstive is designed to be lightweight and performant:
Metric | Impact | Details |
| Load Time | Minimal | Async loading prevents blocking |
| File Size | ~45KB | Compressed and optimised |
| Performance Score | < 1% impact | Based on Google PageSpeed |
Get Started Today
Ready to make your Dreamweaver-built website more accessible? Sign up for Accesstive today and start a free trial for creating a more inclusive web experience for all your visitors.