Spojrzenie wstecz na 30+ Kilka lat projektowania stron internetowych

Opublikowany: 2022-03-30

Projektowanie stron internetowych przeszło bardzo długą drogę ze względu na fakt, że w 1991 roku została wydana pierwsza w historii strona internetowa. Całkowicie skoncentrowana na tekście strona internetowa oznaczała początek tego, co miało przerodzić się w rewolucję elektroniczną.

I chociaż wspomnienia GIF-ów „w budowie” i oślepiające kolory z historii osiągnięć sprawiają, że jestem wdzięczny za to, jak wiele pojawiło się w Internecie, istnieją pewne historyczne decyzje dotyczące stylu witryny, które zasadniczo wymagają ukłonu w stronę szacunku.

Do tej pory nie brakowało takich stron internetowych jak ta. Jeśli chcesz zobaczyć, jak wyglądała strona internetowa w dowolnym odstępie czasu, biorąc pod uwagę fakt jej uruchomienia, wprowadź nazwę domeny do Wayback Machine i wybierz dzień. W tym artykule przyjrzyjmy się, jak rozwinął się styl witryny, od interfejsów zawierających tylko treść tekstową po gładkie, współczesne projekty, które widzimy w dzisiejszych czasach.

Darmowe pobieranie: 77 przykładów genialnego projektowania stron internetowych

Początek lat 90.: antyk

Początek lat 90. to początek harmonogramu układu strony internetowej. W tym momencie nie było czegoś takiego jak szybki link internetowy. To były modemy telefoniczne albo nic. W związku z tym strony internetowe musiały zostać opracowane dla znacznie niższych niż gwiezdne prędkości łączy. Wyglądały głównie jak partycje tekstu — to, co teraz uważamy za oczywiste jako „format układu”, nie istniało.

history of web design: an examle of an early html website

Chociaż później wariacje HTML pozwoliły na znacznie bardziej zaawansowane projekty, były one jednak niezwykle pierwotne w porównaniu z obecnymi, składając się głównie z tagów nagłówków, akapitów i linków przychodzących. Widoczne elementy i stylistyka, takie jak typografia, obrazy i nawigacja, były elementami nie tak odległej, dającej się przewidzieć przyszłości.

Na wynos dla nowoczesnych stron internetowych:

Chociaż funkcjonalność tych wczesnych stron internetowych była czysto informacyjna, możemy zobaczyć niektóre komponenty projektowe, które są obecnie wykorzystywane. Te stare strony internetowe były wyjątkowo lekkie i zoptymalizowane pod kątem stopniowego połączenia internetowego, z którego wszyscy od czasu do czasu korzystamy. Te czynniki związane z projektem i stylem uwzględniały doświadczenie w pracy danej osoby, czego dzisiejsze witryny zwykle nie oferują, nawet przy większych prędkościach.

Z pewnością dzisiejsza sieć WWW może poradzić sobie z przeładowanymi mediami stronami internetowymi… ale nawet teraz ma pewne granice. Duże pliki multimedialne, ciężki styl graficzny i nienormalne animacje mogą przyczynić się do większych współczynników odrzuceń, gdy prędkości ładowania zwykle nie są tak szybkie, jak byśmy tego chcieli. Trzymaj swoją osobę w głowie, biorąc pod uwagę skomplikowany styl i projekt, i pamiętaj o KISS (Kontynuuj, aby to było bardzo proste, Superbohaterze).

Połowa lat 90.: średniowiecze

Centralne wieki struktury sieci były nękane przez twórców witryn internetowych i spacerowe GIF-y. (Ale więcej niż prawdziwa plaga, ideał?) W połowie lat 90. styl strony internetowej rozwinął się zarówno pod względem kompozycji, jak i wyglądu. Projektanci zaczęli wykorzystywać układy oparte głównie na tabelach do zarządzania materiałem, co pozwala na większą elastyczność i kreatywną wyobraźnię. Witryny internetowe były jednak raczej treścią tekstową, ale tekst można teraz podzielić na kolumny, wiersze i inne funkcje nawigacyjne, aby uzyskać znacznie lepszą czytelność.

Od razu zyskały na popularności również elementy graficzne. Liczniki odwiedzin witryny, animowany tekst i tańczące GIF-y to tylko garść funkcji graficznych, które zaznaczają ten okres w stylu sieciowym.

history of web design: the early version of apple's website

Na wynos dla dzisiejszych witryn internetowych:

Obecnie istnieje wiele wyjaśnień, dlaczego projekt i styl zależny od biurka nie są idealnym wyborem dla Twojej witryny — znaczne znaczniki, powolne momenty ładowania i niespójność wizualna to tylko kilka pułapek.

