te niesamowite strony internetowe WordPress prezentują najlepsze z tego popularnego CMS. Kiedy po raz pierwszy został uruchomiony w 2003 roku, WordPress był uważany za podstawowe narzędzie do blogowania dla amatorów. Bardzo szybko wystartował, stając się pełnoprawnym CMS, który zasila teraz miliony witryn na całym świecie. A kreatywni profesjonaliści przesuwają granice CMS, aby tworzyć złożone i piękne witryny WordPress od tego czasu.

aby pokazać ci dokładnie, co ten niesamowity CMS może zrobić, wybraliśmy jedne z najlepszych stron WordPress., Jeśli ten artykuł inspiruje cię do zbudowania własnej witryny WordPress, te samouczki WordPress pomogą Ci zacząć lub jeśli chcesz zbudować niesamowicie wyglądające portfolio, Sprawdź nasz przewodnik po najlepszych motywach portfolio WordPress.

  • najlepsze usługi hostingowe w 2019 roku

Rafał Bojar

to portfolio fotograficzne wykorzystuje WordPress obok Vue.js (Image credit: Rafał Bojar)

projektant Zhenya Rynzhuk użył WordPressa jako półprzezroczystego CMS, z Vue.,js for the front end, to create this engaging photography portfolio site for Rafał Bojar. Zawiera stronę główną, która wyświetla Zapowiedzi wybranych historii, zgrabną siatkę, aby zaprezentować wszystkie prace Bojara, oraz stronę „esencję” wyjaśniającą filozofię i podejście fotografa.

„celem było dostarczenie zwiedzającym wyjątkowych wrażeń i zaprezentowanie niesamowitych prac Rafała” – mówi Rynzhuk. Para omówiła kilka różnych opcji zaplecza, ale zdecydowała się na WordPress, aby witryna była łatwa w zarządzaniu i regularnie aktualizowana o nowe projekty.

Obok WordPressa i Vue.,js, witryna wykorzystuje wiadro S3 do przechowywania danych, które jest dostarczane za pośrednictwem Cloudfront, aby zapewnić szybki czas ładowania. Rynzhuk wykorzystał również szkielet Vue Bedrocka i Hendrika-Jana de Hardera, a także GSAP do animacji.,

Adel Vakula

strona tej modelki jest pełna uroczego, kampowego humoru (kredyt na zdjęcie: Adel Vakula)

Adel Vakula to znana na całym świecie modelka z Ukrainy, a ta strona promocyjna dla niej pochodzi od rodaków Yabloko ideas studio, które nie tylko zaprojektowało i zakodowało, ale stworzyło wszystkie prace ilustracyjne. Rezultatem jest niezwykle charakterystyczna wizualna uczta, obejmująca wiele malarskich winiet z naszą czarującą bohaterką.,

z otwierającego watę cukrową cloudscape, który dosłownie bąbelkuje subtelnymi animacjami, Vakula występuje w marzycielskich portretach, które mają zademonstrować charyzmatyczną osobowość. Z kapryśnym widokiem na paryską noc na szczycie gargulca podwojonego jako przycisk Play na YouTube, po złapaniu nowojorskiego pociągu metra z peronu z busking cat. Wizyty w Wenecji i Ibizie zapewniają równie ekscentryczne tło do Instagram i linki e-mail, gdzie nawet popijające koktajle foki zachęcają do śledzenia., To jest język w policzku, ale zrobione z takim urokiem i techniką, że nie możesz pomóc, ale się zakochać. Nawet wskaźnik myszy ma kształt serca.

zbudowany na CMS WordPress, wyróżniający się element UI to zabawna sekcja, w której możesz przeciągać i upuszczać stroje na wirtualną Vakulę, aby zobaczyć prawdziwe zdjęcia modelarskie. Jako wizytówki do możliwych castingów, ten uderza w bardziej pamiętną pozę niż większość.,

autor: Mark Billen

Middle Child

Middle Child jest zbudowany na całkowicie szytym na miarę motywie WordPress – kliknij obrazek, aby poznać stronę

wielokrotnie nagradzany, Filadelfijski Sklep z kanapkami middle child potrzebował strony internetowej, która pasowałaby do jego dziwacznego, bezpretensjonalnego klimatu., Studio projektowo-technologiczne Self Aware podjęło wyzwanie, tworząc witrynę opartą na całkowicie dostosowanym motywie WordPress przy użyciu Timber i ACF – kombinacji, którą partner studia Mike Wagz nazywa „przełomowym rozwiązaniem dla poważnych twórców motywów WordPress”.

Self Aware wykorzystał również najnowsze technologie internetowe, aby zaoferować optymalne wrażenia: layout został stworzony przy użyciu CSS Grid, a pracownik serwisu buforuje zasoby statyczne, w tym pliki CSS i JavaScript, aby przyspieszyć początkowy czas ładowania.,

