Webdev • Grafika • AI/ML • Online apps • Inspiracje • Materiały • Ciekawostki • Rozrywka hermetyczna
Pamiętacie Silk? To taka zabawka kolorową plazmą.
Teraz czasy się trochę zmieniły, mamy do dyspozycji zaawansowany silnik graficzny w przeglądarkach – WebGL. I zaczyna się „dziać”. Jedną z zabawek o której warto wspomnieć, jest Fluid Experiment. Zasadniczo to też zabawka, ale się animuje i zachowuje jak płyn. Powiadam Wam – power drzemie w waszych browserach! :)
Kolejne proste, łatwe i przydatne narzędzie – CSS Triangle Generator – do tworzenia prostych trójkatów z borderów CSS’owych. Osobiście używam często, działa wysmienicie. Warto znać.
CanvasQuery jest biblioteką dla elementu HTML5 ‚Canvas’, która pozwala na stosowanie z jQuery. Umożliwia stosowanie różnych metod manipulacji na grafikach, przeznaczonych co prawda dla developerów gier, ale moze webdesignerzy też coś z tym zrobią… Można na przykład w locie zapodać efekt grafiki z C64 :)
Na stronie CanvasQuery znajdziemy full-wypas rozpiskę, jak stosować tą sztuczkę, gdzie stosować, oraz wdrożenia popularnych efektów.
Fajna sprawa – zerknij na demo, aby się przekonać. ;)
Wiem że zaczynam być nudny w tym temacie, ale to trzeba zobaczyć, aby wyobrazić sobie możliwości. Google opracował prostą prezentację ukazującą wszystkie podstawowe możliwości animacji i ruchu realizowanego za pomocą HTML5, CSS3 (no i JS, SVG, WebGL). I (prawie) wszystko staje się możliwe… tylko czekać na jakiś profesjonalny edytor takich animacji…
Krótko:
Jeśli jeszcze nie wiesz, jakie siły drzemią w HTML5, WebGL i podobnych, najnowszych technologiach – kliknij w obrazek obok. Gra jest prosta, ale daje pojęcie o możliwościach naszych przeglądarek. Daje pojęcie, dokąd ten świat zmierza pod względem informatycznym. Zapraszam do zagrania w HexGL.
Nowa generacja języka CSS daje nam bardzo dużo możliwości – między innymi generowanie różnych kształtów boksów za pomocą jedynie kodu CSS. Możliwości jest naprawdę wiele – od prostokątów, rombów, równoległoboków, poprzez koła, elipsy, różnorakie trójkąty, wielokąty, gwiazdy, do kształtu kropli, symbolu nieskończoności lub innych (nawet wymyślnych) kształtów.
Dzięki tym (i innym nowym) możliwościom nowego CSS (i HTML5) – tworzenie stron staje się bardziej programowaniem niż projektowaniem. Ale to temat na inny wpis :)
Wracając do tematu: Jak na razie znalazłem dwa miejsca gdzie opisane są przykłady tworzenia nietypowych kształtów. Jedno z nich to odpowiednia sekcja niezawodnego kursu HTML i CSS Pawła Wimmera. Drugie źródło, o nieco innej formie i podejściu – to The Shapes of CSS – Wpis na stronie css-tricks.com. Treść obu tych źródeł każdy szanujący się webmajster powinien sobie przyswoić w stopniu znacznym. ;)
<a href=”http://www.phoboslab simvastatin price.org/biolab/”>
Jeszcze jedna zaległość, którą chciałem opublikować: Grywalna i nawet wciągająca gra, napisana w całości w HTML5 (plus javascript oczywiście). Może szaef Apple’a ma trochę racji, mówiąc że flash nie będzie już potrzebny… Zapraszam do gry :)
Ciekawy sposób na przedstawienie elementów HTML5 – w postaci układu okresowego pierwiastków tagów zastosowano na stronie joshduck.com/periodic-table.html. Tagi podzielone są na kategorie, a każdy element ma swój opis – widoczny po kliknięciu. Podoba mi się to, świetnie zrobione. :)
Można także przetestować dowolną stronę, dzięki czemu podświetlone zostaną wszystkie elementy html5 na niej użyte.
Znalezione na Wykopie, jak zwykle podczas porannej poniedziałkowej kawy :)
Jestem sceptycznie nastawiony do używania nowych języków HTML5 i CSS3. Moim zdaniem przeskok na nowe wersje może się skutecznie dokonać tylko pod dwoma warunkami:
Pierwszy punkt jest już realizowany. Ku memu zdziwieniu, misja zastąpienia starych przeglądarek nowymi w ciągu kilku następnych miesięcy/lat się chyba powiedzie.
Mam jednak wątpliwości co do punktu drugiego. Dlaczego? Już wyjaśniam:
Weźmy taki XHTML. Pomimo przejrzystości kodu i semantycznej konstrukcji, która teoretycznie powinna się programistom i developerom bardzo spodobać (jeśli porównać do HTML4), XHTML po prostu nie przyjął się. Ludzie (w tym często i ja) piszą w starym dobrym HTML4, który wybacza błędy i jest dobrze znany.
Ale nie tylko – bo myślę że mamy tu do czynienia z czymś co nazywam „syndromem mp3„. Empetrójki są dalej królami w swojej branży, pomimo, że ten format zapisu dźwięków jest już bardzo stary (ma już 19 lat!), i pomimo tego, że od dawna istnieją metody po prostu lepsze pod wszystkimi względami. I obawiam się, że z HTML4 może być tak samo. I z CSS3.
HTML5 i CSS3 to semantyka i prostota, mnóstwo nowych możliwości których tak bardzo nam brakuje (np. audio i wideo w kodzie, łatwe wektory, obracanie obiektów, zaokrąglanie narożników, cienie, wielokrotne tła itp. – jest tego bardzo dużo) i których brak łataliśmy zaślepkami graficznymi i wielokrotnymi divami. Ale HTML5 i CSS3 to nowe tagi, nowy sposób myślenia, nowe podejście. Ludzie są z natury leniwi i nie lubią uczyć się nowych rzeczy, szczególnie wtedy gdy nie muszą. Czy nowe technologie się przyjmą? Pomimo wysiłków marketingowych społeczności webmasterskich – pewnie przyjmą się nieprędko. Nie mówiąc już o wyparciu flasha.
Aby dopełnić obrazu i dać odczuć o co chodzi osobom, które o tych nowych technologiach mają blade pojęcie, dwa linki:
html5demos.com – dużo demonstracji HTML5
css3please.com – piaskownica, w której można potestować nowości w CSS3.
…i, dla równowagi:
Poradnik krytyka HTML5 u Pornela (podejście nieco bardziej techniczne)
Fajna infografika (kliknij aby powiększyć).
