Textová podoba smlouvy Smlouva č. 9304555: Smlouva o dílo - Tvorba a správa webových stránek pro projekt

                        Příloha č. 1 smlouvy o dílo
Technická specifikace
Technická specifikace webového projektu:
Národní muzeum v přírodě

1.	Technická specifikace webových stránek Národní muzeum v přírodě	1
1.1.	Grafické požadavky………………………………………………………………………………………………………………………………………………………………………………………1
1.2.	Základní funkcionality a moduly redakčního systému	1
1.3.	Specifikace struktury a obsahu internetové prezentace	2
1.4.	Ostatní technické požadavky	2
1.5.	Použité technologie	2
1.6.	Webhosting	3
1.7.	Podpora a správa webů	3
1.8.	Ostatní	3
2.	Wireframe webu	4
2.1.	Rozcestník – web Národní muzeum v přírodě	4
2.2.	Domácí stránka	5
2.2.1.	Informace, které se propisují na všechny stránky	5
2.2.2.	Model domácí stránky, varianta 1 – bez videa	5
2.2.3.	Model domácí stránky, varianta 2 – ilustrativní video	6
2.3.	Výpis akcí	7
2.4.	Detail akce	8
2.5.	Přehled aktuálních informací	9
2.6.	Detail článku	10
2.7.	Informace pro návštěvníky	11
2.8.	Výpis prohlídkových okruhů	12
2.9.	Detail prohlídkového okruhu	13
2.10.	Textová stránka	14
2.11.	Textová stránka bez přiřazených informací v pravém bloku	15
2.12.	Programy pro školy	16
2.13.	E-shop – přehled produktů	17
2.14.	Detail produktu	18
2.15.	Košík	19
2.16.	Kontaktní stránka	20

1. Technická specifikace webových stránek Národní muzeum v přírodě
Projekt je určen pro nově vznikající instituci Národní muzeum v přírodě, která zastřešuje 4 muzea v přírodě
Výstupem webového projektu bude 5 následujících webových stránek:
1. Národní muzeum v přírodě – zastřešující instituce, rozcestník na jednotlivá muzea
2. Valašské muzeum v přírodě 
3. Muzeum v přírodě Zubrnice 
4. Hanácké muzeum v přírodě 
5. Muzeum v přírodě Vysočina  
Jednotlivé webové stránky budou vycházet ze stejné šablony (mimo rozcestník) a z budoucích webů by mělo být patrné, že to jsou objekty shrnuté pod jednou zastřešující institucí (Národní muzeum v přírodě). 
Grafické požadavky
· Grafika webových projektů bude vycházet z nově vytvořeného vizuálního stylu instituce (logo subjektů a řešení grafických prvků) – vizuální styl bude předložen do 2 měsíců od uzavření smlouvy
· Rozlišení webový stránek: Webové stránky budou responzivní se základním rozlišením 1260 px na šířku
· Grafické prvky se budou v maximu možných případů nahrávat ve dvojnásobném rozlišení kvůli korektnímu zobrazení na retina displejích.
· Tiskový výstup obsahu na papír formátu A4. Čistý, bez navigačních prvků webu atd.

