Krytyka projektowania stron internetowych # 27: Idea Arts
Co tydzień przyglądamy się nowej stronie internetowej i analizujemy projekt. Wskażemy oba obszary, które są dobrze wykonane, oprócz tych, które mogą wymagać trochę pracy. Na koniec zakończymy prośbą o przekazanie własnej opinii.
Dzisiejsza strona to Idea Arts.
Przeglądaj zasoby projektowe
Jeśli chcesz zgłosić swoją stronę internetową, która będzie prezentowana w przyszłej krytyce projektowania, zajmuje to tylko kilka minut. Za krytykę Twojego projektu pobieramy 24 USD - znacznie mniej niż zapłacisz za konsultanta, który zajrzy na Twoją stronę! Tutaj dowiesz sie więcej.
O Idea Arts
Idea Arts to osobiste portfolio Goran Ilic, grafik z pasją do technologii. Jego strona prezentuje najnowsze prace i usługi oferowane przez jego firmę.
Oto zrzut ekranu strony głównej:
Pierwsze wrażenie
Idea Arts jest w większości atrakcyjnym miejscem. Pracuje tu kilka dobrych pomysłów, które naprawdę odkładają projekt na dobre. Treść podzielona jest na jasno zdefiniowane sekcje i postępuje logicznie. Istnieje również kilka atrakcyjnych elementów graficznych, które skutecznie przyciągają uwagę użytkownika.
Istnieje jednak wiele możliwości udoskonalenia. Konstrukcja jest na tyle solidna, że nie polecam zaczynać od nowa, ale kilka aspektów mogłoby poświęcić nieco więcej uwagi, aby doprowadzić je do normy. Poniżej przyjrzymy się niektórym z nich.
Typografia
Największym problemem, jaki widzę na tej stronie, jest typografia. Na początek, na samej stronie głównej widzimy około dziesięciu różnych odmian wielkości, szerokości, stylu itp. Jest to prawie zawsze cecha negatywna. Dobrą zasadą jest utrzymywanie krojów pisma na poziomie od dwóch do trzech odmian na projekt.
Zdecyduj się na kroje, których możesz używać w nagłówkach, pod nagłówkach i treści. Następnie spraw, aby były spójne w całym projekcie, a nie traktować każdą sekcję jako niezależny obszar, który może mieć swoje własne unikalne cechy.
Poświęć też trochę czasu na tworzenie tego typu, aby wyglądać atrakcyjnie. Wymaga to ostrożnego planowania opcji, takich jak wysokość linii, kolor, a nawet podział linii. Wszystkie są dość szorstkie w poniższym przykładzie.
Na początek jasnoniebieski kolor nie kontrastuje dobrze z tłem. Można to łatwo naprawić, przyciemniając ten kolor, aż naprawdę oddzieli się od koloru światła za nim. Również mniejszy egzemplarz przydałby się nieco więcej miejsca do oddychania. Wysokość linii jest po prostu zbyt niska i utrudnia czytanie, podnieś to trochę tutaj, a czytelność znacznie wzrośnie.
Uważaj jednak, ponieważ w innych obszarach witryny wysokość linii wydaje się niezręcznie wysoka. Polecam skorzystanie z bezpłatnego narzędzia online, takiego jak Typograf - Skala i rytm (pokazane poniżej), aby pomóc w przepływie akapitów.
Wreszcie, zobacz, jak łamią się linie. Co ciekawe, nie tylko musisz uważać na niezręczne przerwy w sformułowaniach, powinieneś również zwrócić uwagę na kształt akapitu. Powyższy wygląda nieco dziwnie i można go łatwo przywrócić do czegoś takiego jak wersja poniżej.
Biała przestrzeń
Innym obszarem projektu, w którym można by wprowadzić poprawki, jest użycie białych znaków. Podobnie jak w przypadku typografii, może to być trudne i jest w dużej mierze subiektywne. Istnieją jednak pewne podstawowe zasady, które mogą poprowadzić Cię po drodze.
Na przykład za każdym razem, gdy masz rozproszoną kolekcję przedmiotów, pionową lub poziomą, spróbuj najpierw pogrupować obiekty wizualnie, a następnie rozmieścić je równomiernie. Na przykład w poniższym przykładzie oryginalna wersja ma odmienne odstępy między ikonami a tekstem, a elementy, które powinny być różne, nieco się ze sobą spotykają. Przy odrobinie dostosowania, tworzymy znacznie wyraźniejsze zestawienie graficzne.
Różnica jest subtelna, ale bardzo ważna. Zauważ, jak łatwo jest stwierdzić, który wiersz tekstu pasuje do której ikony. W całym projekcie istnieje kilka innych obszarów, w których można zastosować podobną dawkę analizy przestrzennej. Na przykład poniższy tekst prawie się zawiesza na końcu urządzenia przechowującego. Zawsze pamiętaj, aby dać dużo miejsca takim elementom.
Jak widzieliśmy w poprzednich numerach, dzieje się to w obie strony. Na przykład logo ma wrażenie, że ma zbyt wiele białych znaków wbudowanych w odstęp między słowami.
Tweak, Tweak, Tweak
Morał tej historii jest taki, że nawet jeśli zdecydujesz, że stworzyłeś świetnie wyglądającą stronę, diabeł tkwi w szczegółach. Nigdy nie spiesz się z drobiazgami, takimi jak typografia i odstępy. W rzeczywistości być może będziesz musiał poświęcić więcej czasu na ich poprawienie, niż na wypracowanie początkowej koncepcji wizualnej!
Zdecydowanie warto zainwestować czas, aby dobrze wykończyć witrynę. Konsekwentne stosowanie tego nawyku sprawi, że twoje projekty będą znacznie bardziej wyrafinowane i da im większą odporność na kontrolę.
Twoja kolej!
Teraz, gdy przeczytałeś moje komentarze, dołącz i pomóż, udzielając projektantowi dalszych rad. Daj nam znać, co Twoim zdaniem jest świetne w tym projekcie i co Twoim zdaniem może być mocniejsze. Jak zawsze prosimy, abyście szanowali również projektanta strony i oferowali jasne konstruktywne porady, pozbawione jakichkolwiek ostrych zniewag.