Bez względu na to, postęp ten był kluczowy w ewolucji stylu World Wide Web: był to początek przejścia w kierunku nieliniowego szkieletu strony internetowej. Odrębne elementy można teraz umieszczać w odrębnych sekcjach strony internetowej o zasięgu ogólnoświatowym, a projektanci mają doświadczenie w rozważaniu najbardziej efektywnej drogi do istniejących danych dla konsumenta.

Struktura strony internetowej pozostaje kluczowa, jeśli chodzi o nawigację i treść pisaną. To w dużej mierze decyduje o tym, jak użytkownik doświadcza i wchodzi w interakcję z Twoją witryną internetową. Chociaż te czynniki mogły nie być na pierwszym planie w ciągu wieków struktury sieci, z pewnością obecnie są na czele.

Późne lata 90.: Renesans

Renesans. Odrodzenie. Styl ogólnoświatowy przeszedł rozsądną część przeobrażeń, ale jedno z pierwszych pojawiło się wraz z wprowadzeniem Flasha. Wprowadzony w 1996 r. Flash otworzył świat perspektyw stylu, które nie były osiągalne za pomocą prostego HTML. To był mariaż wirtualnej grafiki i interakcji.

Podczas gdy wiele tych samych elementów projektu i stylu z poprzednich okresów było nadal obecnych, zostały one wzbogacone o animacje, kafelkowe wizualizacje historyczne, neonowe kolory, przyciski 3D, powitalne strony internetowe i inne multimedia.

Flash zapoczątkował styl i design skoncentrowany na kliencie — konstrukcja i nawigacja stały się kluczowymi kryteriami, a projektanci zaczęli dopracowywać wygląd i użyteczność ponad czystymi artykułami.

history of web design: a website with flash elements

Na wynos dla dzisiejszych stron internetowych:

Flash zmieniał zasady gry, ale nie przylgnął do niego na stałe. Flash prawie nigdy nie jest stosowany i jest uważany za jeden z największych grzechów optymalizacji sieci wszechczasów. Obecnie normą jest decydowanie się na alternatywne rozwiązania, takie jak animacje CSS i JavaScript, aby uzyskać równoważne wyniki, lub umieszczanie filmów z wideoklipów internetowych hostujących witryny internetowe.

Początek XXI wieku: Oświecenie

Wczesne lata 2000 były okresem, w którym użyteczność i zdolność adaptacji naprawdę znalazły się na czele światowej struktury sieci.

Głównym żądaniem był CSS, język kodowania, który pozwalał programistom na oddzielenie widocznych reguł w informacjach od HTML, umiejętnie oddzielając pisemną treść od mody. Dało to większą swobodę artystyczną zarówno projektantom sieci, jak i twórcom treści pisanych — treść mogła być teraz tworzona całkowicie na podstawie projektu i vice versa. Strony stworzone przez CSS są łatwiejsze w utrzymaniu (mniej kodu i złożoności), znacznie bardziej elastyczne (tagi DIV są niezależne od 1 jeszcze innego) i szybsze do załadowania (pliki o mniejszych rozmiarach).

Znacznie lepsza znajomość psychologii kolorów doprowadziła również do zwiększonego wykorzystania białych znaków i mniej jaskrawych odcieni, takich jak neony. Linki zaczęły być dodawane do ikon, a nie tylko treści tekstowe, rozdzielczość i pikselacja stały się o wiele ważniejszymi problemami, a strategiczne rozmieszczenie materiałów również zyskało na popularności.

history of web design: an early website for the company polaroid

Na wynos dla dzisiejszych stron internetowych:

Mężczyźni i kobiety zwykle przeglądają strony internetowe w poszukiwaniu potrzebnych im informacji i faktów, więc każda strona, która ułatwia to zadanie, otrzymuje duży test. Doświadczeni projektanci stron internetowych wiedzą, że większość użytkowników końcowych nie powinna przeglądać wszystkich drobiazgów w witrynie internetowej i rozumieć, jak odbiorcy uwzględniają informacje.

W związku z tym intuicyjne umieszczanie faktów, wizualnie zaakcentowane linki przychodzące i prosta nawigacja to tylko niektóre z najlepszych procedur, których muszą przestrzegać nowoczesne witryny internetowe. Ogólnie styl i design z użytecznością w myślach!

Od połowy do końca XXI wieku: rewolucja przemysłowa

Rewolucja przemysłowa w projektowaniu sieci i stylu rozpoczyna się wraz z początkiem Net 2. To właśnie w tym czasie sprawy naprawdę zaczęły się przesuwać w kierunku współczesnego ogólnoświatowego Internetu. Rozwój aplikacji multimedialnych, rozwój interaktywnych treści pisanych oraz pojawienie się mediów społecznościowych to kilka definitywnych cech tego przedziału.

Ponadto te usprawnienia w głównej mierze podyktowały sposób, w jaki struktura strony została… ładnie wykonana . Zmiany estetyczne obejmowały lepszy rozkład cieni, zwiększone wykorzystanie ikon i większą dbałość o typografię.

