Błędy, które najprawdopodobniej popełniłeś już jako projektant stron internetowych

Wszyscy projektanci stron internetowych chcą perfekcji. Są to jednak tylko ludzie i zawsze mogą się pojawić błędy. Tak łatwo jest po prostu przeoczyć niektóre szczegóły. Nie ma na świecie projektanta, który by nie popełniał błędów, a unikanie ich to coś, co zwykle zdarza się po pewnym czasie.

Porozmawiamy teraz o niektórych z najczęstszych błędów, które projektanci stron internetowych popełniają na bieżąco, tych, które najprawdopodobniej popełniłeś już przynajmniej raz. Popraw swoje złe nawyki i pokonaj przeszkody, których obecnie jesteś winien, aby Twoja praca była lepsza niż kiedykolwiek.

Korzystanie z Flasha

W nowoczesnych projektach stron internetowych rzadko używamy Flasha, nawet jeśli jest on niesamowity w tym, co potrafi. Mamy do czynienia z możliwością zapewnienia odwiedzającemu animowanego doświadczenia, które jest imponujące, ale wiąże się z nim bagaż.

Istnieją różne problemy, które pojawiają się podczas używania Flasha w projektowaniu stron internetowych. Masz dłuższy czas ładowania, problemy z użytkownikami mobilnymi z powodu braku wsparcia i innego używanego języka programowania. Liczba urządzeń obsługujących obecnie Flash jest bardzo niska. Również w przyszłości nie spodziewamy się zwiększonego wsparcia. Zupełnie nowe biblioteki wydają się mocniejsze i bardziej popularne, zwłaszcza te oparte na JavaScript, takie jak AngularJS i jQuary.

Używanie naprawdę dużych obrazów

Współczesny trend w projektowaniu stron internetowych polega na używaniu dużych obrazów w całej witrynie. To z pewnością sprawi, że doświadczenie będzie przyjemniejsze, a użytkownik będzie miał coś wspaniałego do obejrzenia, ale istnieją pewne komplikacje, o których projektant i programista muszą być świadomi.

Wczytywanie strony jest automatycznie zwiększane za każdym razem, gdy używane są większe obrazy. Może to prowadzić do bardzo złego scenariusza dla odwiedzającego witrynę. Dobrą wiadomością jest to, że mamy dostęp do różnych narzędzi, które bardzo pomagają w optymalizacji obrazów. Te, które możesz rozważyć, obejmują:

• GruntJS-ImageMin
• ImageOptim

Aplikacje takie jak PrePros mogą pomóc w automatycznej optymalizacji obrazów w aplikacjach. Problem polega na tym, że narzędzia pomogą w przepływach pracy, ale nie rozwiążą ogromnego problemu związanego z czasem ładowania, przynajmniej nie do końca.

Wielu projektantów używa teraz SVG. Używają kodów do animacji i rysowania grafiki w środowisku przeglądarki. Kończymy w ten sposób przyspieszonym ładowaniem strony i różnymi elementami, które przyciągają wzrok.

Powinniśmy również podkreślić fakt, że większe obrazy skomplikują projektowanie stron internetowych ze względu na brak responsywności. Mówimy o elemencie projektu, który ma ustaloną wysokość i szerokość. Przeglądarki skalują obrazy, ale mamy ten sam rozmiar pliku.

W3C pracuje teraz nad wykorzystaniem „ <picture> ” jako elementu HTML5. Umożliwiłoby to wywoływanie obrazów o różnych rozmiarach w zależności od szerokości ekranu oglądania. Gdy tak się stanie, wrażenia będą o wiele lepsze dla widza, ale do czasu wdrożenia należy unikać większych obrazów.

Korzystanie ze stałej szerokości i wysokości

Adaptacja jest automatycznie ograniczana dla użytkowników, gdy kodowane są stałe rozmiary. Mamy obejścia, ale zawsze musimy myśleć o stworzeniu wzorca projektowania stron internetowych, który będzie w 100% responsywny. Stała wysokość ustawiona w CSS może ograniczyć widoczny obszar dla użytkownika. Przejście do tego jest możliwe dzięki dostosowaniu zapytań o media, ale dodany dodatkowy kod będzie prowadzić do problemów z wydajnością. Tak naprawdę nie potrzebujesz tego. W większości przypadków nie powinieneś używać stałych rozmiarów. Należy ich unikać w jak największym stopniu w nowoczesnym środowisku projektowania stron internetowych.

Przyjmowanie założeń dotyczących dopasowania projektu

Projektanci stron internetowych zwykle pracują z oprogramowaniem takim jak Adobe Photoshop lub Sketch. Po zakończeniu pracy powszechnym założeniem jest posiadanie określonego punktu przerwania w responsywnym przepływie pracy. Szerokości ekranu, które są postrzegane jako standardowe, obejmują wiele różnych rozmiarów ekranu, ale pokrycie ich wszystkich nie jest pewne. Posiadamy tysiące urządzeń mobilnych dostępnych na rynku. Stworzenie projektu, który sprawdziłby się we wszystkim, jest bardzo trudne.

