Krytyka projektowania stron internetowych # 11: Scott Block
Co tydzień przyglądamy się nowej stronie internetowej i analizujemy projekt. Wskażemy zarówno obszary, które są dobrze wykonane, jak i te, które mogą wymagać trochę pracy. Na koniec zakończymy prośbą o przekazanie własnej opinii.
Dzisiejsza strona to osobiste portfolio Scott Block, projektanta stron internetowych z Maryland.
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 Scott
„Mieszkam w Columbia Maryland, w niewielkiej odległości od Baltimore i stolicy kraju. Kiedy miałem dwanaście lat, połączyłem swoją pasję do kruków Baltimore z rosnącym zainteresowaniem technologią i zacząłem tworzyć strony o Krukach. Od tego czasu starannie doskonaliłem swoje umiejętności i teraz tworzę strony internetowe dla różnych osób i organizacji. Jestem teraz biegły w łączeniu html z css, javascript, php i ajax, aby tworzyć piękne, funkcjonalne strony internetowe. ”
Oto strona główna witryny:
Chociaż jest tu z pewnością pewien potencjał, na tej stronie jest wiele rzeczy, które naprawiłbym. Spójrzmy na nich jeden po drugim.
Schemat kolorów
Kolory zastosowane na stronie Scotta tworzą dość ładną paletę, gdy są rozłożone indywidualnie, jak pokazano poniżej.
Jednak nie szalę na punkcie rozmieszczenia kolorów. Wydaje się, że są wdrażane losowo w miejscach na stronie po prostu ze względu na zmienność, zamiast być stosowane celowo i logicznie. Pomyśl o każdym wyborze koloru i tym, jak wiąże się on z resztą treści na stronie.
Logo
Jego pozycja w lewym górnym rogu strony sprawia, że to logo jest pierwszą rzeczą, którą użytkownicy widzą podczas wizyty na scenie. Chcesz skorzystać z okazji, aby zrobić dobre pierwsze wrażenie. Niestety, wydaje mi się, że to logo jest krótkie.
Widzę, jak kształty bloków są przetwarzane na litery, prawdopodobnie w celu powiązania z nazwiskiem projektanta, ale to po prostu nie działa. SB ma dość słabą czytelność i wydaje się nieco przestarzały.
Nawigacja i nagłówek jako całość
Obszar nawigacji jest dość prosty, tylko tekst z poziomymi przekładkami i podkreśleniem wskazującym bieżącą stronę. Jestem za prostą nawigacją, więc myślę, że ten obszar jest dobrze zrobiony.
Po najechaniu myszką na link w nawigacji pojawia się ikona pod logo Scott Block. Jest to fajny efekt, którego nigdy nie widziałem, aby był wykonywany w ten sposób (z efektem najechania tak daleko od linku).
Gdy spojrzysz na obszar nagłówka jako całości, istnieje kilka znaczących problemów, które mogą pomóc w adresowaniu. Jak powiedziałem powyżej, efekt najechania ikoną jest zgrabny, ale powoduje pewne problemy. Kiedy nie przesuwasz kursora nad linkiem w nawigacji, obok kopii nagłówka znajduje się duże puste miejsce, które powoduje, że zastanawiasz się, dlaczego nie jest on wyrównany z niczym.
Możliwym sposobem na to jest zastosowanie ikony do stanu domyślnego, który zmienia się na inną ikonę po najechaniu kursorem na łącze i powraca do oryginalnej ikony po zakończeniu najechania kursorem. Niestety, gdy występuje efekt najechania ikoną, logo i ikona tworzą niewygodny pionowy stos.
Ogólnie rzecz biorąc, negatywna przestrzeń w tym obszarze mogłaby wymagać całkowitej restrukturyzacji. Oprócz problemu z brakującą ikoną, główne logo zajmuje po prostu zbyt dużo miejsca w pionie i tworzy dziwne luki.
Wyróżniony obszar
Lubię powtarzanie w projekcie i widzę, jak kąty w tej sekcji odzwierciedlają logo, ale ponieważ tak naprawdę nie działa w logo, to samo dotyczy tutaj. Nachylony charakter nagłówków wydaje się nieco dziwny, podobnie jak krzyżujący się wzór utworzony przez kolory tutaj.
Podświadomie twój mózg chce połączyć dwa przedmioty tego samego koloru, ale tutaj te dwa obszary nie są powiązane.
Ponadto istnieje wiele efektów aktywowania na tym obszarze, które nie mają żadnego celu. Po najechaniu kursorem na sekcję tworzony jest cień. Sieć nauczyła nas rozpoznawać taką aktywność jako wskazówkę, że najeżdżamy myszką na obszar, który można kliknąć. Jednak obszary te nie są klikalne, co powoduje, że czują się tak, jakby tworzyły zamieszanie dla użytkownika.
Stopka
Stopka jest dość prosta, ale znów widzimy, że przydałoby się sporo udoskonalenia.
Przede wszystkim przycisk znajduje się w niezręcznym miejscu. Projektując, zawsze należy uważać, aby nie wkładać rzeczy do otworów tylko dlatego, że masz miejsce. Tekst jest silnie wyrównany do lewej strony, ale następnie zniszczony przez umieszczenie przycisku.
Ponadto animacja najechania przyciskiem jest nieco za duża. Używa się tu ikonki obrazu, a pomiędzy dwoma stanami przycisków jest animacja, w której można zobaczyć, jak jedna część obrazu wysuwa się, gdy inne się wsuwają. Nie jest łatwo powiedzieć, co się dzieje na początku, dlatego jest to trochę niepokojące.
Ogólne zalecenia
Powyżej przedstawiłem kilka ostrych krytyków i uważam, że najlepiej byłoby spróbować to wszystko połączyć. Oto moje sugestie:
Na początek przeprojektuj logo na coś bardziej nowoczesnego i poziomego. Następnie ustal twarde wyrównanie do lewej strony na całej stronie. Wyrównaj obszar nawigacji i blok kopiowania pod nim z lewej strony strony i być może przenieś nowe logo w prawo.
Zmieniaj rozmiar tekstu na stronie, aby tworzyć wyraźne nagłówki i kopie pomocnicze. Wszystko jest obecnie bardzo duże. Pamiętaj: kiedy czynisz wszystko wyjątkowym, nic nie jest wyjątkowe.
Wyrzuć aktualne kształty z wyróżnionej sekcji i gigantycznej listy wypunktowanej (włącz swoje usługi gdzie indziej). Utwórz pojedynczy duży wyróżniony podgląd projektu, który rozciąga się na cały obszar zawartości.
Na koniec przerób stopkę, aby honorować lewe wyrównanie powyżej. Innymi słowy, wyciągnij ten przycisk z prawego rogu.
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.
Chcesz mieć krytykę swojej witryny? Tutaj dowiesz sie więcej.