„środkowe dziecko emanuje atmosferą z każdego zakamarka” – dodaje Wagz. „Serdecznie wita klientów ze wszystkich środowisk z odpowiednią ilością zabawy, kiczu i dziwactwa. Myślę, że ten projekt jest udany, ponieważ udało nam się uchwycić tego ducha i przetłumaczyć go na sieć.,”

Sea Harvest

ED użył układu w stylu gazety w swojej stronie internetowej opartej na WordPressie dla Sea Harvest

Kiedy Rynek owoców morza w Canberze Sea Harvest potrzebował nowej tożsamości marki i smart digital presence, aby dopasować, zwrócił się do australijskiej agencji internetowej i marki ed. Witryna WordPress ma uderzający układ w stylu gazety z mnóstwem dziwacznych akcentów do zbadania.,

„Kiedy myślimy o owocach morza, wielu z nas wraca do wspomnień jedzenia ryb i frytek na plaży z przyjaciółmi i rodziną”, mówi projektant Cam Tidy. „Często te stawy na wynos zawijały jedzenie w gazetę, więc wydawało się to naturalne, aby zbadać to jako pomysł wizualny.”

powielanie statycznego układu wydruku w Internecie nie było jednak pozbawione wyzwań. Zespół użył CSS Flexbox do zmiany położenia zawartości przy zachowaniu spójnych odstępów, niezależnie od rozmiaru ekranu., Prawie każdy pomiar opiera się na responsywnej skali z wykorzystaniem jednostek REM, co ułatwia utrzymanie kontroli nad typem i proporcjami obrazu w skali przeglądarki.

ulubioną cechą dewelopera Bryn Shanahan jest fakt, że użytkownicy mogą „rysować” na stronie, w tym za pomocą interaktywnego wyszukiwania słów. „Osiągnęliśmy to, pokrywając witrynę elementem HTML5 Canvas, który następnie został użyty do narysowania rysunków użytkownika”, wyjaśnia.

ED wykorzystuje WordPress do wielu projektów stron internetowych, uznając go za przyjazny dla użytkownika i intuicyjny dla klientów., „łatwe tworzenie back-endu, które pozwala więcej czasu na skupienie się na front-endzie, aby ożywić projekt”, dodaje deweloper Adam Forcucci. „Możliwość uczynienia go bezgłowym, za pomocą WP REST API, pozwala nam korzystać z frameworków takich jak React, który staje się rdzeniem naszego przyszłego rozwoju na platformie.”

Maxim Shkret

’topnienie Panda' może być obracany w lewo iw prawo (kredyt obraz: Maxim Shkret)

oparte na Saint Petersburg, Rosja, Maxim shkret jest niezależnym artystą cyfrowym., Jego imponująca strona internetowa WordPress łączy portfolio z marketplace ecommerce, rozpoczynając nowatorską inicjatywę zbierania funduszy.

witryna otwiera się na serii czterech modeli 3D lub cyfrowych rzeźb, które można przeciągać i obracać o 360 stopni. Świnia, Lis Pustynny, Jednorożec dwurodzinny i Topniejąca Panda mogą być obracane w lewo i w prawo, aby uzyskać preferowany kąt. Klikając przycisk „Kup to ujęcie”, odwiedzający mogą kupić obraz cyfrowy w różnych wymiarach w różnych cenach., Wpływy zostaną zebrane z powrotem w celu przekształcenia każdego modelu cyfrowego w prawdziwe fizyczne rzeźby za pomocą pięcioosiowego procesu obróbki CNC druku 3D. Jest to zgrabny pomysł na zapraszanie współpracowników i pokazuje, w jaki sposób podejście crowdfundingowe można powiązać z typowo pasywnym doświadczeniem.

site production credits to nowojorskie Studio Projektowe Sochnik, ale sprytny interfejs nigdy nie przyćmił talentu Shkreta. Obejmuje to prostą sekcję galerii zdjęć nieruchomych rzeźb, które tętnią i falują przez wodny filtr., To subtelny efekt, ale zwiększa poczucie Tekstury Shkret zamierza dać każdy kawałek.

KOBU

strona internetowa KOBU otwiera się z pofałdowaną stroną główną w stylu lampy lawowej

Portfolio stron, nic dziwnego, nadal zapewniają niektóre z najbardziej urodzajny grunt dla twórczej ekspresji i inspiracji. Ta Internetowa Wizytówka Portugalskiej agencji KOBU wynika z tego, że etos z gustowną, powściągliwą witryną WordPress, która nadal bąbelkuje charakterem., Nazywając siebie „laboratorium marki”, które nie boi się eksperymentów, praca techniczna pokazuje wyobraźnię nad złożonością.