Kiedy pracujesz nad określonymi szerokościami, musisz planować, a myślenie naprzód staje się ważną umiejętnością projektanta stron internetowych. Musisz mieć pewność, że założenia nie są wykonane i że faktycznie będziesz pracować w przeglądarce po zakończeniu normalnej pracy edytora graficznego.

Używanie zbyt wielu efektów i animacji

Możesz zobaczyć ten problem nawet na niektórych najpopularniejszych witrynach na świecie. Tak wiele stron internetowych oferuje zapierające dech w piersiach wrażenia, a wiele z nich oferuje coś naprawdę wyjątkowego i niesamowitego. Nie oznacza to jednak dodawania tylu efektów i animacji, ile możesz. Bardzo ważne jest, aby połączyć zasady projektowania stron internetowych w celu znalezienia odpowiedniego połączenia funkcjonalności i wpływu graficznego.

Z przesadzeniem z animacjami i efektami wiążą się dwa duże problemy:

• Wydłużono czas ładowania strony
• Efekty i animacja będą problematyczne na starszych komputerach

Popularne obecnie hacki i animacje to te, które dodają elementy zanikania, zwiększania lub zmniejszania. Mogą wyglądać świetnie i sprawią, że witryny będą wyglądać świetnie, ale to nie znaczy, że zawsze powinieneś z nich korzystać. Sprawdź, czy ogólne wczytywanie strony nie byłoby zbyt duże dla urządzeń, z których będzie korzystać większość odwiedzających, i nigdy nie zapomnij o szybkości ładowania strony. Są to bardzo ważne i zawsze muszą oferować wspaniałe wrażenia dla odwiedzających.

Nieprawidłowa stylizacja linków

Jest to błąd, który jest znacznie bardziej powszechny niż to, co w tej chwili myślisz. Linki muszą zawsze robić to, co robią. Oznacza to, że jeśli link ma niewłaściwy styl, ludzie nie zorientują się, że są to linki. Musimy zawsze myśleć o odwiedzających, więc linki muszą zawsze wyglądać jak linki. Możesz eksperymentować i nie trzymać się standardowego niebieskiego podkreślenia, ale nigdy nie przesadzaj.

Nie używam DRY w CSS

Jeśli nie jesteś tego świadomy, DRY oznacza „Nie powtarzaj się”. Jest to metoda w projektowaniu stron internetowych i praktycznie oznacza, że ​​projektantowi pomaga się zachować zwięzły i sklonowany kod. Do stylizacji strony internetowej przez cały czas zalecane jest używanie tylko niezbędnego kodu.

Podczas korzystania z tradycyjnego CSS konieczne jest wiele powtórzeń z określonymi elementami, które są używane wewnątrz innych elementów. Selektory stają się naprawdę duże, a ich napisanie zajmie dużo czasu. Kiedy używasz klas w projektowaniu zamiast stylizować każdy element na stronie HTML, wszystko staje się znacznie prostsze.

W tej chwili bardzo dobrym pomysłem jest wykorzystanie języków przetwarzania wstępnego, takich jak Sass. Są bardzo przydatne pod względem niezbędnej technologii CSS. Używane języki przyspieszą rozwój i projektowanie, ponieważ zawierają funkcje takie jak zmienne, funkcje, domieszki, zagnieżdżenia i wiele innych. Wytworzony kod zostanie następnie skompilowany do kodu CSS. Twórcy stron internetowych i projektanci stron internetowych mogą teraz używać mniej linii kodu, a powtórzenia można łatwo uniknąć dzięki językom.

Wdzięczna degradacja

Możemy zdefiniować Graceful Degradation jako praktykę tworzenia funkcji internetowych, które mogą oferować określony poziom doświadczenia użytkownika w nowoczesnej przeglądarce, jednocześnie obniżając się do niższych poziomów doświadczenia użytkownika w starszych przeglądarkach. Brzmi to trochę skomplikowanie, ale jako przykład możemy omówić obsługę przeglądarki Internet Explorer 8 i 7. Zdziwiłbyś się, gdybyś dowiedział się, że większość użytkowników po prostu nie aktualizuje przeglądarek przez długi czas. Z tego powodu należy dodać wdzięczną degradację, aby zapewnić odpowiednią obsługę obu wersji przeglądarki.

Nowoczesne strony internetowe są łatwe w tworzeniu, ale w późniejszym czasie można zauważyć, że w starszej przeglądarce strony wyglądają naprawdę źle ze względu na specyficzne zależności.

Progresywne ulepszanie

