Metamorfoza strony internetowej

W tym artykule przeanalizujemy wygląd gotowego serwisu internetowego. Na ruszt weźmiemy istniejący projekt. Projekt został wybrany losowo z miejscowości Karpacz. Jako że to miejscowość turystyczna, weźmiemy serwis internetowy reprezentujący pensjonat. Przeanalizujemy jego wygląd oraz, charakter obiektu i zastanowimy się co nie gra i należy poprawić. Poniżej print screen strony internetowej z Karpacz.

Żródło: Pensjonat Polana w Karpaczu polana.karpacz.pl

Serwis składa się głównie z czterech elementów: lewej kolumny, w kolorze zielonym, baneru strony, w postaci pokazu slajdów złożonych z obrazów, pod nim znajduje się nawigacja, a za nią treść główna serwisu internetowego. Kolorystycznie całość jest spójna, a równowagę kontrastu utrzymuje właśnie zielony sidebar, ale czy prezentowana strona internetowa jest wykorzystuje potencjał obiektu? Możemy to sprawdzić na podstawie zdjęć znajdujących się na stronie WWW pensjonatu.

Pierwszy slajd baneru serwisu WWW, przedstawia budynek pensjonatu z Karpacza. Budynek wygląda na mocno zadbany, dodatkowe wrażenie robi flora go otaczająca. Można z góry założyć, że właściciele dbają o gości oraz pensjonat, który ich przyjmuje. Budynek jest zbudowany w starym górskim stylu, charakterystycznym dla tej miejscowości. Jednak na tle wielu nowych budynków i nie tylko wypada znacznie lepiej. Uznajemy to za cechę, którą należy promować. Sprawdźmy co jest w środku.

Z racji ochrony praw autorskich nie możemy publikować pojedynczych zdjęć. Zamieścimy więc screen shot podstrony z adresem url na którym znajdziecie kompletną galerię.

Źródło: polana.karpacz.pl/pl/noclegi-karpacz-o-nas

Po zdjęciach budynku z zewnątrz widać, że pensjonat nie ma tłoku w sąsiedztwie, wnioskujemy, że okolica jest cicha i spokojna – idealnie. Kolejna cecha godna promocji. Zdjęcie też pokazuje ogrodzenie ciągnące się, najprawdopodobniej wokół obiektu noclegowego na którym jak czytamy w opisie znajduje się kort tenisowy, boisko oraz plac zabawa. Przechodzimy do wnętrza pensjonatu i widzimy wspaniały, przytulny hol ozdobiony kamieniami ze starymi drewnianymi schodami. Całość ma niewątpliwie stary górski klimat. Idąc dalej na piętro widzimy niezwykłą mozaikę wykonaną z kamieni. Kolejne przedstawiają pokoje schludne z lekkim akcentem starego stylu jednak jeszcze z byt lekkim. Dobre wrażenie robi część pełniąca funkcję najprawdopodobniej jadalni. Ostatnie zdjęcia przedstawiają drugą stronę budynku gdzie możemy zobaczyć część ogrodu oraz plac zabaw.

Jak powinna wyglądać strona internetowa dla opisanego pensjonatu z Karpacza? Po zdjęciach wnętrza pensjonatu oraz zdjęciach okolicy widać, że nowoczesnych styl zdecydowanie odpada. Serwis internetowy powinien być nawiązaniem do sielskości oraz tradycji. Pomimo, że pokoje nie do końca oddają ten styl, widać, że właściciel obiektu z noclegami, w takim kierunku zmierza.

Do projektu graficznego użyjemy zdjęć z Depositphotos – niestety nie możemy użyć tych samych, które znajdują się na serwisie internetowym. Będziemy starali się wybrać coś o podobnym charakterze.

Zacznijmy od samej formy, kształtu strony internetowej dla pensjonatu z Karpacza. Obecna strona internetowa ma szerokość 900 pikseli. Obecna średnia szerokość urządzeń to 1366 pikseli, jednak dane obejmują również urządzenia mobilne. Większość nowszych komputerów pracuje na rozdzielczości 1920 pikseli. Sprawia to że na stronie internetowej obranej za przykład marnuje się większość przestrzeni.

Oczywiście fakt ten nie znaczy, że mamy zaraz zasłonić cały monitor treścią, obecnie główną treść serwisów internetowych zamyka się w szerokości ok 1200 pikseli. Szatę graficzną dobrze jest utrzymywać, w maksymalnych rozmiarach, lepiej oddziałuje to na wzrokowców.

Serwis internetowy z Karpacza nie ma tak naprawdę logotypu, który jest niezbędny do kreowania marki. Tak, nawet pensjonat z Karkonoszy powinien dbać o markę, starać się by być rozpoznawalnym za pomocą prostego znaczka. Nawigację główną przeniesiemy na samą górę, tam jest jej domyślne miejsce, do tego są przyzwyczajeni użytkownicy internetu. Z lewego sidebar'u zrezygnujemy, a sam kontrast postaramy się uzyskać klimatowymi grafikami, podnoszącymi walory wizualne serwisu.

Jako że obiekt jest koloru żółtego z elementami bardzo ciemnego brązu. Całość serwisu internetowego będziemy starali się utrzymać w podobnej tonacji. Może zachód słońca? Ok dom w kolorze żółty został znaleziony. O to nasz odpowiednik.

