milesonerd.github.io/accessibility.html at update-urls · MilesONerd/milesonerd.github.io · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
<!DOCTYPE html>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Accessibility | Enzo Fuke | If it hasn't worked out yet, it's because it's not over yet</title>
    <meta name="description" content="If it hasn't worked out yet, it's because it's not over yet">
    <meta name="author" content="Enzo Fuke">
    <script src="https://cdn.tailwindcss.com/3.4.16"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">

    <meta property="og:url" content="https://milesonerd.github.io/accessibility" />
	<meta property="og:type" content="website" />
	<meta property="og:site_name" content="Enzo Fuke" />
	<meta property="og:title" content="Enzo Fuke | If it hasn't worked out yet, it's because it's not over yet" />
	<meta property="og:description" content="If it hasn't worked out yet, it's because it's not over yet" />
	<meta property="og:image" content="/assets/image/Logo/Phoenix.jpg" />  <meta property="og:image:width" content="1200" />
	<meta property="og:image:height" content="1200" />
	<meta property="og:locale" content="en_US" />

	<meta name="twitter:card" content="summary_large_image" />
	<meta name="twitter:domain" content="milesonerd.netlify.app" />
	<meta name="twitter:url" content="https://milesonerd.github.io/accessibility" />
	<meta name="twitter:title" content="Enzo Fuke | If it hasn't worked out yet, it's because it's not over yet" />
	<meta name="twitter:description" content="If it hasn't worked out yet, it's because it's not over yet" />
	<meta name="twitter:image" content="/assets/image/Logo/Phoenix.jpg" />  <meta name="twitter:image:width" content="1200" />
	<meta name="twitter:image:height" content="1200" />

	<link rel="icon" href="/assets/image/favicon/favicon.ico" type="image/x-icon">

    <link rel="icon" type="image/png" sizes="16x16" href="/assets/image/favicon/favicon-16x16.png">
    <link rel="icon" type="image/png" sizes="32x32" href="/assets/image/favicon/favicon-32x32.png">

    <link rel="icon" type="image/png" sizes="192x192" href="/assets/image/favicon/android-chrome-192x192.png">
    <link rel="icon" type="image/png" sizes="512x512" href="/assets/image/favicon/android-chrome-512x512.png">
    <link rel="apple-touch-icon" sizes="180x180" href="/assets/image/favicon/apple-touch-icon.png">
    <link rel="manifest" href="/assets/image/favicon/site.webmanifest">

    <link rel="stylesheet" href="https://milesonerd.netlify.app/assets/style/styles.css">

