Wszystkie najlepsze projekty stron internetowych typu portfolio robią te same, dobre rzeczy. Stawiają pracę na pierwszym miejscu, zachowują prosty układ i ułatwiają znalezienie i skontaktowanie się z osobą.
Poniżej znajduje się 40 prawdziwych witryn portfolio, pogrupowanych według dziedzin, z jednym pomysłem projektowym, który sprawia, że każda z nich działa, i jednym elementem, który możesz skopiować na własną stronę.
Co sprawia, że projekt witryny portfolio działa
Dobrze zaprojektowana strona internetowa portfolio sprawia, że Twoje prace są czytelne i łatwe do wykorzystania. Na wszystkich 40 poniższych stronach wciąż pojawiają się te same proste pomysły:
- Zacznij od pracy. Najlepsze strony najpierw prezentują swoje najmocniejsze strony, a nie długie wstępy.
- Keep it simple. Przejrzysty układ z otwartą przestrzenią jest przyjemniejszy dla oka niż układ zatłoczony.
- Wybierz jeden jasny cel. Każda strona kieruje odwiedzającego do kolejnego kroku, np. nawiązania kontaktu.
- Ułatw sobie poruszanie się. Krótkie i przejrzyste menu pomaga użytkownikom znaleźć to, czego szukają.
- Szybko się ładuje i działa na telefonach. Większość osób korzysta z telefonu, dlatego szybkość i mobilna konstrukcja mają znaczenie.
Jeśli Twoja witryna spełnia te pięć warunków, to już wyprzedza większość.
Jak wybrać projekt witryny portfolio dla swojej branży
Twoja branża powinna kierować Twoimi wyborami projektowymi. Nie każde portfolio musi mieć taki sam wygląd, więc dopasuj projekt do rodzaju wykonywanej pracy.
- Fotografowie, artyści i ilustratorzy: Postaw na duże, wysokiej jakości obrazy. Wykorzystaj dużo wolnej przestrzeni i pozwól, aby praca wypełniła cały ekran.
- Projektanci i twórcy filmów i wideo: możesz użyć pogrubionych układów, animacji lub wideo, aby zaprezentować swój styl i umiejętności.
- Pisarze, konsultanci i właściciele firm: Postaw na mniej wizualizacji, a więcej na zaufanie. Zacznij od jasnego przekazu, przyjaznego zdjęcia i łatwego sposobu nawiązania kontaktu.
- Modele, muzycy i artyści: wybierz kilka przyciągających wzrok zdjęć lub klipów, które podkreślą Twoją obecność, a resztę strony postaraj się, aby była prosta.
Zanim skopiujesz projekt, który Ci się podoba, zadaj sobie jedno pytanie: czy pomaga on ludziom dostrzec moją twórczość? Układ idealny dla fotografa może być złym wyborem dla pisarza.
Fotografia
1. Annette Monheim: Fotoreportaż
Annette jest fotoreporterką, która opowiada historie za pomocą zdjęć.
Co działa: Jej zdjęcia są ułożone w schludnej siatce, a każde z nich otwiera inną historię. Dużo wolnej przestrzeni sprawia, że strona jest przejrzysta, więc to zdjęcia mówią same za siebie.
Spróbuj tego: Jeśli masz dużo obrazów, umieść je w siatce i podłącz każdy do osobnej strony.
Podsumowanie: Siatka zdjęć pozwala na łatwe przeglądanie dużego zbioru obrazów.
2. Sean Micah: Moda i fotografia uliczna
Sean zajmuje się fotografią modową, portretową i uliczną.
Co działa: Jego projekty, dane kontaktowe i linki społecznościowe znajdują się w jednej, stałej kolumnie po lewej stronie. Podczas przewijania zdjęć kolumna pozostaje na swoim miejscu, dzięki czemu zawsze wiesz, gdzie jesteś.
Spróbuj tego: Zachowaj menu i dane kontaktowe na stałym pasku bocznym, aby nigdy nie zniknęły.
Podsumowanie: stały pasek boczny sprawia, że nawigacja jest cały czas widoczna dla użytkownika.
3. Amanda Trigg: Fotografia ślubna
Amanda jest fotografką ślubną.
Co działa: Całostronicowa prezentacja zdjęć ślubnych wyświetla się od razu po wejściu. Wypełnia ekran i wprowadza ciepły, romantyczny nastrój, zanim jeszcze przeczytasz choć jedno słowo.
Spróbuj tego: Otwórz pełnoekranowy pokaz slajdów ze swoimi najlepszymi ujęciami, aby od razu wprowadzić nastrój.
Podsumowanie: Odwiedzających wita pokaz slajdów wyświetlany na pełnym ekranie, który od razu wprowadza w nastrój.
4. Szlak pocztówek: Fotografia podróżnicza
Szlak Pocztówek prezentuje zdjęcia podróżnicze z całego świata.
Co działa: Każde zdjęcie emanuje tym samym ciepłym, nostalgicznym klimatem pocztówki. Ten jeden motyw spaja całą galerię, sprawiając, że wygląda jak kolekcja, a nie przypadkowy stos.
Spróbuj tego: Wybierz jeden nastrój lub motyw i użyj go na każdym zdjęciu na swojej stronie.
Podsumowanie: Pojedynczy motyw wizualny sprawia, że galeria sprawia wrażenie jednej kolekcji.
5. Shabana Khan: Fotografia kulinarna
Shabana jest fotografem kulinarnym.
Co działa: Jej zdjęcia i krótkie klipy są umieszczone w przejrzystej siatce. Po najechaniu kursorem na jeden z nich, kolor lekko się zmienia. To drobny szczegół, ale sprawia, że strona nabiera życia.
Spróbuj tego: Dodaj delikatny kolor lub zmianę powiększenia po najechaniu kursorem, aby nadać swojej galerii interaktywny charakter.
Podsumowanie: Drobne efekty po najechaniu kursorem myszy ożywiają stronę, nie czyniąc jej zbyt ładną.
6. Adam Gallagher: Fotografia dronowa
Adam robi zdjęcia z powietrza za pomocą drona.
Co działa: Tekst menu jest mały i cichy, umieszczony na górze, z dala od reszty. Ta powściągliwość skupia całą uwagę na szerokich, otwartych ujęciach lotniczych.
Spróbuj tego: Tekst menu powinien być mały i stonowany, aby Twoje zdjęcia były główną atrakcją.
Podsumowanie: Spokojna, stonowana nawigacja pozwala na wyeksponowanie dużych zdjęć.
7. Wizualizacje wybrzeża: Fotografia lotnicza
Laurette robi zdjęcia linii brzegowej z powietrza.
Co działa: Jej ikony społecznościowe znajdują się w górnym menu, więc możesz ją obserwować jednym kliknięciem. Menu jest puste, dzięki czemu wszystko jest łatwe do odczytania.
Spróbuj tego: Umieść ikony mediów społecznościowych w górnym menu, aby odwiedzający mogli Cię obserwować jednym kliknięciem.
Podsumowanie: Łatwo dostępne linki społecznościowe pomagają odwiedzającym pozostać w kontakcie.
Sztuka
8. Izalord: Artysta
Iza jest artystką dzielącą się swoją twórczością w sieci.
Co działa: Jej logo znajduje się w samym centrum strony i od razu rzuca się w oczy. Układ wokół niego jest prosty i otwarty, więc nic z nim nie konkuruje.
Spróbuj tego: Umieść swoje logo lub nazwę w centralnym punkcie swojej strony głównej.
Podsumowanie: Logo umieszczone centralnie tworzy wyraźny punkt centralny na pierwszej stronie.
9. Dans l'Oeil de Flo: Artist
Flo jest artystką o jasnym i żywym stylu.
Co działa: Wyraziste obrazy rozmieszczono w układzie dwukolumnowym. Te same czcionki i kolory powtarzają się w każdej części strony, dzięki czemu nawet zatłoczona, kolorowa witryna nadal wydaje się przemyślana.
Spróbuj tego: Używaj tych samych dwóch czcionek na całej stronie. Dzięki temu będzie sprawiać wrażenie zaplanowanej, a nie poskładanej.
Podsumowanie: powtarzanie tych samych czcionek i kolorów sprawia, że strona wydaje się dopracowana.
10. Eva Alonso: Artystka
Ewa jest artystką, która maluje i rysuje.
Co działa: Zamiast zwykłych linków tekstowych, jej duże szkice ołówkiem pełnią funkcję menu. Klikasz rysunek, aby przejść do obrazów, rysunków lub wystaw. Sztuka jest nawigacją.
Spróbuj tego: Zmień własne dzieła sztuki na klikalne linki menu zamiast zwykłego tekstu.
Podsumowanie: Możesz przekształcić swoją grafikę w element nawigacyjny witryny.
11. Michael Doering: Malarz
Michael jest malarzem.
Co działa: Jeden z jego najmocniejszych obrazów wypełnia górną część strony. Ten pojedynczy obraz nadaje kolorystykę i charakter całej stronie, zanim ją przewiniesz.
Spróbuj tego: Zacznij od jednego ze swoich najlepszych dzieł, aby odwiedzający od razu zrozumieli Twój styl.
Podsumowanie: Jeden mocny element może reprezentować cały Twój styl.
12. Susan Boughton: Artystka współczesna
Susan jest malarką mieszkającą w Londynie.
Co działa: Strona dzieli się na dwie części. Jej imię i krótka biografia znajdują się po jednej stronie, a zdjęcie jej studia po drugiej. Dowiadujesz się, kim jest i jednocześnie poznajesz jej świat.
Spróbuj tego: Podziel ekran główny na dwie części: krótką notkę biograficzną po jednej stronie i ciekawe zdjęcie po drugiej.
Podsumowanie: rozdzielony układ pozwala zachować równowagę między tym, kim jesteś, a tym, co tworzysz.
13. Tanja van Wijk: Artystka
Tanja jest artystką, która prezentuje swoje obrazy w Internecie.
Co działa: Wokół każdego obrazu jest dużo pustej przestrzeni. Ta przestrzeń sprawia, że każdy obraz wydaje się ważny, niczym dzieło sztuki zawieszone na ścianie galerii.
Spróbuj tego: Pozostaw wokół każdego obrazu odpowiednią ilość miejsca, aby każdy element sprawiał wrażenie osobliwego akcentu.
Podsumowanie: Pozostawienie każdej pracy wolnej przestrzeni sprawia, że staje się ona bardziej wartościowa.
Ilustracja
14. Imaginelle: Ilustrator
Imaginelle to ilustratorka o ciepłym, wesołym stylu.
Co działa: Przyjemne czcionki i ciepłe kolory wywołują uśmiech na twarzy, zanim cokolwiek przeczytasz. Zmiana języka jednym kliknięciem sprawia, że strona jest przyjazna dla użytkowników z różnych krajów.
Spróbuj tego: Niech kolory i czcionki pokażą Twoją osobowość już w chwili, gdy ktoś Cię odwiedzi.
Podsumowanie: Wybór kolorów i czcionek może w kilka sekund wyrazić Twoją osobowość.
15. Foodxillust: Ilustracja jedzenia
Foodxillust łączy jedzenie i ilustrację.
Co działa: Duże, ostre i kolorowe obrazy stanowią całość projektu. Na stronie nie ma nic więcej, ponieważ obrazy są wystarczająco wyraziste, by same w sobie udźwignąć całość.
Spróbuj tego: Jeśli Twoje obrazy są wyraziste, niech wypełnią całą stronę, a reszta ogranicz się do minimum.
Podsumowanie: Wyraziste, kolorowe obrazy same w sobie mogą być siłą napędową kreatywnej strony.
16. Ego Rodriguez: Ilustrator
Ego to ilustrator o odważnym, kolorowym stylu.
Co działa: Strona główna otwiera się jego najbardziej uderzającym dziełem. Po pierwsze, najodważniejsze dzieło od razu pokazuje odwiedzającym, jaki jest jego styl.
Spróbuj tego: Zacznij od najodważniejszego elementu, a nie od tego najbezpieczniejszego.
Podsumowanie: Kiedy zaczynasz od najodważniejszych prac, szybko ujawniasz swój styl.
17. Rachel O'Mahony: Ilustratorka książek dla dzieci
Rachel tworzy ilustracje do książek dla dzieci.
Co działa: Jej imię jest napisane odręcznym stylem, który pasuje do jej żartobliwych rysunków. Imię i rysunek sprawiają wrażenie, jakby wyszły spod tej samej ręki.
Spróbuj tego: Dopasuj nazwę lub logo do charakteru swojej pracy.
Podsumowanie: Logo, które pasuje do Twojego stylu graficznego, sprawia, że marka staje się kompletna.
18. Beth Reidmiller: Portrecistka
Beth maluje portrety zwierząt domowych i ludzi.
Co działa: Jej prace dzielą się na trzy wyraźne grupy: Zwierzęta, Ludzie i Obrazy. Odwiedzający, który chce zobaczyć portrety zwierząt, znajdzie je od razu, bez konieczności przewijania pozostałych.
Spróbuj tego: Posegreguj swoją pracę na kilka wyraźnie nazwanych grup, aby czytelnicy mogli szybko znaleźć to, czego potrzebują.
Podsumowanie: Przejrzyste kategorie pomagają odwiedzającym znaleźć dokładnie to, czego szukają.
Projektowanie graficzne, UI/UX i cyfrowe
19. Janae Cobos: Projektowanie graficzne i ilustracje
Janae jest graficzką i ilustratorką.
Co działa: Jej menu zawiera tylko dwie pozycje: Strona główna i Portfolio. Ponieważ nie ma prawie nic do kliknięcia, każdy odwiedzający stronę ogląda jej prace.
Spróbuj tego: Ogranicz menu do dwóch, trzech stron, które naprawdę mają znaczenie.
Podsumowanie: Bardzo krótkie menu kieruje odwiedzających bezpośrednio do Twojej pracy.
20. FrnkHwk: Projektowanie marki i ruchu
FrnkHwk jest projektantem marek i animacji.
Co działa: Ciemne, niemal czarne tło kryje się za jasną, kolorową grafiką 3D. Ciemność sprawia, że kolory świecą, niczym reflektor w ciemnym pomieszczeniu.
Spróbuj tego: Umieść kolorowe prace na ciemnym tle, aby kolory się wyróżniały.
Podsumowanie: Ciemne tło sprawia, że kolorowe prace wyglądają jaśniej i bardziej wyraziście.
21. Thosin: Projektowanie graficzne i typografia
Thosin jest grafikiem, który uwielbia liternictwo i czcionki.
Co działa: Jedno duże, błyszczące czerwone logo znajduje się pośrodku spokojnej, szarej strony. Ten pojedynczy obiekt przyciąga wzrok do środka i tam go zatrzymuje.
Spróbuj tego: Zbuduj swoją stronę główną wokół jednego, wyrazistego, wyśrodkowanego obiektu, a resztę zostaw w ukryciu.
Podsumowanie: Jeden wyraźny obiekt na środku może udźwignąć całą stronę.
22. Brianna Hillier: Produkcja kreatywna
Brianna zajmuje się produkcją kreatywną i projektami marki.
Co działa: Pojedyncze zdjęcie na pełnym ekranie wypełnia stronę i natychmiast wprowadza w nastrój. Krótki, przyjazny nagłówek znajduje się na górze, dzięki czemu od razu poczujesz klimat i przesłanie.
Spróbuj tego: Jako głównego zdjęcia użyj pełnowymiarowego zdjęcia i zamieść nad nim krótki nagłówek.
Podsumowanie: Jedno zdjęcie na pełnym ekranie może nadać witrynie odpowiedni nastrój.
23. PandaTech Studios: Studio projektowania gier
PandaTech tworzy grafikę i zasoby do gier wideo.
Co działa: Film wyświetla się na ekranie zaraz po wejściu na ekran. Ruch wywołuje ten sam dreszczyk emocji, co uruchamianie gry, co pasuje do studia zajmującego się grami.
Spróbuj tego: Jeśli ruch pasuje do Twojej pracy, użyj krótkiego filmu odtwarzanego automatycznie jako bohatera.
Podsumowanie: Wideo w tle może sprawić, że strona internetowa stanie się ekscytująca i żywa.
Architektura, wnętrza i projektowanie produktów
24. Arrowood Design: Projektowanie wnętrz
Arrowood to studio projektowania wnętrz.
Co działa: Cała witryna mieści się na jednej stronie. Zamiast klikać, przewijasz cały artykuł w dół, co sprawia, że przekaz jest prosty i zrozumiały.
Spróbuj tego: Jeśli Twoja historia jest krótka, umieść ją w całości na jednej, przewijanej stronie.
Podsumowanie: witryna jednostronicowa zawiera prostą historię, którą łatwo zrozumieć.
25. Hout-in-Ere: Meble i wyroby z drewna
Sascha wykonuje ręcznie robione meble z drewna.
Co działa: Ziemiste, brązowe kolory i faktury drewna dominują w całym obiekcie. Wygląd jest dopasowany do materiału, dzięki czemu projekt jest wierny rzemiosłu.
Spróbuj tego: Korzystaj z kolorów swojej witryny na podstawie materiałów, z którymi faktycznie pracujesz.
Podsumowanie: Dopasowanie kolorów do materiału sprawia, że witryna wydaje się uczciwa.
26. OSG Studio: Projektowanie architektoniczne
OSG Studio pomaga deweloperom przekształcać plany w projekty gotowe do budowy.
Co działa: Duże, proste zdanie na górze dokładnie wyjaśnia, czym się zajmują, bez żargonu. Po jednym przeczytaniu zrozumiesz specyfikę branży, zanim zobaczysz choćby jeden projekt.
Spróbuj tego: Zacznij od jednego prostego zdania, które dokładnie opisuje, czym się zajmujesz.
Podsumowanie: Prosty tekst na górze strony szybko informuje odwiedzających, czym się zajmujesz.
27. LM Urban: Planowanie urbanistyczne
LM Urban pomaga dzielnicom stać się lepszymi miejscami do życia.
Co działa: Układ jest czysty, spokojny i prosty. W tak poważnej branży jak planowanie, ta powściągliwość sprawia, że firma wydaje się stabilna i godna zaufania.
Spróbuj tego: W przypadku poważnych prac należy zachować spokój i prostotę projektu, aby wzbudzić zaufanie.
Podsumowanie: czysty i stonowany układ sprawia, że poważna firma czuje się godna zaufania.
28. Ivy Dene Design: Projektowanie tekstyliów i wzorów
Ivy Dene Design tworzy wzory na produkty takie jak papier do pakowania.
Co działa: Zdjęcie prawdziwego produktu, pokrytego ich wzorem, znajduje się na samej górze. Widzisz dokładnie, co robią, zanim przeczytasz choćby słowo.
Spróbuj tego: Zacznij od zdjęcia prawdziwego produktu, a nie tylko logo lub sloganu.
Podsumowanie: Prawdziwe zdjęcie produktu od razu pokazuje, co zrobisz.
Moda i modelowanie
29. Karel Geerts: Starszy model
Karel jest starszym modelem, który współpracuje z markami i wydarzeniami.
Co działa: Ciemne kolory i eleganckie czcionki szeryfowe nadają witrynie ekskluzywny charakter. Wygląd pasuje do marek premium i wydarzeń, z którymi chce współpracować.
Spróbuj tego: Jeśli chcesz uzyskać elegancki, dojrzały wygląd, użyj czcionek szeryfowych i ciemnej palety barw.
Podsumowanie: Czcionki szeryfowe na ciemnej palecie barw wyglądają elegancko i ekskluzywnie.
30. Szymon Filuś: Model i fotograf
Szymon jest modelem i fotografem.
Co działa: Dużo białej przestrzeni otacza jedno mocne zdjęcie studyjne i jego nazwisko. Bez żadnych zbędnych dodatków na stronie, pojedyncze zdjęcie emanuje pewnością siebie i pewnością siebie.
Spróbuj tego: Połącz dużo białej przestrzeni z jednym wyrazistym zdjęciem, aby uzyskać pewny siebie wizerunek.
Podsumowanie: Biała przestrzeń i jedno świetne zdjęcie sprawiają wrażenie spokoju i pewności siebie.
Film i wideo
31. Nadia Farghaly: Operatorka filmowa
Nadia jest operatorką zdjęć, która kręci filmy.
Co działa: Każdy projekt rozpoczyna się od pojedynczej klatki z filmu. Ten jeden, kinowy obraz wprowadza nastrój przed odtworzeniem jakiegokolwiek materiału wideo.
Spróbuj tego: Zacznij każdy projekt od jednego, mocnego, nieruchomego kadru.
Podsumowanie: Pojedynczy fragment filmowy wciąż może nadać ton całej twórczości filmowej.
32. TheOneThreeFour: Prezentacja wideo
TheOneThreeFour to zespół zajmujący się filmowaniem dużych wydarzeń na żywo.
Co działa: Na ekranie pojawia się mroczne, dramatyczne zdjęcie sceny na żywo. Ten wyrazisty, nastrojowy obraz idealnie pasuje do energii wielkich wydarzeń, jaka emanuje z ich filmów.
Spróbuj tego: Dopasuj dramaturgię swojego wizerunku bohatera do energii swojej pracy.
Podsumowanie: Dramatyczny obraz głównego bohatera wyznacza ton śmiałych prac wideo.
Music
33. Emily Koh: Muzyk i kompozytorka
Emily jest muzykiem i kompozytorem.
Co działa: Duże zdjęcie przedstawia Emily trzymającą gitarę. Widok artystki przy pracy sprawia, że strona wydaje się osobista i autentyczna, a nie tylko listą piosenek.
Spróbuj tego: Dodaj zdjęcie przedstawiające Ciebie wykonującego swoją pracę.
Podsumowanie: Zdjęcie przedstawiające Ciebie w pracy sprawia, że witryna nabiera osobistego charakteru.
34. Keaton Marek: Muzyk
Keaton jest muzykiem.
Co działa: Menu prowadzi prosto do jego dyskografii i danych kontaktowych, bez żadnych przeszkód. Na górze znajduje się jego zdjęcie przy fortepianie, ale design szybko kieruje do muzyki.
Spróbuj tego: Zadbaj o to, aby menu prowadziło bezpośrednio do głównego zadania po jednym kliknięciu.
Podsumowanie: Czytelne menu, które prowadzi bezpośrednio do Twojej pracy, sprawia, że odwiedzający chętniej do niej wracają.
35. R&B Rodeo: Marka wydarzeń muzycznych
R&B Rodeo to marka zajmująca się organizacją imprez z muzyką na żywo.
Co działa: Jasne, pełne energii zdjęcie zatłoczonego wydarzenia idealnie wpisuje się w charakter marki. Wyraźny przycisk sprawia, że zakup biletów staje się oczywistym kolejnym krokiem.
Spróbuj tego: Dopasuj zdjęcia do energii swojej marki, a następnie dodaj jeden wyraźny przycisk akcji.
Podsumowanie: Zdjęcia, które odzwierciedlają energię Twojej marki, sprawiają, że cała witryna wydaje się odpowiednia.
Pisanie
36. Jenny Carlson: Pisarka
Jenny jest pisarką, która pomaga ludziom jasno wyrażać swoje idee.
Co działa: Nagłówek brzmi: Nie widzisz lasu zza drzew? Pytanie sprawia, że zatrzymujesz się i chcesz poznać odpowiedź, która wciąga cię w lekturę.
Spróbuj tego: Zmień nagłówek tak, aby pytanie, które zadaje już odwiedzający Twoją stronę.
Podsumowanie: Pytanie zawarte w nagłówku sprawia, że ludzie chcą czytać dalej.
Biznes, sklepy i usługi
37. Aura Invest: Finanse
Aura Invest jest firmą finansową.
Co działa: Pasek menu pozostaje na górze podczas przewijania, a wyraźny przycisk akcji jest zawsze widoczny. W przypadku witryny firmowej oznacza to, że kolejny krok jest zawsze dostępny za jednym kliknięciem.
Spróbuj tego: Przyklej pasek menu do góry i umieść przycisk, który będzie zawsze widoczny.
Podsumowanie: Dzięki menu, które jest czytelne, następny krok jest zawsze pod ręką.
38. Współczesny projekt stomatologiczny: praktyka stomatologiczna
To jest strona internetowa gabinetu stomatologicznego.
Co działa: Wita Cię pokaz slajdów z uśmiechniętymi, radosnymi twarzami. Przyjaźni ludzie sprawiają, że w firmie medycznej panuje ciepła i przyjazna atmosfera, a nie chłodna.
Spróbuj tego: Użyj ciepłych zdjęć prawdziwych, szczęśliwych ludzi, aby stworzyć przyjazną atmosferę w firmie.
Podsumowanie: Zdjęcia przyjaznych ludzi sprawiają, że firma wydaje się ciepła, a nie sterylna.
39. Nicole Gibbons: Założycielka i twórczyni marki
Nicole jest założycielką, projektantką i twórczynią marki.
Co działa: Trzy wielkie słowa: Założycielka. Projektantka. Budowniczka marki. W sekundę zdradzają, kim ona jest. Krótki, wyrazisty wstęp spełnia rolę długiego akapitu.
Spróbuj tego: Opisz siebie trzema mocnymi słowami, zamiast długiego akapitu.
Podsumowanie: Kilka odważnych słów może wprowadzić Cię szybciej niż akapit.
40. Bloom and Kettle: Sklep internetowy
Bloom and Kettle sprzedaje ręcznie robione mydła zapachowe.
Co działa: Delikatne, ciepłe kolory nadają sklepowi delikatną i spokojną atmosferę. Mydła ułożone są w siatce, a drobne animacje po najechaniu kursorem sprawiają, że przeglądanie jest przyjemne.
Spróbuj tego: Użyj stonowanej palety barw i łagodnych animacji najechania kursorem, aby sklep wydawał się zachęcający.
Podsumowanie: Delikatne kolory i niewielkie animacje sprawiają, że sklep internetowy wydaje się przyjazny.
Typowe błędy w projektowaniu witryn internetowych portfolio, których należy unikać
Nawet świetne dzieło może zostać zniweczone przez kilka typowych błędów projektowych. Oto te, na które warto zwrócić uwagę:
- Pokazywanie słabej pracy obok najlepszej. Kilka mocnych projektów przebija długą listę, a jeden słaby projekt może pociągnąć resztę w dół. Pokazuj tylko prace, z których jesteś dumny.
- Tekst trudny do odczytania. Bardzo jasnoszary tekst, mała czcionka lub słowa umieszczone na zatłoczonym zdjęciu sprawiają, że ludzie się poddają. Zadbaj o czytelność i wysoki kontrast tekstu.
- Powolne, ciężkie obrazy. Duże pliki zdjęć spowalniają ładowanie strony, a wielu odwiedzających opuszcza ją, zanim zdąży zobaczyć Twoje prace. Zapisz zdjęcia w odpowiednim rozmiarze przed ich przesłaniem.
- Ukrywanie danych kontaktowych. Jeśli ludzie nie będą mogli znaleźć sposobu, aby się z Tobą skontaktować, nie znajdą Cię. Umieść link kontaktowy na każdej stronie.
- Użycie zbyt wielu czcionek i kolorów. Trzymaj się dwóch czcionek i małego zestawu kolorów. Zbyt duża różnorodność sprawia, że strona wydaje się chaotyczna i nieplanowana.
Poprawa tych pięciu rzeczy przyniesie Twojej witrynie więcej korzyści niż jakikolwiek efekt specjalny.
Wniosek
Właśnie obejrzałeś 40 projektów witryn-portfolio autorstwa fotografów, artystów, projektantów, pisarzy i właścicieli firm.
Wszystkie wyglądają inaczej, ale łączy je ta sama prosta idea: praca jest na pierwszym miejscu, układ pozostaje przejrzysty, a następny krok jest zawsze jasny.
Twoje portfolio nie musi być efektowne, żeby się wyróżniać. Wybierz jeden cel, zacznij od swoich najmocniejszych prac, a resztę uprość. To właśnie odróżnia stronę portfolio, którą ludzie zapamiętują, od tej, którą zapominają.
Kiedy będziesz gotowy zbudować swój własny, Pixpa daje Ci 200+ Szablony i pełną kontrolę nad projektem, bez konieczności pisania kodu. Możesz również przeglądać bardziej kreatywne strony w naszym przykłady Galeria.
FAQ
Co sprawia, że projekt strony internetowej portfolio jest dobry?
Dobry projekt strony internetowej z portfolio prezentuje Twoje najlepsze prace w pierwszej kolejności, ma prosty układ i ułatwia kontakt. Zawiera krótkie menu, dużo wolnej przestrzeni i jasno wskazuje kolejny krok. Jeśli użytkownik w ciągu kilku sekund zrozumie, czym się zajmujesz, projekt jest skuteczny.
Co powinna zawierać strona internetowa portfolio?
Większość witryn portfolio wymaga strony głównej, strony z pracą lub portfolio, strony o sobie i strony kontaktowej. Pokaż swoje najmocniejsze strony, a nie wszystko, co stworzyłeś. Zadbaj o niewielką liczbę stron, aby strona była łatwa w obsłudze.
Ile projektów powinienem pokazać w swoim portfolio?
Zaprezentuj swoje najlepsze 8–12 projektów, a nie wszystkie, które zrealizowałeś. Krótki, mocny set jest lepszy niż długi, mieszany. Ludzie zapamiętują Twoje najlepsze prace, więc zacznij od nich.
Czy muszę umieć kodować, aby zaprojektować witrynę internetową typu portfolio?
Nie. Kreator stron internetowych pozwala wybrać szablon, dodać swoją pracę i opublikować ją bez pisania kodu. Ty skupiasz się na treści i projekcie, a kreator zajmuje się stroną techniczną.
Jaki jest najlepszy układ witryny portfolio?
Prosty układ z jednym, wyraźnym punktem centralnym sprawdza się najlepiej. Zacznij za darmo każdą stronę od najmocniejszego obrazu lub krótkiej linii opisującej Twoją działalność. Użyj siatki, aby zachować porządek na wielu obrazach i zostaw wolną przestrzeń, aby nic nie wydawało się stłoczone.