Jest to coś podobnego do wspomnianej wyżej Graceful Degradation. Różnica polega na tym, że proces jest obsługiwany w odwrotnej kolejności, zaczynając od podstawowego poziomu doświadczenia, który jest obsługiwany przez każdą przeglądarkę internetową. Następnie projektant/programista dodaje zwiększoną funkcjonalność dostępną dla przeglądarek, które mogą z niej korzystać.

Zarówno ta opcja, jak i powyższa są skomplikowane. Zwykle używają ich tylko naprawdę dobrzy projektanci. Jednak przy wielu dostępnych obecnie przeglądarkach musimy poważnie rozważyć opcje. Projektanci stron internetowych zwykle mają klientów, którzy decydują dokładnie, co będzie wspierane. Musisz jednak spróbować zastosować te podejścia, aby zaoferować naprawdę wspaniałe wrażenia dla użytkowników, którzy są szczególnie aktywni i znajdują się bezpośrednio w grupie docelowej.

Problemy z nawigacją – nieprzyjazne dla użytkownika

Jedną z najważniejszych części każdej strony internetowej jest nawigacja. Projektant musi umieć sprawić, by odwiedzający doznał naturalnego doświadczenia. Celem jest sprawienie, aby nawigacja była naprawdę prosta i intuicyjna. Użytkownik automatycznie zrozumie, że doświadczenie jest właściwe, gdy projekt uwzględni ten element.

Za każdym razem, gdy wrażenia użytkownika są słabe, widzimy, że odwiedzający są sfrustrowani. Po prostu nie odwiedzają ponownie określonej witryny i będą szukać na innych stronach rozwiązań swoich problemów. Użyteczność musi być zawsze brana pod uwagę przez projektanta. Design musi świetnie wyglądać, ale nigdy nie należy zapominać o funkcjonalności. Łatwość obsługi jest potrzebna, a jej brak spowodowałby, że cały projekt byłby bezużyteczny.

Brak koncentracji na treści

„Forma podąża za funkcją” to bardzo powszechna zasada architektury, która pojawiła się w XX wieku, właśnie w fazie projektowania przemysłowego nowoczesnej architektury. Jest to zasada, o której zawsze musisz pamiętać podczas projektowania stron internetowych.

Projektowanie stron internetowych i graficznych jest bardzo podobne do nowoczesnej architektury pod względem niezbędnej funkcjonalności. Forma przedmiotu musi najpierw być oparta na zamierzonym celu lub funkcji. Jeśli chodzi o strony internetowe, możemy je postrzegać jako informacyjne bazy danych, które są rozsiane po całym internecie. Użytkownik odwiedzi stronę internetową w celu uzyskania określonych danych. W tym miejscu wkracza zawartość, aby zaoferować te dane. Gdy odwiedzający trafi na stronę i nie znajdzie danych, będzie szukał ich gdzie indziej, nawet nie patrząc na projekt. Jednocześnie w przypadku, gdy projekt naprawdę utrudnia zlokalizowanie lub przetrawienie danych, dzieje się to samo.

Internauci chcą teraz dostępu do informacji i chcą, aby dostęp ten był szybki. Form Over Functions staje się bardzo ważne w projektowaniu stron internetowych. Nieuwzględnienie tej zasady oznacza, że ​​kładzie się nacisk na wygląd, a nie na oferowaną treść. W rezultacie strony internetowe nie będą zbyt popularne. Treść musi się wyróżniać przez cały czas.

Wnioski

U ich korzeni najczęstsze błędy w projektowaniu stron internetowych polegały na próbie wymyślenia czegoś naprawdę pięknego i wyjątkowego bez uwzględnienia powodu, dla którego użytkownicy faktycznie odwiedzają witrynę. Z tego powodu zawsze chcesz mieć niezbędną cierpliwość, aby połączyć naprawdę dobry projekt z pełną funkcjonalnością.

Zawsze twórz strony internetowe, które są funkcjonalne i z biegiem czasu uczą się nowych technologii. Najlepsi projektanci stron internetowych na świecie wciąż się uczą i zawsze są na bieżąco ze wszystkim, co można, a czego nie można zrobić. Chcesz stworzyć swój projekt strony internetowej, porozmawiać z klientem, a następnie upewnić się, że odwiedzający docenią to, co jest oferowane. O wiele łatwiej to powiedzieć niż zrobić, ale z czasem wszystko staje się o wiele łatwiejsze.

Upewnij się, że zawsze poświęcasz tyle czasu, ile potrzebujesz, aby stworzyć coś naprawdę wspaniałego. Innym niewymienionym błędem w projektowaniu stron internetowych jest brak czasu potrzebnego na stworzenie idealnego projektu strony internetowej. Zwykle dzieje się tak, ponieważ klienci potrzebują pracy do wykonania w jak najkrótszym czasie. Upewnij się, że zawsze masz wystarczająco dużo czasu na stworzenie wspaniałego projektu internetowego, o którym wiesz, że potrafisz.