Po serii elementów, otrzymujemy przypomnienie, jak CSS i SVG mogą być łączone dla maksymalnego znaku frontend. Pozycjonowanie absolutne służy do nakładania uroczych motywów szkieletowych, rozbijania linii między pogrubionymi blokami kolorów tła i łączenia ze sobą odcinków. Zapętlony panel wideo HTML5 otrzymuje unikalną krawędź, używając kształtu SVG jako maski umieszczonej powyżej, zanim obrazy studium przypadku zmniejszą promień krawędzi o połowę, aby przejść do okrągłego., Strona korzysta z plików cookies w celu realizacji usług i zgodnie z Polityką plików cookies.biblioteka js Karuzela do „kłusa” zespołu KOBU, z biurowym koniem, przez środek strony głównej.

Zenit jest jednak prawdopodobnie tym bitem, który widzimy jako pierwszy, otwierającym się na falistym nagłówku w stylu lampy lawy wytwarzanym przez manipulowanie ścieżkami SVG. Wykorzystanie anime.js plugin, wielowartościowy silnik animacji JavaScript, to przyciągająca wzrok sztuczka przy ustalaniu palety kolorów, jeśli nic innego.,

autor: Mark Billen

noformat

Strona główna noformat ma mnóstwo natychmiastowego wpływu

noformat jest strategicznym studiem projektowym opartym na w Nowym Jorku. Strona główna zawiera animowaną gałkę oczną, która podąża za kursorem odwiedzającego po ekranie, podczas gdy nakładany tekst przechodzi przez wszystkie rzeczy, które może stworzyć noformat. Aby stworzyć gałkę oczną, zespół najpierw zbadał projekt w After Effects CC, a następnie użył trzech.,js zbuduje interaktywną wersję, wyjaśnia Ian Brewer, założyciel i dyrektor kreatywny noformat.

„wykorzystaliśmy cieniowanie wierzchołków i fragmentów do optymalizacji renderowania GPU i sprawiliśmy, że pulsowało i migało logo noformat w środku”, kontynuuje Brewer. „Następnie zastosowaliśmy efekty post-processingu, aby nadać mu bardziej organiczny i mniej trójwymiarowy wygląd poprzez rozmycie krawędzi i dodanie kwitnienia do pasemek.”

reszta witryny zasługuje na wpływ pierwszej strony, z gładkimi przejściami na przewijaniu i subtelnymi efektami paralaksy, pokazującymi umiejętności techniczne bez wpływu na użyteczność.,

„wybraliśmy WordPress dla naszej strony dla szybkości uruchamiania i elastyczności”, wyjaśnia Brewer. „Przez lata zbudowaliśmy własne biblioteki i systemy edycji oparte na modułach, które pozwalają nam tworzyć lub edytować stronę szybciej niż jakiekolwiek inne rozwiązanie CMS.”

femme i Fierce

holenderskie studio projektowe Wonderland dostarczyło e-commerce z sass dla Femme i Fierce. Witryna WordPress w swojej twarzy, clash-tastic kolorystyka dostarcza przesłanie marki sklepu internetowego mody z off., Animowane „naklejki” – kręcące lizaki, dźgające strzałki, lizające usta-tworzą bezczelny dotyk i powinny rezonować z Generacją Snapchata / Instagram, na którą skierowany jest ten zakres.

Puree Maison

animowane bazgroły ożywają tę stronę WordPress

Purée Maison to kreatywne i strategiczne studio z siedzibą w Paryżu. Jego strona internetowa WordPress wyróżnia się głównie dzięki słonecznym żółtym animowanym bazgrołom, które pojawiają się na hover, wstrzykują osobowość w nudne stwierdzenia marki i ożywiają przejścia., Pomagają również odwiedzającemu znaleźć drogę i zachęcają do odkrywania i interakcji z witryną.

praktycznie jesteśmy

strona we Virtual Are świetnie wykorzystuje wideo 360 stopni do sprzedaży swoich usług

gdy Twoja firma jest o fascynacji ludzi korzystających z wirtualnych rzeczywistość aby opowiadać emocjonalne historie, potrzebujesz witryny, która przyciąga ludzi do twojej pracy. I boutique VR studio jesteśmy praktycznie udało się, że i wtedy niektóre., Jego strona, zbudowana przez Herdl na WordPress, wykorzystuje wiele najnowocześniejszych technik, w tym WebGL i wideo 360 stopni, aby dać ci nieodparty smak wciągających usług. Sprawdź jego jazdy testowe VR Dla Audi, wraz z nieoczekiwanymi gośćmi gwiazd.

Asaro

strona Asaro jest wystarczająco responsywna, aby wyglądać pięknie na wszystkich rozmiarach ekranu

