Odnawianie stron internetowych

Chciałbym pokazać w jaki sposób można łatwo i szybko odnowić wygląd i funkcjonalność stron internetowych. Tworzenie strony od nowa to stosunkowo duży wydatek. Jeżeli myślimy o nowej stronie internetowej mimo, że nasza aktualna publikacja została przygotowana według standardów i spełnia swoje zadanie to zwykle wymaga jedynie odświeżenia lub jak kto woli modernizacji.

Aktualizacja może dotyczyć wyglądu oraz funkcjonalności. Niektóre można wykonać szybko, np. dodanie przycisków portali społecznościowych zajmie nam parę chwil. O tym jakie cechy mają typowo nowoczesne strony www napisałem w osobnym artykule: Nowoczesne strony internetowe. Zatem, na co zwrócić uwagę?

Design

Wygląd najwyraźniej zdradza nam wiek strony tak jak to bywa z różnymi innymi rzeczami. W tej sferze mamy też największe pole do popisu. Na pierwszy ogień niech pójdzie kolorystyka.

Aktualnie we wzornictwie internetowym dominują złamane, delikatne kolory i myślę, że tak będzie jeszcze jakiś czas. Chcąc nadać stronie uniwersalnego i ponadczasowego wyrazu stosujmy dużo bieli i odcienie szarości. Często staram się wszystkich do nich przekonywać. Jaskrawe i czyste kolory budzą skojarzenia z domyślnym formatowaniem na stronach internetowych, który się znudził i po prostu nie zachęca. Mam tutaj na myśli np. niebieskie linki.

To co zauważalnie skończyło swój termin przydatności to gęsto stosowane gradienty. Nie są cechą tzw. flat designu stąd od razu nasuwają nam na myśl lata przed 2010 rokiem kiedy to wręcz triumfowały. To samo tyczy się wyraźnych cieni, obramowań i zaokrąglonych krawędzi stosowanych wtedy bez umiaru.

Modne kolory

Nowe podejście do projektowania związane z elastycznymi layoutami i urządzeniami dotykowymi trochę wymusiło dodanie do kompozycji większych przestrzeni. Pozytywnie wpływa to na wygodę przeglądania i zwiększa możliwości emfazy różnych elementów na stronie internetowej. Nie trzeba stosować denerwujących pop-up’ów aby przekazać coś ważnego.

Typografia czyli to jak posługujemy się literami też ma ogromny wpływ na odbiór prezentowanej treści. Trendy w używaniu czcionek ciągle ulegają ewolucji i warto od czasu do czasu odświeżyć zastosowane style na naszej stronie. Możemy zmienić rozmiary, kroje, kolory, ciężar i rozmieszczenie napisów na bardziej nowoczesne w zaledwie kilka minut.

Szerokość robocza stron ulega stopniowemu powiększaniu. O ile kiedyś zawartość strony miała 960px to teraz zaczyna dominować rozmiar 1170px a wszystko z powodu coraz bardziej szczegółowych ekranów jakimi się posługujemy nawet w urządzeniach mobilnych.

Flash – jeżeli jakaś strona zawiera tego typu elementy to możemy mieć pewność, że mamy do czynienia ze stosunkowo starym dziełem. Flash’a już nikt poważny nie używa i ma to same zalety: mniejsze zużycie transferu, mniejsze zużycie mocy obliczeniowej urządzenia na którym przeglądamy stronę, większą użyteczność takich aplikacji oraz lepsze możliwości wyszukiwania treści w Internecie.

Przejścia i animacje CSS3 – w przeciwieństwie do wyżej poruszanego Flash’a, nowy standard arkuszy stylów CSS3 daje nam nowe możliwości w zakresie robienia efektownych przejść i animacji. Stosowane bez przesady dodadzą świeżości i uatrakcyjnią wygląd naszej starej, dobrej strony. Szczególnie ciekawym rozwiązaniem jest funkcja transition, która pozwala np. na płynną animację elementów dla których przewidziano styl hover oraz animate.

Przezroczystość kiedyś nie była stosowana stąd jest częściej widywana na nieco nowszych stronach internetowych. Stosowanie opacity lub trybu rgba z wyczuciem wraz ze stałym tłem background-position: fixed doda stronie bardzo nowoczesnego stylu.

Funkcjonalności

Datowanie strony możemy oprzeć o funkcjonalności jakie się na niej znajdują. Od paru lat na stronach dominują przciski typu Share oraz inne ciekawe i interaktywne elementy. Pokażę co możemy zrobić w tej kwestii przy unowocześnianiu stron internetowych.

Mapka to w zasadzie żadna nowość, jednak nadal spotykamy strony, które jej nie mają lub mają jej substytut w postaci zdjęcia. Użyjmy aplikacji Mapy Google, dzięki której z łatwością umieścimy dopasowaną i interaktywną mapkę w zaledwie parę minut.

Google Maps

Share – przyciski Share, +1, Lubię to, Udostępnij i tak dalej w dość krótkim czasie zdominowały różnego rodzaju witryny. Można je po kolei dodawać dzięki specjalnym skryptom przygotowanym przez wydawców. Pomocnym narzędziem, które ułatwi i automatycznie rozmieści tego typu przyciski i funkcje będzie darmowy AddThis.

 

AddThis

Ta pomysłowa aplikacja rozmieści i zorganizuje rozszerzenia społecznościowe a co najważniejsze zaoszczędzi nam sporo pracy i będzie edytowalna w przyszłości. Dodatkowym atutem tego rozwiązania jest możliwość sprawdzenia statystyk aktywności użytkowników.

Podsumowanie

Web design ciągle się rozwija i ewoluuje z tego powodu strony w mgnieniu oka tracą świeżość. Dzięki paru sztuczkom możemy jednak przywrócić ich świetność i nie zawsze musi się to wiązać z ogromem pracy. Oczywiście, przeróbka layout’u na responsive będzie czasochłonna jednak dodanie przycisków share, zmiana kolorów i unowocześnienie czcionek nie powinno sprawić nikomu trudności. Zobacz jak udało mi się odnowić strony internetowe w ubiegłym roku: Web Metamorfozy 2014. Odnowienie strony może dotyczyć także aspektów technicznych, o tym na co zwrócić uwagę i co warto zawsze udoskonalić piszę w artykule Optymalizacja stron www.

Odnawianie stron internetowych
4.53 (90.5%) głosów: 40