Data: 24.02.2022
Ewolucja web designu.
Od momentu powstania pierwszych stron internetowych na początku lat 90-tych, projektanci próbowali różnych metod, aby zmienić sposób, w jaki witryny www wyglądają i działają. Web design przebył daleką drogę i wprowadził wiele rewolucyjnych rozwiązań.
Jak zmieniało się życie w sieci na przestrzeni lat?
Sprawdźmy to!
Rozwój internetu i stron internetowych
- wprowadzenie
-
Strony czysto tekstowe
-
Tekst z grafiką
-
Tabele i Flash
-
CSS
Jak można się domyślać na samym początku strony internetowe nie były na tak rozbudowanym poziomie jak obecnie. Ich tworzenie wymagało kodowania.
Na temat ich wyglądu nie można powiedzieć zbyt wiele. Był to bowiem sam tekst. Z czasem do treści pisanych zaczęto dodawać jedno lub kilka zdjęć. Co ciekawe szybko po powstaniu internetu stworzone też koncepcje narzędzia, które można nazywać przodkiem kreatorów stron.
Dzięki kreowaniu witryn www przy pomocy tabeli i stosowaniu programu Flash, wygląd (układ) i funkcjonalność zaczęły się poprawiać. Jednak to CSS (kaskadowe arkusze stylów) sprawiło, że platformy internetowe publikowane w sieci zaczęły wyglądać bardziej atrakcyjnie i mogły się czymś od siebie wyróżniać
Oś czasu - ściągawka
Możemy wyróżnić naprawdę wiele dat, które świadczą o rozwoju internetu. Od narodzin samej koncepcji, przez pierwsze strony www, wyszukiwarki…aż do dziś. Zmiany są nieustające. Jak wyglądało pierwsze 40 lat?
1962 - Narodziny koncepcji Internetu (Paul Baran)
1969 - Start sieci Arpanet
1971 - Pierwsza poczta mailowa (R.S Tomilson)
1977 - Start TCP/IP, czyli zestawu protokołów definiujących wzajemną komunikację i wymianę danych w Internecie.
1979 - Grupa dyskusyjna USENET
1984 - Pierwsze emotikony
1984 - Powstanie Domain Name System, czyli systemu, który tłumaczy nazwy komputerów na cyfry - P. Mockaperis)
1985 - Pierwsza domena: symbolics.com
1988 - Pierwszy wirus w sieci na dużą skalę
1990 - System WWW - WorldWideWeb (T. Berens-Lee)
1990 (czerwiec) - Pierwsza domena .pl
1991 (sierpień) - Pierwsza publikacja strony
1991 (grudzień) - Oficjalny dostęp do internetu dla Polski
1992 - Pierwsza przeglądarka Mosaic (M. Andreessen, E. Bina)
1994 - Katalog zasobów internetowych "Yahoo" (D. Filo, J. Yang),
1995 - Wypuszczenie języka Java
1998 - Powstanie wyszukiwarki Google
1999 - Sieć szerokopasmowa (w Polsce 2001)
2003 - Spamy i wirusy pojawiają się na większą skalę
2004 - "Open source" zyskuje na znaczeniu
2004/2005 - Początki internetu mobilnego
2006/2007 - Facebook staje się platformą ogólnodostępną
Ciekawostka
Adobe Photoshop pojawiło się już w 1990 roku i wymagało posiadania 2MB pamięci RAM
Termin World Wide Web wprowadził brytyjski fizyk i programista Tim Berners-Lee w 1989 roku. Był to pomysł ogólnoświatowego projektu opartego na czymś, co nazywa się hipertekstem – wielką organizacją danych, którą spajają hiperłącza (linki).
Proces rozwoju internetu, a co za tym idzie ewolucja web designu, jest bardzo złożony. Wiele czynników miało na niego wpływ, ale skupimy się tutaj na tych najważniejszych, które pozwolą nam odbyć szybką podróż do przeszłości i z powrotem.
Lata 90’
W 1991 roku Tim Bernersa-Lee opublikował dokument, w którym przedstawił tagi HTML:
<title>, <nextid>, <a>, <isindex>, <plaintext>, <listing>, <p>, <h1>…<h6>, <address>, <hp1>, <hp2>…, <dl>, <dt>, <dd>, <ul>, <li>,<menu> and <dir>.
...a tak wyglądała pierwsza oficjalna publikacja w sieci -> http://info.cern.ch/hypertext/WWW/TheProject.html.
Nazwę pierwszej przeglądarki Tim'a Bernersa-Lee z WorldWideWeb zmieniono później na Nexus.
Poniżej możemy zobaczyć jedną z pierwszych grafik, jakie zostały opublikowane w internecie - Les Horribles Cernettes.
W momencie, gdy strony internetowe zaczęły być wykorzystywane w dziedzinie biznesu i handlu. Pojawiły się też pierwsze landing page’e
Lata 90' to również czas, w którym możemy mówić o początkach banerów reklamowych. Pierwszy z nich został wprowadzony przez Hotwire (obecna nazwa: Wired).
W momencie gdy pojawił się język JavaScript możemy mówić o pierwszych zalążkach responsywnego web designu. Do bezpośrednich przykładów jakie zaliczamy jako rezultat JS są np. pop-upy. Nadal jednak sam czas pracy i ładowania się strony był powolny - szczególnie jeśli dodaliśmy do naszej witryny jeszcze dodatkową warstwę.
Prowadzenie wirtualnego pamiętnika (tworzenie bloga) również przypada na koniec 2. tysiąclecia. W tym czasie były to przede wszystkim wpisy typowo "tekstowe".
1994- jedną z pierwszych stron, która skupiała się bardziej na aspekcie typowo wizualnym była witryna Batman Forever zaożona przez Jeffrey’a Zeldmana, Steve’a McCarron’a and Alec’a Pollaka.
W 1995 roku pojawia się Amazon, który na początku oferował jedynie sprzedaż książek oraz AuctionWeb, znany nam teraz bardziej jako eBay.
W tym samym roku pojawia się też nowa odsłona HTML, która umożliwiała już tworzenie form, tabel i dodawanie grafik. Pojawiły się też nowe tagi : <!DOCTYPE>, <head>, <body>, <form>, <img>, <input>, <select>, <strong>.
Adobe Flash Player został wypuszczony na rynek w 1996 roku. Projektowanie stron internetowych zyskało większą swobodę i oryginalność. Nie był to już zwykły czarny tekst na białym tle. Mieliśmy możliwość dodawania koloru tła, eksperymentowania fontami, a nawet dodawania elementów, które można było zaanimować. Był jednak drobny haczyk. Stronę internetową w całej swej okazałości mogli zobaczyć tylko Ci, którzy posiadali wbudowaną wtyczkę Flash. Dodatkowo samo ładowanie również było dość długim procesem.
Wyszukiwarki
Większe zasoby platform trzeba było jakoś uporządkować. Rzecz jasna wiele stron omawiało podobne zagadnienia etc. Jedne jednak robiły to lepiej, a drugie gorzej - zarówno pod względem merytorycznym, jak i wizualnym.
Do życia weszły więc wyszukiwarki.
Tutaj wyróżnić możemy IE (Internet Explorer), Yahoo i Netscape, ale nie należy też zapominać o ALIWEB, która uważana jest za pierwszą wyszukiwarkę. To prawdopodobnie na niej po raz pierwszy zastosowano kolor (żółty).
W 1998 roku pojawiła się wersja beta najpopularniejszej wyszukiwarki, czyli oczywiście Google.
W tym samym roku, w którym pojawił się Google zareprezentowano również CSS, który w połączeniu z HTML sprawił, że tworzenie stron dawało większe pole do popisu. Dzięki HTML budowaliśmy wartość merytoryczną naszej strony, a z kolei przy użyciu CSS mogliśmy wykreować oprawę wizualną - zmiana kolorów, rozmiaru fontów, dodawanie elementów etc.
Ponad 600 000 ludzi tworzy strony za darmo, bez kodowania i przy wsparciu AI. Zobacz, jakie to proste
00’
Social media
Powstanie social mediów zrewolucjonizowało zarówno życie społeczne, media, jak i sposób nawiązywania relacji
…krótko mówiąc zarówno świat “rzeczywisty”, jak i wirtualny.
Na początku nowego tysiąclecia pojawiają się m.in.:
- My Space
Warto też dodać, że z czasem z mediów społecznościowych zaczęliśmy korzystać za pośrednictwem urządzeń mobilnych, co przekłada się też na wagę responsywności tych aplikacji (i innych stron www).
Strony internetowe dla urządzeń mobilnych
Oczywiście wyświetlanie stron internetowych na telefonie było jak najbardziej możliwe, ale widok, jaki otrzymywaliśmy, był ten sam co na komputerze. W związku z tym wszystko miało małą skalę. Aby rozwiązać ten problem, opracowano web design dostosowany do telefonów. Nie należy go mylić z RWD, ponieważ ten drugi, który wszedł w życie, później dostosowuje się do widoku ekranów o wielu formatach (np. na tablet, telewizor etc.).
Obecnie responsywność strony internetowej jest na tyle istotna, że należy do jednego z głównych warunków, jakie powinna spełniać nasza witryna, aby mogła się dobrze wypozycjonować.
10’ i 20’
Projektowanie z nastawieniem na użytkownika
Ta forma projektowania stawia duży nacisk na wygodę użytkownika oraz umiejętność nakierowania go na działania, które pozwolą osiągnąć właścicielowi strony zamierzone cele. UX i UI design odgrywają tu znaczącą rolę. Liczy się zarówno treść, jak i wygląd - stawiamy na balans. Wygląd nie może zaszkodzić samej wygodzie korzystania ze strony, a wartość merytoryczna nie powinna być przytłaczająca i przygotowana tylko i wyłącznie pod pozycjonowanie.
Jeśli chodzi o sam styl to, jak wiemy jest ich wiele, ale w kilku przypadkach to prostota wygrała z dodatkowym efektem np. flat design.
Na stronie awwwards możemy zobaczyć strony wyróżnione za najlepszy web design.
Kreatory stron
Czy kreatory stron również przyczyniły się do rozwoju internetu i web designu? Oczywiście.
Nie da się wyznaczyć jednej daty, w której to projektowanie stron zrewolucjonizowały kreatory stron. Pierwsze zalążki możemy wyróżnić już w latach 90’ kiedy to powstał Mosaic umożliwiający stworzenie prostej witryny bez umiejętności kodowania (w 97’ przestał istnieć). Kolejnym przykładem będzie tu, chociażby Adobe PageMill, czyli narzędzie WYSIWYG (what you see is what you get). Na początku jednak ta forma tworzenia stron nie przyjęła się na szerszą skalę, ponieważ miała wiele niedociągnięć - słabe ładowanie, złe pozycjonowanie w wyszukiwarkach itp. Z czasem jednak narzędzia te zaczęły dorównywać możliwością, jakie mamy, posiadając umiejętność posługiwania się językami wykorzystywanymi w programowaniu.
Co ważniejsze od razu jesteśmy w stanie obserwować efekty naszej pracy, co znacznie ułatwia proces projektowy. Dzięki tej metodzie na rynku pojawiły się coraz to estetyczniejsze platformy, ponieważ za tworzenie web designu "zabrali się" też Ci, którzy mieli dobry zmysł estetyczny, ale nie mogli go wykorzystać z powodu braku umiejętności kodowania.
Co do samego rozwoju internetu i kreatorów stron odpowiedź jest prosta. W kreatorze działającym na zasadzie przeciągnij i upuść, każdy jest w stanie wykonać swoją stronę i opublikować w sieci, a więc tym samym poszerzamy przestrzeń wirtualną.
Jeśli dla kogoś ta podróż była zbyt krótka, warto odwiedzić witrynę web.archive, na której wpisując adres danej strony otrzymamy podgląd do jej wyglądu zarówno z dnia dzisiejszego, jak i z przeszłości. Dzięki temu możemy zobaczyć, jak bardzo się zmieniła na przestrzeni lat.
Web design dziś i jutro
Dzisiaj wygląd stron internetowych jest zróżnicowany. Mamy dużą dowolność. Na dodatek w sieci znajdziemy jeszcze wiele starych egzemplarzy, które nie były “odświeżane od lat”. Jeśli chodzi jednak o obecną stylistykę, to nie jesteśmy w stanie wymienić wszystkich...tak dużo ich jest. Jest to spowodowane m.in. faktem, że obecnie oprócz funkcjonalności i samych treści merytorycznych niezwykle ważny jest też wygląd zewnętrzny. Poza tym każda strona jest inna (blog, landing page, portfolio online itd.), a także może reprezentować inną działalność (branża beauty, dziecięca, bankowość itd.).
W nadawaniu samego charakteru dużą rolę odgrywa kolorystyka. Odpowiednie operowanie nią i wykorzystanie na stronie pozwoli zwrócić uwagę (/wzbudzić zaufanie odbiorcy).
W ostatnich latach animacje na stronie są coraz częściej praktykowane, ale sam minimalizm jak zawsze nie wychodzi z mody. Więcej na temat dowiemy się z artykułu omawiającego najnowsze trendy.
W przyszłości możemy spodziewać się jeszcze większej ilości uproszczeń, więcej interaktywnych elementów oraz najprawdopodobniej wzrost wykorzystywania sztucznej inteligencji.
Podsumowanie
Jak widać długa droga za nami. Rozwój internetu wywarł duży wpływ na życie codzienne, jak i to bardziej “biznesowe”. W związku z tym, że towarzyszy nam on niemalże non stop nie dziwi potrzeba nadania mu bardziej przejrzystej i estetycznej oprawy wizualnej. W ciągu kilkudziesięciu lat web design ewoluował diametralnie, a strony internetowe, z resztą tak samo jak np. telefony stały się bardziej wielofunkcyjne i wielowymiarowe. Nie zamieszczamy już na nich tylko i wyłącznie podstawowych informacji. Platforma www to także portfolio, wizytówka, miejsce do przedstawienia swojej oferty etc.
W WebWave jesteśmy w stanie wykonać stronę, która odpowie na nasze potrzeby i pozwoli we właściwy sposób zareprezentować się w sieci.
Autor: Kaja Rowicka
Popularne artykuły.
Kreator stron www WebWave umożliwia tworzenie stron www z pełną swobodą. Strony internetowe możesz tworzyć zaczynając od czystej karty lub wykorzystując szablony www. Strona www bez kodowania? To łatwe - zacznij już teraz.
contact@webwavecms.com
+48 731 395 898
Porozmawiaj z nami na czacie
Od godziny 08:00 do 24:00
Ta strona została stworzona w kreatorze WebWave.
Znajdziesz nas na:
Kreator WebWave.
Oferta.