</head>
<body class="font-sans antialiased text-gray-100 bg-gray-900">
    <!-- Header/Navbar -->
    <header class="fixed w-full z-50 bg-gray-900 bg-opacity-90 backdrop-blur-sm">
        <div class="container mx-auto px-6 py-4">
            <div class="flex items-center justify-between">
                <div class="flex items-center">
                    <a href="/" class="w-10 h-10 rounded-full bg-blue-500 flex items-center justify-center text-white font-bold text-xl">
                        <img src="/assets/image/Logo/Phoenix.jpg" alt="Enzo Fuke" width="50" height="50" loading="lazy" class="w-full h-full rounded-full object-cover" />
                    </a>
                    <span class="ml-3 text-xl font-bold text-white">Enzo Fuke</span>
                </div>
                <div class="flex items-center space-x-4">
                    <a href="https://milesonerd.netlify.app/" class="px-4 py-2 bg-blue-600 text-white font-medium rounded-lg hover:bg-blue-700 transition shadow-md pulse">New website</a>
                    <button class="md:hidden text-gray-300 focus:outline-none">
                        <i class="fas fa-bars text-2xl"></i>
                    </button>
                </div>
            </div>
        </div>
    </header>

    <!-- Accessibility -->
    <section class="py-16 bg-gray-800 px-6">
        <div class="container mx-auto text-center">
            <h2 class="text-3xl md:text-4xl font-bold text-white mb-6">Accessibility Statement</h2>
            <h2 class="text-3xl md:text-4xl font-bold text-white mb-6">Our Commitment to Accessibility:</h2>
            <p class="text-xl text-blue-300 mb-8">We are committed to making our website accessible to everyone, including individuals with disabilities. We aim to provide a seamless and inclusive browsing experience, ensuring all visitors can access our content and navigate the site effectively.</p>
            <p class="text-xl text-blue-300 mb-8">This website is regularly monitored and maintained to meet the Web Content Accessibility Guidelines (WCAG) 2.1, Level AA. These guidelines help make web content more accessible to people with a variety of abilities and disabilities.</p>
            <h3 class="text-3xl md:text-4xl font-bold text-white mb-6">1. Accessibility Features:</h3>
            <p class="text-xl text-blue-300 mb-8">To enhance accessibility, we have implemented the following features:</p>
            <ul class="list-disc list-inside text-left text-blue-300 mb-8">
                <li>Keyboard Navigation: The site can be navigated using a keyboard for users who cannot use a mouse.</li>
                <li>Screen Reader Compatibility: Our site is compatible with screen readers for visually impaired users.</li>
                <li>Contrast and Readability: Text and background colors are chosen to ensure sufficient contrast for readability.</li>
                <li>Semantic HTML: We use clean and semantic HTML code to improve compatibility with assistive technologies.</li>
                <li>Scalable Text: Users can adjust the text size using browser settings without breaking the layout.</li>
                <li>Responsive Design: The website works seamlessly across different devices and screen sizes, including desktops, tablets, and mobile devices.</li>
            </ul>
            <h3 class="text-3xl md:text-4xl font-bold text-white mb-6">2. Tips for Improving Your Experience:</h3>
            <p class="text-xl text-blue-300 mb-8">Here are a few tips to customize your browsing experience for better accessibility:</p>
            <ul class="list-disc list-inside text-left text-blue-300 mb-8">
                <li>Zooming in on Your Screen:</li>
                    <p class="text-xl text-blue-300 mb-8">- On Windows: Press the Windows key and + to activate the Magnifier.</p>
                    <p class="text-xl text-blue-300 mb-8">- On Mac: Go to System Preferences > Accessibility and enable Zoom.</p>
                    <p class="text-xl text-blue-300 mb-8">- On a web browser: Use Ctrl + (Windows) or Cmd + (Mac) to zoom in and Ctrl - / Cmd - to zoom out.</p>
                <li>Changing Text Colors or Fonts:</li>
                    <p class="text-xl text-blue-300 mb-8">- In Chrome: Go to Preferences > Appearance > Customize Fonts.</p>
                    <p class="text-xl text-blue-300 mb-8">- In Safari: Open Preferences > Advanced, and adjust font sizes and styles.</p>
                    <p class="text-xl text-blue-300 mb-8">- In Firefox: Go to Menu > Preferences > Fonts & Colors.</p>
                <li>Screen Readers:</li>
                    <p class="text-xl text-blue-300 mb-8">- For Windows: We recommend NVDA (free) or JAWS.</p>
                    <p class="text-xl text-blue-300 mb-8">- For Mac: Use VoiceOver, which is built into macOS.</p>
                    <p class="text-xl text-blue-300 mb-8">- For iOS and Android: Use built-in screen readers like VoiceOver (iOS) or TalkBack (Android).</p>
            <h3 class="text-3xl md:text-4xl font-bold text-white mb-6">3. Third-Party Content:</h3>
            <p class="text-xl text-blue-300 mb-8">Our site may contain links to external websites, such as social media platforms (e.g., GitHub, Mastodon). These third-party sites may not be fully accessible, and we are not responsible for their accessibility practices.</p>
            <p class="text-xl text-blue-300 mb-8">For more details, please refer to their respective accessibility policies.</p>
            <h3 class="text-3xl md:text-4xl font-bold text-white mb-6">4. Ongoing Efforts:</h3>
            <p class="text-xl text-blue-300 mb-8">We are continuously working to improve the accessibility of our website. This includes regular testing and reviews to identify and address any issues that may arise.</p>
            <h3 class="text-3xl md:text-4xl font-bold text-white mb-6">5. Updates to This Statement:</h3>
            <p class="text-xl text-blue-300 mb-8">This Accessibility Statement may be updated as we make improvements to ensure inclusivity. Please check this page periodically for the latest updates.</p>
            <h3 class="text-3xl md:text-4xl font-bold text-white mb-6">6. Feedback:</h3>
            <p class="text-xl text-blue-300 mb-8">We welcome your feedback on the accessibility of our website. If you encounter any barriers or have suggestions for improvement, please contact us at <a href="/contact">contact page form.</a></p>
        </div>
    </section>

    <!-- Footer -->
    <footer class="bg-gray-900 pt-16 pb-8 px-6">
        <div class="container mx-auto">
            <div class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-5 gap-8 mb-12">
                <div class="col-span-2">
                    <div class="flex items-center mb-4">
                        <div class="w-10 h-10 rounded-full bg-blue-500 flex items-center justify-center text-white font-bold text-xl"><img src=" /assets/image/Logo/Phoenix.jpg" alt="Enzo Fuke" width="50" height="50" loading="lazy"></div>
                        <span class="ml-3 text-xl font-bold text-white">Enzo Fuke</span>
                    </div>
                    <p class="text-gray-400 mb-4">If it hasn't worked out yet, it's because it's not over yet</p>
                    <div class="social-icons-container">
                        <a href="https://bitbucket.org/milesonerd" class="text-white hover:text-blue-400"><img src="https://cdn.simpleicons.org/bitbucket/ffffff" alt="Bitbucket logo" class="social-icon" loading="lazy"></a>
                        <a href="https://codeberg.org/MilesONerd" class="text-white hover:text-blue-400"><img src="https://cdn.simpleicons.org/codeberg/ffffff" alt="Codeberg logo" class="social-icon" loading="lazy"></a>
                        <a href="https://codepen.io/MilesONerd" class="text-white hover:text-blue-400"><img src="https://cdn.simpleicons.org/codepen/ffffff" alt="CodePen logo" class="social-icon" loading="lazy"></a>
                        <a href="https://gitea.com/MilesONerd" class="text-white hover:text-blue-400"><img src="https://cdn.simpleicons.org/gitea/ffffff" alt="Gitea logo" class="social-icon" loading="lazy"></a>
                        <a href="https://github.com/MilesONerd" class="text-white hover:text-blue-400"><img src="https://cdn.simpleicons.org/github/ffffff" alt="GitHub logo" class="social-icon" loading="lazy"></a>
                        <a href="https://gitlab.com/MilesONerd" class="text-white hover:text-blue-400"><img src="https://cdn.simpleicons.org/gitlab/ffffff" alt="GitLab logo" class="social-icon" loading="lazy"></a>
                        <a href="https://g.dev/MilesONerd" class="text-white hover:text-blue-400"><img src="https://cdn.simpleicons.org/google/ffffff" alt="Google logo" class="social-icon" loading="lazy"></a>
                        <a href="https://gravatar.com/milesonerd" class="text-white hover:text-blue-400"><img src="https://cdn.simpleicons.org/gravatar/ffffff" alt="Gravatar logo" class="social-icon" loading="lazy"></a>
                        <a href="https://huggingface.co/milesonerd" class="text-white hover:text-blue-400"><img src="https://cdn.simpleicons.org/huggingface/ffffff" alt="Hugging Face" class="social-icon" loading="lazy" /></a>
                        <a href="https://instagram.com/milesonerd" class="text-white hover:text-blue-400"><img src="https://cdn.simpleicons.org/instagram/ffffff" alt="Instagram logo" class="social-icon" loading="lazy"></a>
                        <a href="https://kaggle.com/milesonerd" class="text-white hover:text-blue-400"><img src="https://cdn.simpleicons.org/kaggle/ffffff" alt="Kaggle logo" class="social-icon" loading="lazy"></a>
                        <a href="https://openprofile.dev/profile/milesonerd" class="text-white hover:text-blue-400"><img src="https://cdn.simpleicons.org/linuxfoundation/ffffff" alt="Linux Foundation logo" class="social-icon" loading="lazy"></a>
                        <a href="https://fosstodon.org/@MilesONerd" class="text-white hover:text-blue-400"><img src="https://cdn.simpleicons.org/mastodon/ffffff" alt="Mastodon logo" class="social-icon" loading="lazy"></a>
                        <a href="https://www.postman.com/milesonerd" class="text-white hover:text-blue-400"><img src="https://cdn.simpleicons.org/postman/ffffff" alt="Postman logo" class="social-icon" loading="lazy"></a>
                        <a href="https://stackoverflow.com/users/26412577" class="text-white hover:text-blue-400"><img src="https://cdn.simpleicons.org/stackoverflow/ffffff" alt="Stack Overflow logo" class="social-icon" loading="lazy"></a>
                        <a href="https://threads.net/milesonerd" class="text-white hover:text-blue-400"><img src="https://cdn.simpleicons.org/threads/ffffff" alt="Threads logo" class="social-icon" loading="lazy"></a>
                        <a href="https://wakatime.com/@MilesONerd" class="text-white hover:text-blue-400"><img src="https://cdn.simpleicons.org/wakatime/ffffff" alt="WakaTime logo" class="social-icon" loading="lazy"></a>
                    </div>
                </div>
                <div>
                    <h3 class="text-lg font-semibold text-white mb-4">Website</h3>
                    <ul class="space-y-2">
                        <li><a href="https://github.com/MilesONerd/website/" class="text-gray-400 hover:text-blue-400 transition">Repository of new website</a></li>
                        <li><a href="https://github.com/MilesONerd/website/blob/main/LICENSE" class="text-gray-400 hover:text-blue-400 transition"></a>Repository of old website</li>
                        <li><a href="/license/cc-by" class="text-gray-400 hover:text-blue-400 transition">Content - License</a></li>
                    </ul>
                </div>
                <div>
                    <h3 class="text-lg font-semibold text-white mb-4">Resources</h3>
                    <ul class="space-y-2">
                        <li><a href="https://github.com/MilesONerd/neurenix" class="text-gray-400 hover:text-blue-400 transition">Neurenix</a></li>
                        <li><a href="https://github.com/MilesONerd/closure-next" class="text-gray-400 hover:text-blue-400 transition">Closure Next</a></li>
                    </ul>
                </div>
                <div id="contact">
                    <h3 class="text-lg font-semibold text-white mb-4">Contact</h3>
                    <ul class="space-y-2">
                        <li class="text-gray-400"><i class="fas fa-envelope mr-2"></i> <a href="https://milesonerd.netlify.app/contact" class="text-gray-400 hover:text-blue-400 transition"> Contact Page</a></li>
                        <li class="text-gray-400"><i class="fas fa-map-marker-alt mr-2"></i> Internet</li>
                    </ul>
                </div>
            </div>
            <div class="pt-8 border-t border-gray-800 flex flex-col md:flex-row justify-between items-center">
                <p class="text-gray-500 text-sm mb-4 md:mb-0">Copyright © 2025 Enzo Fuke. All Rights Reserved.</p>
                <p class="text-gray-500 text-sm mb-4 md:mb-0">This website is not affiliated with any of the companies mentioned. All product names, logos and brands are the property of their respective owners.</p>
                <div class="flex space-x-6">
                    <a href="/terms/service" class="text-gray-500 hover:text-gray-400 text-sm">Terms of Service</a>
                    <a href="/policies/privacy" class="text-gray-500 hover:text-gray-400 text-sm">Privacy</a>
                    <a href="/policies/cookies" class="text-gray-500 hover:text-gray-400 text-sm">Cookies</a>
                    <a href="/accessibility" class="text-gray-500 hover:text-gray-400 text-sm">Accessibility</a>
                </div>
            </div>
        </div>
    </footer>

    <script src="/assets/scripts/functions.js"></script>
</body>
</html>