Asaro jest dostawcą unikalnych przeżyć przygodowych i zabawnych podróży dla superyacht gości na całym świecie., W ramach szerszego rebrandingu korporacyjnego, ta elegancka strona internetowa została zaprojektowana i opracowana przez Agencję Green Chameleon z Bristolu.

zbudowany na niestandardowym frameworku WordPress, aby utrzymać bieżącą edycję treści łatwą dla klienta, odwiedzający są zabierani w podróż odkrywczą pełną uroku. Subtelne efekty przewijania są starannie połączone z interaktywną linią przerywaną, kreśląc postępy nawigacyjne w sposób, w jaki kapitan jachtu może oznaczać wykresy., Niestandardowe rendery CGI zostały wykorzystane jako urządzenie graficzne do reprezentowania ekskluzywnej oferty usług Asaro, w świetle niedoboru zasobów fotograficznych ze względu na prywatny charakter wydarzeń.

„scenografia została zainspirowana mieszanką fotografii kropli wody i projektu plakatu teatralnego”, wyjaśnia dyrektor kreatywny Tom Anderson. „Uwielbialiśmy estetykę stylu fotograficznego i czuliśmy, że jest on ładnie związany z leżącym u podstaw motywem żeglarskim projektu.,”

wystarczająco responsywny, aby nie tylko pięknie wyglądać na mniejszych ekranach, szybkość dostępu była również motywacją do usprawnienia wydajności. Z mieszkańcami łodzi na łasce marine Web connectivity, czas ładowania są bardziej chipper niż niepewny na komputerze stacjonarnym, tablecie i telefonie komórkowym.,

autor: Mark Billen

Design Museum Denmark

inteligentne wykorzystanie przewijania paralaksy i responsywnych obrazów sprawia, że strona duńskiego Muzeum Designu jest obowiązkowa

zbudowany przez kopenhaską agencję designu i brandingu stupid Studios, witryna duńskiego Muzeum Designu nie tylko prezentuje archiwa, kolekcje i badania muzeum, ale także prezentuje je w nowoczesnym stylu., Od animacji otwarcia logo Muzeum w formacie SVG, po przyciągające wzrok przewijanie paralaksy i poprawiające nastrój palety podczas przewijania treści, Jest to idealna obecność online dla niezbędnego miejsca do projektowania.

Katy Perry

nawet największe gwiazdy korzystają z narzędzi dostarczonych przez WordPress

Pop księżniczka Katy Perry używa nikogo innego niż WordPress do hostowania swojej oficjalnej strony internetowej., Skupiając się – co zrozumiałe-na wizualizacjach i wskazówkach z mediów społecznościowych, strona wykorzystuje wysokiej jakości zdjęcia portfolio artysty, aby wyrazić odważne stwierdzenie. Przewiń w dół, aby zobaczyć daty wycieczek, gadżety i inne rzeczy lub użyj ikon, aby dowiedzieć się więcej.

jest to czysta, ale kanciasta strona, która łączy charakterystyczny osobisty wizerunek artysty z przyjazną dla użytkownika, błyszczącą funkcjonalnością w stylu mag. Minęły czasy ruchliwych witryn zespołów wypełnionych zbyt dużą ilością animacji i muzyki, której nie można zatrzymać., Strona Perry ' ego udowadnia, że możesz spakować mnóstwo osobowości za pomocą prostego białego tła i łatwych do nawigacji linków, dając fanom możliwość łatwego słuchania, oglądania i nauki.

zbiornik atramentu

strona Kao Collins jest zaprojektowana, aby myśleć o atramencie

począwszy od 1989 roku jako Collins Inkjet, jednoosobowa operacja dostarczająca atrament do ciągłej drukarki atramentowej Kodak, dziś kao Collins jest jednym z wiodących światowych dostawców., A jeśli nigdy tak naprawdę nie myślałeś o tuszu (poza przeklinaniem, gdy skończy się drukarka), strona Kao Collins, Zbiornik Z Tuszem, ma zamiar to zmienić.

zbudowany przez DBS Interactive, The Ink Tank to przyciągająca wzrok strona WordPress, która wyciąga wszystkie przystanki, aby dostarczyć najnowocześniejsze wiadomości z branży atramentów i zaprezentować niektóre kreatywne sposoby, w jakie firmy i artyści używają obecnie atramentu., Punktem kulminacyjnym, jeśli chodzi o nas, jest sekcja Historia druku: wspaniały jednoprocesor paralaksy wypełniony animacjami i efektami, który zabierze cię od glinianych tabletek do dzisiejszego szybkiego drukowania jednokrotnego i spojrzy w przyszłość na niektóre z przyszłych możliwości drukowania.,

(Image credit: Future)
  • 14 prostych sposobów, aby Twoja strona była bardziej dostępna
  • oszałamiające przewijanie paralaksy do zbadania
  • najlepsze 404 strony

najnowsze wiadomości

{{ Articlename}}