Konstrukcja niniejszej strony oparta jest o CMS Joomla, Bootsrap 3, Masonry.js, stanowi ich programistyczną integracje. Wykorzystanie tych rozwiązań technologicznych związane jest z dążeniem do tzw.. responsywności, czyli do tego aby strona automatycznie dostosowywała się do ekranów o różnej wielkości.

Bootstrap będący w zasadzie od wersji trzeciej CMS Joomla! elementem składowym zapewnia ogólny szkielet wspomnianej responsywności(siatka dwunastokolumnowa) i został w tym wpadku wkomponowany zarówno w sam szablon, ale także na zasadzie nadpisywania w pliki modułu menu, oraz komponentu. Jednakże ma on w sobie istotne ograniczenie w przypadku stosowania tzw. siatki układów wielokolumnowych, czyli takich jak ten widoczny na stronie głównej niniejszej strony polegające na tym, ze sam Bootsrap potrafi układać bezproblemowo jedynie elementy takich kolumn w przypadku, gdy maja one jednolitą wysokość. W przypadku różnic w wysokości elementów powstają puste przestrzenie, które rażą niemal każde poczucie estetyki. Aby temu zaradzić zaadaptowana została biblioteka Javascript o nazwie Masonry, która komasuje obiekty wchodzące w skład układu wielokolumnowego, w efekcie ograniczenie Bootsrap jest przełamywane i dodatkowo zmiana rozmieszczenia rozmieszczenie elementów wzbogacona jest o animację. Dzięki takiemu rozwiązaniu za sprawą Bootstrap Joomla zyskuje na responsywności, a ograniczenia tkwiące w Bootrspa są korygowane przez bibliotekę Masonry.

Poza tymi rozwiązaniami strona wykorzystuje animowane przejścia pomiędzy stronami (efekt rotacji) – które odbywają się z wykorzystaniem pluginu jQuery o nazwie Animsition oraz pluginu scrollToTop, który umożliwia płynne przejście do góry strony poprzez klikniecie ikony pojawiającej się w prawym dolnym narożniku okna w przypadku przewinięcia strony w dołu.

Kolorystyka strony wynika ze wstępnego założenia prezentacji artykułów w czterech kolumnach na widoku zmaksymalizowanym. Taki punkt wyjścia oznaczał, ze w przypadku zróżnicowania kolorystycznego grafik we wprowadzeniach artykułów potrzebne jest tło, które „wytrzyma” tego rodzaju zróżnicowanie. Alternatywą byłoby w tym wypadku koloryzowanie fotografii lub ewentualnie totalne odwrócenie kolorystyki strony – czarne tło itp. Ostatecznie wybór padł na białe tło elementów w kolumnach przeplatane szarością, co zostało ustalone za pomocą jQuery. Później został ustalony kolor stopki na jasno odcień szarego, co zapewnia lekkie, ale zawsze jakieś, odcięcie się od białego tła całej strony. Później ustalona została kolorystyka prezentacji graficznej – koloryzacja odcieniem niebieskiego wszystkich fotografii. Następnie została dopasowana kolorystyka menu tak, aby komponowało się przede wszystkim z ową prezentacją fotograficzną i nadawało „cieplejszy” charakter samej całej witrynie internetowej. W między czasie powstało nowe logo, totalnie zrywające z dawniejszym. Aby tekstowi wprowadzenia widocznemu na stronie głównej na prawo od prezentacji fotograficznej skrócić długość linii (wygoda czytania, zachowanie założonej wielkości czcionki) wprowadziłem blok o szarym kolorze pełniący rolę swoistego dopełnienia.

Struktura strony zmienia się w momencie przejścia ze strony głównej do jakiegoś tekstu – prezentacja fotograficzna (slideshow), wprowadzenie, blok dopełniający znikają, a w miejsce układu kolumnowego ze strony głównej pojawia się artykuł zawierający niekiedy przed tytułem ilustracje wprowadzającą, co wymagało niewielkiej ingerencji w pliki komponentu CMS Joomla! . W efekcie czytelnik artykułu przechodzi do podstrony gdzie jest menu, artykuł i stopka, co w mojej opinii sprzyja koncentracji na treści.