Kilka sposobów, aby Twoja witryna była łatwo dostępna
Opublikowany: 2017-02-15Struktura strony i jej zasobów sprawia, że jest ona odpowiednio przyjazna dla komputera, niezależnie od tego, jaki jest ten komputer. Dodaj zdroworozsądkowe techniki, które pozwalają użytkownikom (w tym osobom niepełnosprawnym) i maszynom przejść bezpośrednio do sensownych treści, a na pewno zmierzasz w kierunku łatwego dostępu do witryny i przyjaznej dla wyszukiwarek.
Wszyscy znamy moc WordPressa, która pozwala nowicjuszowi lub osobie nietechnicznej projektować i rozwijać własną usługę internetową. Ta platforma jest prosta w konfiguracji i zapewnia solidne ramy dla motywów i wtyczek, które określą, w jaki sposób Twoje treści i funkcje będą wyglądać dla każdego odwiedzającego.
Jeśli chcesz, aby Twoja witryna była dostępna dla osób niepełnosprawnych, przekonasz się, że podstawowy WordPress ma wiele potrzebnych do ułatwienia rozwoju dostępnej witryny i nie jest trudno posunąć się dalej, dodając wtyczki i dobre technika.
Zanim zaczniemy, należy pamiętać o dwóch ważnych czynnikach. Po pierwsze, samo wdrożenie tych czterech technik nie sprawi, że jakakolwiek strona internetowa będzie w pełni dostępna dla wszystkich w zakresie spełniania wszystkich niezbędnych wymagań, ale usunie najczęstsze bariery w dostępie do sieci i zapewni znacznie większą dostępność.
Po drugie, ważne jest, aby zrozumieć, że dostępność można osiągnąć tylko poprzez współpracę projektowania, rozwoju i najlepszych praktyk tworzenia treści. Projektant może zaprojektować dostępny motyw, programista może dodać dostępną funkcjonalność, ale jeśli autor treści wstawi znaczący obraz bez znacznika alt, pełne znaczenie strony internetowej będzie niedostępne.
Mając to na uwadze, oto cztery wskazówki, dzięki którym Twoja witryna będzie łatwo dostępna.
Tekst alternatywny dla twoich obrazów
Powszechnie wiadomo, że największą przeszkodą w dostępie do sieci jest prawidłowe używanie tekstu alternatywnego do opisywania obrazów na stronie internetowej. Gdyby ten pojedynczy punkt został zaadresowany przez wszystkich, którzy budują strony internetowe, wyeliminowałoby to największą liczbę skarg na dostępność. I to jest powód, dla którego poczuliśmy potrzebę opracowania niesamowitej wtyczki SEO Image Optimizer, która wypełni lukę w brakujących tagach alt na obrazach.
Podstawowym punktem do zrozumienia jest to, że jeśli zamierzasz umieścić obrazy w swojej witrynie, ważne jest, aby odpowiednio je oznaczyć tekstem alternatywnym. Innymi słowy, każdy obraz, który umieszczasz w Internecie, musi mieć znaczenie, aby robot wyświetlał Twój obraz w wyszukiwarkach.
Informacje zawarte w tagu alt umożliwiają użytkownikom czytników ekranu (które czytają na głos strony internetowe użytkownikom z niepełnosprawnością wzroku), przeglądarkom tekstowym i powolnym połączeniom, które nie ładują obrazów, aby zrozumieć informacje przekazywane przez obrazy.
Jeśli obraz nie ma znaczenia, na przykład służy wyłącznie do dekoracji, istnieją dwa sposoby radzenia sobie z nim. Jeśli załadujesz go jako obraz tła za pomocą CSS, czytniki ekranu zignorują go, a obraz nie wymaga znacznika alt (uważaj, ponieważ dotyczy to również znaczących obrazów: jeśli załadujesz go w tle, czytnik ekranu go zignoruje ). Jeśli obraz jest wyświetlany za pomocą HTML, ale jest czysto dekoracyjny, użyj tagu alt, ale pozostaw go pusty. To mówi czytnikowi ekranu, że obraz jest obecny, ale nie ma znaczenia dla użytkownika i może zostać zignorowany, co pozwala uczynić Twoją witrynę bardziej dostępną dla czytelnika
Kiedy umieszczasz etykietę na swoich obrazach, użyj tekstu opisowego, który pozwoli osobom, które nie widzą, zrozumieć, co oznacza obraz. To wymaga osądu: dlaczego obraz tu był i jakie przesłanie niesie oraz jakie słowa najlepiej oddadzą to samo znaczenie. Nie daj się wciągnąć w dosłowne opisy każdego wizualnego szczegółu, przekaż znaczenie.
Klasycznym przykładem jest obraz lupy używany jako przycisk do rozpoczęcia wyszukiwania. Obraz ma znaczenie, dlatego należy go opisać. Opisanie go jako „lupy” nie pomaga użytkownikowi. Muszą wiedzieć, że kliknięcie tego przycisku rozpocznie wyszukiwanie, więc tekst alternatywny „kliknij tutaj, aby wyszukać” lub nawet po prostu „szukaj” może być najbardziej odpowiedni.
Tylko obrazy, które służą określonemu celowi, muszą być oznakowane. Oto przykłady:
Obrazy używane jako przyciski
Obrazy używane jako linki
Obrazy używane do innych elementów sterujących
Obrazy, które bezpośrednio odnoszą się do treści
Ta technika dotyczy oczywiście wszystkich witryn internetowych, nie tylko witryn WordPress. WordPress jednak sprawia, że jest to łatwiejsze niż większość, po pierwsze, umożliwiając autorowi treści przełączanie się między widokami Visual i HTML, a po drugie, zapewniając pole dla tekstu alternatywnego za każdym razem, gdy obraz jest wstawiany za pomocą funkcji Dodaj multimedia.
Wtyczki dla lepszej dostępności
Dostępność WordPressa można zwiększyć za pomocą różnych wtyczek. Wtyczki te są łatwe w konfiguracji i umożliwiają użytkownikom z różnymi niepełnosprawnościami dostęp do witryny. Oto kilka wtyczek, które znalazłem, dzięki którym Twoja witryna będzie łatwo dostępna.
Klucze dostępu
Wtyczka Access Keys umożliwia przypisanie kluczy dostępu do łączy i elementów sterujących w Twojej witrynie. Na przykład do linku domowego można przypisać kombinację klawiszy dostępu alt+h, a przyciskowi wyszukiwania można przypisać kombinację klawiszy alt+s. Klawisze dostępu, takie jak podane w przykładach, umożliwiają użytkownikom niedowidzącym oraz osobom mającym problemy z poruszaniem się łatwy dostęp do tego, czego chcą.

