Cross-browser – najczęściej popełniane pomyłki oraz metody ich rozwiązywania.
- Napisane przez
- Wydrukuj
- Skomentuj jako pierwszy!
W świecie web developmentu ważne jest, żeby pamiętać o osobach korzystających z innych przeglądarek. Mogą to być zarówno przeglądarki desktopowe, jak i przeglądarki w urządzeniach mobilnych.
Każdy przecież by chciał otworzyć stronę kasyno internetowe Vulkan bez żadnych problemów.
Niestety, nadal zdarzają się problemy związane z działaniem strony, którą otwieramy w wielu przeglądarkach. W niektórych przypadkach brakuje pewnej części menu. Czasami zdarza się również tak, że strona nie jest do końca responsywna, przez co użytkownik urządzenia mobilnego zmuszony jest do przesuwania palcami w lewo i prawo, aby odnaleźć się w części nawigacyjnej konkretnej strony.
Oczywiście nie sposób zapewnić doskonałe działanie strony na wszystkich przeglądarkach. Oczywistym jest również, że starsze przeglądarki nie będą w stanie zapewnić doskonałego działania strony, która została oparta o najnowsze biblioteki i rozwiązania webowe.
Jest jednak kilka porad, dzięki którym na pewno można pozbyć się przynajmniej części błędów, które mogą pojawić się na jednej stronie, którą odwiedzają użytkownicy wielu przeglądarek.
Pierwszym z tych problemów jest zapominanie o formułce !DOCTYPE html.
Dokładnie tak, ta formułka, która jest wpajana praktycznie w każdej książce zajmującej się tematyką html lub ogólnie web developmentu, czasami nie zostaje wpisana na samym początku naszego kodu. Przez to, niektóre spośród tagów na stronie mogą nie działać. Co za tym idzie, cała treść strony może zacząć się wylewać na lewo i prawo, bo jakiś tag nie będzie interpretowany przez przeglądarkę.
Kolejny problemem jest brak testowania strony internetowej czy aplikacji webowej w prawdziwych warunkach.
Może się wydawać, że nasz kod jest poprawny i testy statyczne przechodzą bez żadnego problemu. Sam problem może pojawić się jednak na samym urządzeniu docelowym. Właśnie na takie potrzeby powstały aplikacje, które zapewniają możliwość emulowania różnych ekranów oraz różnych przeglądarek czy to mobilnych, czy desktopowych. Tester może wtedy bez najmniejszego problemu sprawdzić, na jakim typie urządzeń pojawia się problem, czy też, na jakich przeglądarkach elementy nie są interpretowane we właściwy sposób. Może się okazać, że niektóre starsze przeglądarki nie radzą sobie z jakimiś bibliotekami javascripta, przez co funkcjonalność nie jest dostępna dla użytkownika.
Następną z bolączek związanych z web developmentem jest nieużywanie cross-browserowych bibliotek.
Czasami zdarza się tak, że developer decyduje się na użycie pewnej starszej biblioteki lub frameworka. Z czasem jednak musimy się liczyć z tym, że wszystkie języki ewoluują i zmieniają się, co za tym idzie kod, który kiedyś działał, może okazać się z czasem kompletnie martwym. W przypadku pojedynczych funkcji nie ma problemu, ponieważ wiadomo, że standardy się zmieniają i trzeba się liczyć, że wsparcie dla starszych wersji języka wygasa. Przykładem tutaj może być Python 2.7, który niedługo przechodzi na zasłużoną emeryturę. Nie dzieje się to oczywiście z dnia na dzień, z reguły sami twórcy języka informują o tym, jak to miało miejsce w przypadku Pythona. Trzeba jednak poświęcić czas na przepisywanie poszczególnych funkcji do nowego standardu. Prawdziwy problem pojawia się wówczas kiedy korzystaliśmy z jakiegoś egzotycznego frameworka. Oczywiście problem dotyczy wtedy głównie producenta tego oprogramowania, a nie samego pojedynczego programisty. Może to programistom nawet na rękę, kiedy będą jednymi z nielicznych osób znających się na tej jednej bibliotece. Żeby uniknąć takiego problemu w swojej aplikacji, zalecane jest korzystanie z frameworków, które uchodzą już za standard w tej branży. Mowa tu na przykład o angularze lub ReactJS.
Właśnie z tych wszystkich powodów, testowanie aplikacji czy naszej strony jest niesamowicie ważne. W przypadku web developmentu zawsze należy się upewnić, czy to, co napisaliśmy, jest faktycznie właściwie interpretowane, przez różne zestawy przeglądarek. Nawet jeśli nie mamy możliwości sprawdzenia tego manualnie, możemy posiłkować się stronami do tego przeznaczonymi. Przykład znajdziecie tutaj. Jak sami więc widzimy, strona jest bardzo prosta w obsłudze, wystarczy zaznaczyć przeglądarki, które nas interesują i przystąpić do testowania naszej strony internetowej.
Oczywiście najlepiej jest sprawdzić samemu, jak nasza strona zachowuje się w różnych środowiskach. Nigdy nie mamy pewności, jak działają testy na stronie do automatycznego testowania web aplikacji.
Jeżeli natomiast, nie chcemy instalować dużej ilości przeglądarek wraz z ich starszymi wersjami, możemy spróbować aplikacji dostępnej pod adresem turbo.net/browsers. Strona ta wymaga od nas jedynie instalacji wtyczki do naszej obecnej przeglądarki.
Widzimy więc, że problemy z cross-browsingiem dotyczą głównie złych praktyk. Nawet jeżeli jesteśmy już doświadczonymi web developerami, musimy dostosowywać się do obowiązujących standardów. Każdy programista z pewnością przyzna, że nie ma nic gorszego niż poprawianie kodu po kimś, kto nie stosował się do z góry ustalonych standardów. Dlatego też, kiedy piszecie jakiekolwiek oprogramowanie, pamiętajcie o tym, żeby był on czytelny.
To jest ostatnia rada, która jest doskonałym domknięciem tego tematu. Piszcie swoje aplikacje tak, abyście po powrocie do swojego kodu po załóżmy dwóch latach byli w stanie go odczytać. Pamiętajcie również, że często pisany przez was kod zostanie przez kogoś odziedziczony. Sami pewnie nie chcielibyście zajmować się aplikacją, w której zmienne nazywają się „aaa” lub „azcqwe”.
Nazywajcie zmienne prawidłowo, słuchajcie rad doświadczonych kolegów oraz stosujcie się do zaleceń samych producentów przeglądarek. Nie bójcie się używać wyszukiwarki internetowej, kiedy spotkacie się z trudnym problemem. Lepiej spytać niż zrobić jakąś głupotę. Pozostaje wam życzyć powodzenia i kompatybilności ze wszystkimi przeglądarkami!