Oczywiście obraz należy nieco podrasować aby pasował do naszego zamierzonego stylu. Obraz jest dobrze naświetlony. Otoczenie jest odpowiednio nasycone zielenią. Zdjęcia reprezentujące pensjonaty górskie mają o tyle dobrze, że mogą umieszczać atrakcyjne zdjęcia wykonane w dwóch porach roku: latem lub zimą. Nie dobrym pomysłem jest zamieszczanie zdjęć wykonanych zwłaszcza późną jesienią lub wczesną wiosną. Przejdziemy teraz do stworzenia baneru dla strony internetowej, na podstawie wybranego budynku. Po paru modyfikacja baner strony WWW jest gotowy. W tym przypadku będzie wyglądał tak.

Szerokości oraz wysokości zostały dopasowane do naszych potrzeb. Zostało też nałożonych kilka efektów świetlnych. Teraz czas na nagłówek strony wraz z logiem. Logo wykonamy szybko na „kolanie”. Efekt zmian:

W takich przypadkach stosuje się nagłówek skalowany, który, po zjechaniu nieco w dół strony zmniejsza się zasłaniając treść, w mniejszym stopniu. Do top strony warto również dorzucić numer telefonu oraz adres e-mail. Na samym banerze warto zawrzeć jakieś motto firmowe lub krótki slogan reklamowy.

I o to top strony internetowej dla pięknego pensjonatu w miejscowości Karpacz, został utworzony.

Pozostaje nam zaadaptowanie zielonego sidebar'u oraz treści na stronie głównej pensjonatu z Karpacza. Aby treści z zielonej przestrzeni były odpowiednio widoczne i aby nie trzeba było przewijać strony internetowej, wykonamy małą roszadę. Zrezygnujemy jednak z hasła promującego serwis na rzecz danych adresowych. W przypadku hoteli, pensjonatów czy innych obiektów noclegowych są one bardzo ważne. Po małych modyfikacjach nasz nagłówek strony z banerem będzie wyglądał tak.

Teraz nawigację i najważniejsze dane mamy na samej górze w ładnej oprawie graficznej. Możemy pozbyć się zielonego elementu. Pozostała nam główna treść strony która jest dość rozbudowana. To dobrze – pewne elementy tekstu zostały pogrubione. Zabieg ten na pewno miał na celu polepszenie wyników pozycjonowania strony internetowej. Jako że treści również nie możemy kopiować z powodów praw autorskich oraz z powodu możliwości pogorszenia pozycji strony w wynikach wyszukiwania. Zastosujemy w projekcie słynny testowy tekst „Lorem Ipsum...”. Pod częścią baneru umieścimy tylko nawiązanie do poszczególnych działów, jest to świetny sposób na zwiększenie liczby nagłówków na stronie internetowej, oraz na estetyczne zamieszczenie dodatkowych treści. Zamieścimy trzy bloki. Każdy z nich będzie miał zdjęcie oraz opis. Do każdego z nich dodatkowo można dodać przycisk więcej. Po blokami dodamy ładne tło aby całość tworzyła spójną artystyczną kompozycję. Bloki zatytułujemy kolejno: Pensjonat, Okolica, Karpacz. Czyli krótko od najbliższego otoczenia do najodleglejszego. Efekt pracy...

Pozostaje nam zamieszczenie rozbudowanej głównej treści. Tą wyjątkowo umieścimy na jasnym czytelnym tle tak aby użytkownik zapoznając się z nią nie męczył się.

Wykorzystamy dwa obrazy.

oraz

Aby zachować ostrość kompozycji na prawą stronę damy osobę stojącą na skałach. Nie będziemy rozmywać całego obrazu. Wytniemy jedynie pierwszy plan. Drugi obraz podłożymy pod treść oraz obraz przedstawiający osobę na skałach. Dzięki temu uzyskamy ciekawe graficznie tło, nie przeszkadzające w zapoznaniu się z treściami. Efekt...

Nasza nowa wersja strony internetowej dla pensjonatu z Karpacza jest prawie gotowa. Wszystkie elementy ze starszej wersji zostały przeniesione na nową wersję. Ściągnęliśmy ograniczenia szerokości, dodaliśmy więcej grafik, streszczenia działów, zwiększając tym sposobem zasobność w treści stronę główną. Ostatnimi elementami jaki jeszcze dodamy to mapa Google oraz nawigacja w stopce strony.

Serwis oczywiście można rozszerzyć o prezentację najnowszych zdjęć na stronie głównej czy o możliwość rezerwacji. Jednak cel przedsięwzięcia był inny, mianowicie sama graficzna odnowa serwisu internetowego oraz dopasowanie go do współczesnych realiów webowych. Całość przedstawia się tak.

Jeżeli jednak chcielibyśmy zwiększyć kontrast w głąb strony, treść główną możemy oprzeć na ostrym tle, uprzednio gładząc ją na białej, półprzezroczystej. Tło będzie nawiązywało do baneru, a ostre i stonowane elementy strony internetowej będą występować na przemian, zachowując przy tym równowagę dla całej kompozycji.

Która wersja lepsza oceńcie sami.

Artykuł znajdywany w Google na hasłach:

• Tworzenie stron WWW Karpacz
• Strony internetowe Karpacz
• Strona internetowa dla pensjonatu
• Tworzenie stron internetowych dla pensjonatów