Základní funkcionality a moduly redakčního systému
· Modul pro editaci domácí stránky
· Vlastní stránka se specifickými funkcionalitami popsanými v kapitole 3. 1.
· Modul pro tvorbu textových stránek
· Modul akce
· Modul pro výpis prohlídkových okruhů a detail prohlídkových okruhů
· Modul pro doprovodné programy(rezervační systém)
· Modul aktualit
· E-shop
· Intranet
· Sekce pouze pro přihlášené uživatele.
· Uživatelé se mohou registrovat, ale podléhají schválení administrátorem.
· Po přihlášení vidí uživatelé strukturu webu pouze pro přihlášené.
· V Intranetu je možné využít všech modulů webu pro návštěvníky.
· Modul jazykových verzí
· Systém bude umožnovat minimálně 5 jazykových verzí (CZ, RU, EN, DE a PL)
· Jazykové verze budou na sobě nezávislé (nebudou k dispozici přesné verze webu). 
· Modul pro správu formulářů
· Možnost exportu formulářů v CSV
· Možnost definice vlastních polí ve formulářích
· Možnost přidávání formulářů k libovolné stránce webu a směřování na e-maily
· Definice potvrzujícího e-mailu po odeslání formuláře
· Modul pro správu administrátorů a rolí
· Modul pro přihlašování k newsletteru
· Možnost napojení přes API k aplikaci na rozesílání newsletterů (bude definováno).
Specifikace struktury a obsahu internetové prezentace
Obsah webové prezentace bude vycházet ze stávajících webů definovaných v úvodu.
1. Rozcestník Národní muzea v přírodě bude jednou stránkou s obecným popisem instituce, odkazy na jednotlivá muzea s automaticky generovanými informacemi a případným odkazem na intranet, který bude mít vlastní strukturu zobrazitelnou pouze pro přihlášené uživatele.
2. Weby jednotlivých muzeí budou mít rozvětvenou strukturu s až 4 podúrovněmi. Základní strukturu budou tvořit tyto sekce:
a. Akce – výpis časových programů pro návštěvníky.
b. Informace pro návštěvníky – obecné informace o muzeu a prezentace jednotlivých okruhů.
c. O muzeu – informace technického charakteru i informace pro odborníky.
d. Aktuálně – aktuální informace i fotogalerie s možností filtrování.
e. E-shop – možnost nákupu předmětů nabízených muzeem.
f. Kontakt – kontaktní informace na dané muzeum.
Ostatní technické požadavky
· Přesměrování aktuálních URL adres – všechny stránky budou přesměrovány, pokud budou na nové URL adrese. Nebude-li existovat stejná stránka, budou přesměrovány na nejpodobnější.
· Data budou vkládána do administrace strukturovaně tak, aby je bylo možné generovat(např. xml soubory). Strukturovaně budou zadávána minimálně tato data:
· Vstupné
· Otevírací doba
· Adresy
· Kontakty na zaměstnance
· Propojení rozcestníku s weby jednotlivých muzeí – na rozcestník se budou automaticky propisovat informace o otevírací době muzeí a v administraci vybrané akce.
· Zadavatel požaduje umožnění kompletní či maximální možné editace obsahu webu z administrace bez součinnosti ze strany dodavatele.
· Editor obsahu stránek a dílčích obsahových bloků, který bude k dispozici administrátorům, musí umožňovat jak editaci ve WYSIWYG režimu, tak editaci v čistém HTML. Mezi oběma režimy půjde libovolně přepínat a vizuální editor bude generovat plně transparentní a standardní HTML kód.
· Funkcionalita automatického ukládání konceptu editovaného obsahu a veškeré provedené změny se budou ukládat v archivu verzí. Žádná změna stránky se nebude publikovat bez výslovného příkazu/povolení administrátora a kdykoli se bude možné vrátit k libovolné archivované verzi obsahu.
· Editor umožní naplánovat čas publikování a čas odpublikování obsahu stránek.
· Editor umožní vkládání všech externích objektů (fotek, map, videí) do textu webu při zachování jejich plné responzivity.
· Možnost nezávislé editace title a description na všech stránkách webu.
· Automatické generování xml sitemap, zvláštní pro každou jazykovou mutaci.
· Automatické generování schematických informací dle schema.org
· Napojení na Google Analytics, nastavení cílů a konverzí, odesílání stránek 404 do Google Analytics.
· Nasazení konverzních kódů Facebook.
· Optimalizace datové velikosti fotografií a videí.
· Články, akce, doprovodné programy, prohlídkové okruhy a produkty v e-shopu bude možné sdílet na sociální sítě (minimálně Facebook). Z tohoto důvodu bude budou mít stránky validně definovány OG data (více zde: https://developers.facebook.com/docs/sharing/webmasters/).
· Web bude mít možnost editace odkazů pro sdílení na sociálních sítích (Facebook, Instagram, Youtube) s možností zapnutí a vypnutí v administraci.
· Youtube videa budou do stránek vkládány včetně přehrávače(bude přizpůsobovat velikost videa podle rozlišení), uživatelsky příjemným způsobem.
· Na jakoukoliv textovou stránku bude možné přidat fotografii z webové kamery. Systém bude automaticky načítat po 15 sekundách nový záběr (nová fotografie se načítá až po znovunačtení stránky).
· Fulltextové vyhledávání
· Zadavatel bude schopen sám vytvářet uživatelské účty, včetně přístupových práv zápisu/čtení jednotlivých obsahů webu
· Optimalizace pro vyhledávače SEO
Použité technologie
Požadujeme, aby na realizaci front endu byly použity standardizované technologie vykazující plnou přístupnost, dostatečnou kompatibilitu se současnými zařízeními a maximální morální životnost. Jako optimální řešení se nám jeví použití zpětně kompatibilního HTML 5 v kombinaci s CSS 3, JavaScriptem a rozšířenými javascriptovými knihovnami typu jQuery apod. Dodavatel může využít některý z rozšířených frameworků pro HTML 5 (např. HTML5 Boilerplate), avšak plně zodpovídá za dodržení licenčních podmínek.
Kompatibilními zařízeními se rozumí stolní prohlížeče Internet Explorer, Firefox, Chrome, Safari a Opera a dále mobilní prohlížeče standardně dodávané s mobilními operačními systémy Android, iOS a Windows. V aktuálně nejrozšířenějších prohlížečích (v případě Internet Exploreru od verze 10 a vyšší/novější) na desktopových operačních systémech Windows, Mac OS a Linux, jakož i na mobilních operačních systémech Android, iOS a Windows požadujeme plně funkční a použitelné zobrazení i ovládání. Ve starších či okrajově rozšířených prohlížečích pak plně přístupné zobrazení a ovládání s adekvátními ústupky v použitelnosti (usability).
Obecnými požadavky na technologii back endu jsou:
· využití běžně podporovaných(v nabídce hostingů) programovacích jazyků (php apod.). Web nesmí využívat jakýkoliv placený software nebo  pluginy... Nesmí být závislý na žádných nadstandartních HW nebo SW požadavcích. Zkrátka tak, aby bylo možné web rozjet na běžných hostingových službách v nabídkách poskytovatelů. 
· nízké náklady na implementaci,
· nízké výkonové nároky na server,
· kódování znaků v UTF-8,
· licence umožňující přístup a úpravy zdrojových kódů zadavatelem bez dodatečných nároků na autorskou odměnu. Včetně přístupu ke všem „částem“ výsledné webové stránky (přístupů do databází - admin hesel apod.), tak aby mohl zadavatel bez problémů v případě potřeby přesunout celé stránky na nový hosting. 
Podle názoru zadavatele tyto nároky nejlépe splňuje vývojové prostředí PHP v kombinaci s databázovým serverem MySQL na webovém serveru Apache v OS Linux. Vyšší technologickou vrstvou může být vhodný, dostatečně rozšířený a licenčně nekonfliktní framework (například Nette) nebo redakční systém (například Drupal).
Zadavatel připouští použití open-source i proprietárního redakčního systému za dodržení následujících podmínek:
· pravidelná aktualizace a záplatování bezpečnostních chyb redakčního systému v rámci měsíční správy,
· uživatelská podpora zaměstnanců zadavatele formou telefonu nebo emailu v rámci měsíční správy,
· dodržení bezpečnostních standardů dle OWASP Top 10 - 2013 (https://www.owasp.org/images/f/f3/OWASP_Top_10_-_2013_Final_-_Czech_V1.1.pdf ),
· v případě potřeby umožnit nebo předat další úpravy zdrojových kódů a databáze redakčního systému zadavateli nebo jím pověřené třetí straně.
U každého dodaného webu požadujeme rychlost jeho odezvy dle měření Google Developers - PageSpeed Insights (https://developers.google.com/speed/pagespeed/insights/) na minimální úrovni alespoň 80/100 pro všechna měřená zařízení, pokud nebude dohodnuto jinak.
Webhosting
Dodavatel poskytne pro weby webhosting s následujícími parametry:
· Smluvní garantovaná dostupnost webů 99,5% v rámci kalendářního měsíce.
· Pravidelné aktualizace programového vybavení serveru na nové stabilní a podporované verze.
· Pravidelné zálohování, ukládání záloh po dobu min. 14 dnů.
· Nebude omezeno množství uložených ani přenesených dat vzhledem k účelu zakázky.
· Weby poběží pouze na šifrovaném připojení HTTPS (administrace i web pro návštěvníky), nákup a prodlužování bezpečnostních certifikátů (certifikáty funkční ve všech hlavních prohlížečích, minimální úroveň Class 1) zajistí zadavatel.
· Domény vlastní zadavatel a zařizuje i jejich prodlužování. Zadavatel zajistí nasměrování domén dle pokynů dodavatele.
· Denní kontrola IP adres webhostingu a jejich delistace z blacklistů DNSBL/RBL.
Podpora a správa webů
V rámci měsíční správy poskytne dodavatel pravidelnou aktualizaci redakčního systému a záplatování bezpečnostních chyb, uživatelskou podporu zaměstnancům zadavatele a opravu vad nahlášených zadavatelem.
Opravení kritických vad webů (vady, které zásadním způsobem ohrožují dobré jméno zadavatele) bude dodavatel garantovat v pracovní dny v době po-pá, 8 -18 hod, a to do 4 hodin od nahlášení. 
Zhotovitel poskytne zadavateli kopii webu, včetně programového klíče, kódu, databáze a veškerých dat tak, aby zadavatel mohl obnovit (zprovoznit) web i bez aktivní pomoci zhotovitele. Zhotovitel tato data aktualizuje jednou za 6 měsíců. Zhotovitel se zavazuje na vyžádání (případně při ukončení činnosti) zprovoznit aktuální kopii webu, včetně administrace a všech dat na hostingu stanoveném zadavatelem.
Ostatní
Manuál a proškolení
· Zadavatel požaduje před spuštěním prvního z webů předložit stručný manuál v tištěné a elektronické formě pro práci s redakčním systémem; zaškolení pracovníků zadavatele v rozsahu 4 hodin pro každý web.


Wireframe webu
Wireframe webu byl vytvářen na základě obecných potřeb jednotlivých objektů. Textové informace byly v největším množství případů použity z muzea v Zubrnicích. Toto použití je pouze ilustrativní.
Rozcestník – web Národní muzeum v přírodě
· V horní části stránky bude textový popis projektu.
· Na pozadí je možné nahrát fotografii nebo video.
· Karta objektu
· Nadpis
· Obrázek objektu
· Popis objektu
· Odkaz na objekt
· Automaticky generovaná informace o otevření objektu.
· Profil instituce
· Popis instituce s možností editovat text pomocí wysiwyg editoru.
· Kalendář akcí
· Po kliknutí na konkrétní den se zobrazí všechny akce, které se mají zobrazovat na rozcestníku ze všech objektů.
· Vybrané akce v našich muzeích, za každý objekt bude zobrazena jedna akce:
· Automaticky generované informace ze stránek jednotlivých muzeí.
· Název objektu
· Obrázek akce
· Název akce
· Datum
· Termín konání
· Odkaz na detail akce na stránce konkrétního objektu
· Stránkování
· Možnost nastavení TOP akcí, které se zobrazují na prvním místě.
· Kalendář akcí – kliknutím na datum se vypíší akce pro zvolený datum ze všech muzeí.
· Patička obsahuje obecné informace a případný odkaz na přihlášení do intranetu pro zaměstnance.


Domácí stránka
Informace, které se propisují na všechny stránky

V horní části stránky:
· Telefon
· Adresa objektu s odkazem na mapu v kontaktech
· Odkazy na sociální sítě
· Volba jazykové mutace
· Odkaz na ostatní objekty
· Logo objektu
· Menu
· Vyhledávání s našeptávačem
· Podstránky obsahují drobečkovou navigaci
V dolní části stránky:
· Rychlý kontakt
· Odkazy na rozcestník a ostatní objekty
· Loga hlavních partnerů
· Povinně zveřejňované informace a odkazy na sociální sítě
· Logo a krátká důležitá textová informace

Model domácí stránky, varianta 1 – bez videa
· Profil instituce
· Nadpis
· Automaticky generovaná informace o otevřených okruzích
· Krátký popis a odkaz na přehled okruhů.
· Galerie fotografií se základními příznaky objektu, po najetí se zobrazí krátká vysvětlující informace.
· Připravované akce
· Příznak akce
· Obrázek, název a krátký popis akce
· Datum a čas trvání akce
· Kalendář
· Po prokliku se zobrazí akce daného objektu ve zvolený den.
· Textový blok editovatelný pomocí wysiwyg editoru.
· Aktuální informace
· Výpis článků s datem, nadpisem a perexem.
· Grafické odkazy na zvolené podstránky (editovatelné v redakčním systému).
Model domácí stránky, varianta 2 – ilustrativní video
· Druhá verze domácí stránky s jedinou úpravou – videem na pozadí hlavičky webu.


Výpis akcí
· Stránka s přehledem akcí a filtry.
· Možnost editace obrázku v záhlaví.
· Akce je možné filtrovat na základě dvou typů:
· Dle určení (pro děti, pro dospělé, pro školy)
· Dle štítku (soutěž, výstava, bohoslužba, oživlé památky a další, které jsou přidány v administraci)
· Karta akce
· Příznak akce
· Obrázek, název a krátký popis akce
· Datum a čas trvání akce

Detail akce
· Detailní stránka akce s editovatelným obrázkem v záhlaví, který se může dědit z výpisu akcí.
· Hlavní obrázek akce a adresa akce s náhledem na mapě.
· Datum a čas konání akce.
· Vstupné na akci společně s poznámkou.
· Textový popis akce.
· Doprovodný program – akce, které jsou přiřazeny k této akci jako doprovodný program.
· Fotogalerie.
· Podobné akce – akce, které jsou přidány jako podobné.
· Akce budou 3 typů:
· Akce bez možnosti rezervace s datem
· Akce s možností rezervace bez data
· Akce je možné rezervovat díky kontaktnímu formuláři.
· Každý termín má vlastní v administraci definovanou kapacitu.
· Na výstupech je vidět aktuální volná kapacita.
· V administraci jsou vidět přihlášení uživatelé.
· V administraci je možné definovat e-mailovou šablonu, která je rozesílána uživatelům po registraci.
· Akce s možností rezervace bez data
· Akce je vypsána pro určité rozmezí termínů, nejsou vypsány přesné, skrz kontaktní formulář je možné zažádat o domluvení akce.
· Pokud bude mít akce zvoleno přihlašování, bude možné přihlásit se formulářem. Na detailu akce se bude zobrazovat aktuální volná kapacita.
· V redakčním systému bude možné zvolit, zda je nebo není akce na přihlášení.
· V redakčním systému bude možné zvolit kapacitu akce.
· V redakčním systému bude možné editovat potvrzující e-mail.
· U každé akce bude možné v redakčním systému zobrazit aktuálně přihlášené včetně detailu přihlášky.
· V redakčním systému bude možné editovat odeslané přihlášky, mazat je i ručně přidávat a tím blokovat kapacitu.


Přehled aktuálních informací
· Výpis aktuálních článků na jedné stránce se stránkováním a možností úpravy obrázku v hlavičce webu.
· Karty se zobrazují v chronologickém pořadí.
· Každá karta obsahuje:
· Datum zveřejnění
· Nadpis
· Perex
· Systém musí obsahovat možnost přidávat článkům příznaky podobně jako u akcí a následné filtrování na tomto výpisu.


Detail článku
· Detail článku s fotogalerií a podobnými články, fotku v záhlaví je možné dědit ze záhlaví výpisu aktualit.
· Každý článek obsahuje: 
· Nadpis
· Datum zveřejnění (volitelný datum ukončení zobrazení, který se nezobrazuje na výstupech)
· Hlavní fotografii
· Text editovatelný wysiwyg editorem
· Fotogalerii
· Podobné aktuality (pokud nejsou přiřazeny, automaticky se zobrazí 3 poslední)


Informace pro návštěvníky
· Stránka s výpisem informací pro návštěvníky a přehledem základních informací a fotografií v záhlaví.
· Graficky zpracované základní příznaky objektu s volitelnou ikonkou, která se propisuje na domácí stránku.
· Textový blok s editorem.
· Odkaz na podobné stránky (Kam dále)
· Fotogalerie


Výpis prohlídkových okruhů
· Výpis všech prohlídkových okruhů v daném muzeu s obrázkem v záhlaví.
· V horní části je možné zobrazit text pomocí textového editoru.
· Ve výpisu se propisují informace o podřízených okruzích, aktuálně otevřené se zobrazují jako první.
· Z detailu prohlídkových okruhů se propisuje:
· Fotografie a název okruhu
· Kapacita
· Trvání
· Odkaz na rezervace, případně volitelný text
· Perex
· Aktuální otevírací doba
· Ceník okruhu
· Odkaz na detail
· K výpisu je možné přidat kontakty.


Detail prohlídkového okruhu
· Detailní informace o prohlídkovém okruhu s hlavní fotografií pouze v záhlaví.
· Informace jsou v administraci strukturovány:
· Název
· Kapacita
· Trvání
· Otevírací doba s administrací pro jednotlivé dny v kalendářním roce a možností administrace výjimek v otevírací době a plánováním jejich zobrazení.
· Vstupné
· Vstupné pro skupiny
· Fotogalerie
· Doplňkové informace
· Textové informace
· Přehled podřízených budov
· Přiřazené stránky


Textová stránka
· Textová stránka bude používána pro řadu obsahů, které nejsou zobrazeny v jiných návrzích.
· Textová stránka obsahuje:
· Textový obsah
· Fotogalerie
· Podobné stránky
· Kontaktní formulář
· Menu 4. úrovně, pokud existuje
· Přiřazený kontakt z centrální administrace kontaktů
· Přiřazený produkt z e-shopu
· Přiřazenou akci
· Přiřazený článek


Textová stránka bez přiřazených informací v pravém bloku
· Textové pole se roztáhne na celou šířku webu, možnost omezení šířky textu fotografiemi.
· Možnost zobrazení kontaktů pod stránkou.

Programy pro školy
· Stránka s tematickými prohlídkami má proti standardním akcím následující odlišnosti:
· Akce je možné pouze poptat, nejsou vypsány na konkrétní termín.
· Akce jsou řazeny v administraci dle zvoleného pořadí.
· 

E-shop – přehled produktů
· Výpis produktů a možnost filtrování pomocí štítků, které jsou administrovatelné.
· Každý produkt může obsahovat:
· Štítek
· Název
· Autor
· Cena


Detail produktu
· Detailní informace k produktu s fotografií v záhlaví, která se může dědit z hlavní stránky e-shopu.
· Produkt obsahuje:
· Štítek
· Obrázek
· Název
· Autor
· Cena
· Stav skladem
· Informace v textovém editoru
· Podobné produkty


Košík
· Stránka po vložení produktu do košíku.
· Košík má jasně definované a přehledné jednotlivé kroky vedoucí k odeslání objednávky.
· V přehledu se automaticky počítá celková cena a je možné změnit počet kusů produktů v košíku.
· „Ostatní zákazníci ještě koupili“ – zobrazují se produkty, které jsou podobné k produktům v košíku.
Další kroky nákupního procesu budou vycházet ze zvoleného řešení, je ale nezbytné:
· Možnost administrace forem dopravy a platby.
· Možnost jednorázového nákupu bez registrace.
· Možnost přidání prodeje vstupenek.
· Možnost editace e-mailových šablon.
· Možnost odesílání objednávek na zvolené e-maily.



Kontaktní stránka
· Kontaktní stránka s formulářem a vygenerovanými kontakty.
· V horní části stránky se zobrazují strukturované kontakty doplněné textovým editorem.
· Mapa zobrazuje adresu instituce, možnost zobrazit i více bodů.
· Kontaktní osoby, které jsou přiřazeny skrz centrální administraci kontaktů. Osoby budou dohledatelné přes vyhledávání a každá osoba bude mít svůj detail. V administraci bude nastavitelné, zda je tento detail veřejný nebo neveřejný (zobrazitelný pouze v administraci).
· Dokumenty ke stažení.
· Administrovatelný kontaktní formulář.


1