FlatDesign - Płaskie jest ładne!
Jeszcze do niedawna bardzo modne było wykonywanie elementów graficznych strony tak aby naśladowały rzeczywiste obiekty (np. trójwymiarowe przyciski). Aktualnie ustępuje to miejsca prezentacji treści w sposób prosty i płaski. Trendy w projektowaniu, wyznaczane przez takich gigantów, jak np. Google, dążą do maksymalnego usunięcia zbędnych elementów, skupiając się głównie na operowaniu kolorem oraz typografią. W ten sposób ułatwiony zostaje przekaz strony a elementy są bardziej widoczne.
Strona bez podstron tzw one page - wszystko w jednym miejscu!
Jeszcze do niedawna nikt nie wyobrażał sobie strony internetowej nie zawierającej dodatkowych podstron. Obecnie bardzo popularnym rozwiązaniem stał się tzw. one-page, czyli forma bardzo długiej strony internetowej, której nawigacja nie zakłada przejść pomiędzy kolejnymi zakładkami, ale skupia się bardziej na przewijaniu. Użytkownik w obrębie jednej rozbudowanej podstrony poznaje wszystkie treści danego serwisu.
Responsive Web Design - Strona responsywna która zawsze dobrze wygląda!
Bardzo szybko rośnie liczba osób, które korzystają z Internetu na urządzeniach mobilnych, takich jak smartphony i tablety. Duża różnorodność rozmiarów ekranów, na których oglądana jest Twoja strona internetowa sprawia, że warto zadbać o rozwiązanie, które zapewni, że będzie ona wyglądała dobrze na wyświetlaczach o różnej przekątnej. Responsive Web Design to koncepcja, która zakłada alternatywny layout strony w zależności od tego, na jakim urządzeniu jest ona uruchomiana.
Dzięki temu wygląd dostosowuje się automatycznie do rozmiaru okna przeglądarki, tak aby zapewnić maksymalną czytelność i użyteczność.
Google Fonts - odchodzimy od standardowych krojów pisma!
Początki Internetu nie rozpieszczały miłośników typografii. Przez wiele lat możliwości zastosowania na stronach www różnych krojów pisma były bardzo ograniczone, obecnie jednak ta sytuacja całkowicie się odmieniła. Dzięki takim usługom, jak np. typekit, czy Google Webfonts możemy na swoich stronach wykorzystywać rozmaite fonty, bez ryzyka tego, że będą wyświetlały się niepoprawnie na określonym urządzeniu. Internetowa typografia przeżywa prawdziwy renesans.
Duże jest piękne - Strony przystosowane do rozdzielczości 800x600 pikseli to już przeszłość!
Minęły czasy ciasnych, upchanych treścią stron z małym i nieczytelnym tekstem. Ekrany monitorów mają coraz większe rodzielczości i obszary. Obecnie największą popularnością cieszą się duże rozmiary. Duże zdjęcia, duża typografia, wyraźny i mocny komunikat zdecydowanie łatwiej zaskarbiają zainteresowanie odbiorców.
Opowiadaj obrazami za pomocą infografik!
To, że jeden obraz jest warty tysiąc słów, to znana od dawna prawda, ale dopiero stosunkowo niedawno zaczęła w pełni funkcjonować w Internecie. Konsumpcja treści bardzo przyspieszyła, a wraz z nią wzrosła konieczność szybkiego przekazywania informacji. Panuje moda na infografiki oraz maksymalną wizualizację informacji. Popularne jest operowanie ikonami, obrazami, porównaniami i graficznymi metaforami.
Minimalizm jest ciągle w modzie. Większość marek dąży do uproszczenia swojego przekazu, także w zakresie stron internetowych. Tyczy się to zarówno architektury informacji, bogactwa oferowanych treści, jak i warstwy stricte graficznej. Badania pokazują, że użytkownicy są coraz bardziej niecierpliwi i wybredni, trudno zaskarbić sobie ich uwagę. Nie komplikujmy komunikacji i skupmy się na pokazaniu najważniejszych elementów w sposób możliwie prosty i czytelny.
Poniżej znajduje się efekt dość nietypowej nawigacji na stronie (menu podstron) polega on na tzw "odwracaniu" zawartości. Wykonanie jest banalnie proste i wymaga jedynie kilku styli CSS oraz struktury menu w HTML.
Wstawki z animacjami wykonanymi we Flashu? Całe strony we flashu? Nie dziękuję... Nawet kosztem wykonania "uboższej" animacji proponuję zastosowanie technik w CSS3, poniżej próbka możliwości animacji 3D…
W dzisiejszych czasach oraz dostępnych łączach internetowych... raczej zbędne, ale na pewno zaciekawi :) Zastosować można np przy wczytywaniu jakiegoś "naprawdę sporego" zdjęcia, lub całej strony. Pre-loader podczas…
Czasami zachodzi konieczność wstawienia znaku "specjalnego" w łańcuchu. Przykładowo "enter" czyli chr(13), lub potrzebujemy wygenerować pseudolosowy ciąg znaków [a-z] czyli od chr(97) do chr(122), kto by…
Poniżej znajduje się efekt "koloryzacji" zdjęcia po najechaniu na nie myszką. Efekt ten został uzyskany jedynie za pomocą styli CSS. Zaledwie kilka linijek kodu CSS ożywi nam obraz całej strony, a przy tym bez…
Niejednokrotnie można zauważyć że na stronach internetowych przyciski wraz z ikonką zmieniają np swój kolor, są obracane lub powiększane bez utraty swojej jakości. Jak to jest możliwe? Ikonki te nie są...
Jeśli chce się zmienić wygląd jakiegoś elementu HTML, trzeba wskazać - którego. Do tego właśnie służą selektory. Jest wiele różnych selektorów, można stosować ich kombinacje - wszystko po to, aby dało się…
Jeszcze do niedawna rozpoczęcie prac nad wykonaniem strony internetowej polegało wpierw na wykonaniu projektu graficznego. Następnie projekt ten był cięty na kawałki i w formie tabelki wyświetlany na stronie.