Łatwe przesyłanie dalej
Easy Retweet to wtyczka, która pozwoli Ci dodać do swojej strony dostępne przyciski ułatwiające udostępnianie treści na Twitterze. W ten sposób, jeśli osoby niepełnosprawne chcą udostępniać Twoje strony swoim znajomym, mogą to zrobić bez żadnych trudności.
AStickyPostOrderER
AstickyPostOrderER pozwala wybrać kolejność wyświetlania treści. Możesz wybrać wyświetlanie treści od najstarszej do najnowszej lub w odwrotnej kolejności.
Hackadelic SEO Spis treści
Wtyczka Hackadelic SEO Spis treści umożliwia udostępnienie spisu treści dla Twoich postów lub stron. Dzięki temu Twoje treści będą łatwe do znalezienia.
WP-Sondaże
WP-Polls zezwala osobom niepełnosprawnym na udział we wszelkich ankietach, które możesz mieć w swojej witrynie
Cały czas powstają nowe wtyczki. Skorzystaj z funkcji pulpitu WordPress, aby wyszukać więcej. Wypróbuj różne wtyczki i poproś niepełnosprawnych użytkowników o opinie
Korzystając z jakichkolwiek wtyczek, upewnij się, że używane wtyczki są kompatybilne z wybranym motywem, a także ze sobą. Jeśli twoje wtyczki nie są kompatybilne z twoim motywem, albo nie będą działać, albo spowodują więcej problemów dla niepełnosprawnych użytkowników, którzy próbują przeglądać twoją witrynę. Jeśli Twoje wtyczki nie są ze sobą kompatybilne, Twoja witryna może stać się bezużyteczna lub zawartość może być wyświetlana nieprawidłowo.
Droga do zrobienia z nagłówkami
Podczas projektowania stron ważne jest, aby ustrukturyzować treść za pomocą nagłówków we właściwej kolejności: <h1>
, <h2>
, <h3>
i tak dalej. Kiedy tworzysz strukturę treści za pomocą nagłówków, osoby korzystające z czytników ekranu mogą uzyskać podsumowanie treści stron i łatwiej się po nich poruszać. Użytkownicy czytników ekranu mogą uzyskać dostęp do wybranych sekcji treści, naciskając literę „H”, aby przejść do przodu i „shift+H”, aby przejść do tyłu.
Możesz oznaczyć treść za pomocą nagłówków od jednego do sześciu, aby witryna była łatwo dostępna. Sprawdź, w jaki sposób Twój motyw używa nagłówków (na przykład Twój motyw może, ale nie musi, stosować <h1>
do tytułu witryny, a tytuł witryny może, ale nie musi pojawiać się na każdej stronie. Tak czy inaczej, upewnij się, że pierwszy użyty nagłówek to <h1>
a następujące nagłówki (tytuł strony, podsekcje strony, nagłówki akapitów) schodzą w dół w kolejności do <h6>
, tam gdzie jest to właściwe.
Istnieje pewna dowolność w kolejności, ale najbardziej rozsądną opcją jest utrzymywanie nagłówków w kolejności numerycznej i naprawdę ich nie mieszanie, ponieważ stworzy to niebezpieczną sytuację zarówno dla użytkownika, jak i wyszukiwarki (nie mieszaj ich w ten sposób – > <h1>
, <h4>
, <h2>
, itd.).
Linki nawigacyjne są przydatne
Wreszcie, musisz mieć linki nawigacyjne w projekcie witryny. Te łącza nawigacyjne pozwolą użytkownikom niepełnosprawnym przejść obok paska nawigacyjnego lub innych menu i pól wyszukiwania oraz przeskoczyć do określonych miejsc na stronie, klikając te łącza. Lub użytkownik może szybko przeskoczyć do żądanych sekcji w witrynie. Te linki muszą pojawiać się wszędzie tam, gdzie użytkownicy muszą przejść do sensownej treści. Oto przykłady tego, co mogą powiedzieć te linki:
Przejdź do głównej zawartości
Przejdź do paska nawigacyjnego
Przejdź do wyszukiwania
Niektóre motywy WordPress mogą już zawierać takie linki. W takim przypadku musisz sprawdzić te linki, aby sprawdzić, czy nie musisz dodać własnych. Jednak inne motywy nie będą zawierały linków nawigacyjnych. Dlatego musisz samodzielnie dodać te linki.
Zawijanie
Powtórzę to, co powiedziałem wcześniej, że żaden z tych kroków nie gwarantuje 100% dostępności witryny, ale tak, zwiększy to dostępność witryny dla każdego odwiedzającego ją odwiedzającego, a Twoja witryna będzie bardziej dostępna niż 90% witryn WordPress na rynku .
Osoby niepełnosprawne będą mogły poruszać się po Twojej witrynie, tak jak inni odwiedzający. Ponieważ ci użytkownicy obejmują również roboty wyszukiwania, powinieneś mieć pewność, że udostępnienie witryny przyniesie również korzyści Twojej firmie i pomoże Ci znaleźć się na szczycie w wyszukiwarkach, co ostatecznie przyniesie większe zyski z Twojej firmy.
Mam nadzieję, że ten wpis na blogu był dla Ciebie przydatny i bierzesz z niego kilka kluczowych elementów, które będziesz