Co jednak najważniejsze, styl i design stały się przedmiotem treści, a treść pisana zwróciła się ku optymalizacji motorycznej badań. Gdy osoba znalazła się teraz w centrum układu, rozwiązania marketingowe (przynajmniej wprost) stały się drugorzędną wydajnością witryn — teraz chodziło tylko o odkrycie.

history of web design: a mid-2000s website for the company lulu lemon

Na wynos dla dzisiejszych stron internetowych:

Jak już wspomnieliśmy, ewolucja Witryny 2. zaobserwowała postęp optymalizacji sieci jako kwestię do rozważenia. Chociaż metody te były dostosowywane przez lata, rozważanie o swojej witrynie w frazach optymalizacji sieci nadal jest głównym priorytetem dla większości kwitnących witryn internetowych dla przedsiębiorstw.

Pozycjonowanie wymaga treści pisanych, a treść pisemna w tym okresie wzrosła głównie, aby stać się naciskiem na styl i projekt strony internetowej. Optymalizacja słów kluczowych, łączenie przychodzące i wychodzące, tworzenie, tagowanie i know-how w zakresie syndykacji, takie jak RSS, stały się czystymi elementami układu. Podczas gdy spamowanie adresów URL i zacinanie wyszukiwanych haseł szybko wykorzystywało te metody, procedury te przez dłuższy czas nie są skuteczne i (mam nadzieję) w większości zakończyły się fiaskiem.

2010 do teraz: era mody

Dzisiaj, około dwóch lat po opublikowaniu pierwszej strony internetowej, net layout zadomowił się jako niezastąpiony składnik każdego bardzo dobrego podejścia do reklamy i marketingu. Najnowsza analiza wykazała, że ​​50% dzisiejszych konsumentów zakłada, że ​​styl strony internetowej ma kluczowe znaczenie dla modelu biznesowego.

W warunkach współczesnej estetyki byliśmy świadkami proliferacji minimalizmu: rzadkie artykuły, płaska grafika (tak długa, 3D przyciski!), prostsze palety kolorów, duże i odważne wizualizacje. Ponadto UX zajął środkowy etap, udostępniając te opcje układu, takie jak nieskończone przewijanie oraz projektowanie i styl pojedynczej strony internetowej.

Być może zauważyłeś, że nasza strona internetowa zawiera wszystkie te cechy w swojej najnowszej szacie graficznej:

history of web design: a modern website for the company hubspot

Bardziej istotnym krokiem w ewolucji stylu i projektowania stron internetowych jest internet komórkowy. Biorąc pod uwagę, że początek iPhone'a miał miejsce w 2007 r., dokonano ponownej analizy struktury witryn internetowych, aby dostosować ją do rosnącej liczby użytkowników korzystających z Internetu. Obejmuje to różne platformy mobilne, które wybierają strategię „najpierw mobilność”, a nawet większy cel optymalizacji tempa komórkowego, biorąc pod uwagę fakt, że telefony zwykle nie mają takiej szybkości przetwarzania ani mocy relacji typowego komputera stacjonarnego.

Ta cyfrowa rewolucja zapewniła również wzrost responsywnego układu, w którym aspekty strony mechanicznie modyfikują szerokość okna przeglądania, umożliwiając stronom internetowym bardzo dobry wgląd w dowolny komputer lub wyświetlacz. Teraz, aby zapewnić satysfakcjonujące spotkanie z użytkownikiem mobilnym, wymagany jest responsywny projekt, określony ponad 50% odwiedzających witrynę na całym świecie będzie pochodzić z urządzeń komórkowych.

Dokąd pójdą kolejne strony internetowe?

Jeśli istnieje jeden szczególny element, który wykształcił każdą jednostkę samotnie tylko w jednym z tych osiągnięć, jest to treść pisemna. Każdy pojedynczy składnik struktury poniżej został dostosowany w taki sposób, aby w jak najbardziej produktywny i efektywny sposób przenosić najbardziej odpowiedni materiał do osoby. Pojęcia dostępności, adaptacyjności i użyteczności naprawdę definiują ten okres projektowania sieci WWW.

Chociaż z pewnością jest wiele dodatkowych rzeczy, które możemy obecnie zrobić z projektowaniem Internetu, miło jest rozważyć ponowne pojawienie się, z którego pochodzimy. Chcąc konsekwentnie rozwijać projektowanie stron internetowych, naprawdę ekscytujące jest odczuwanie tego, gdzie będzie w ciągu następnych 20 lat.

Uwaga redaktora: Ten post został pierwotnie opublikowany w lipcu 2013 r. i jest aktualny pod kątem obszerności.

przykłady genialnego projektu strony głównej, bloga i landing page