Lustro Szablony HTML

Praktyczne szablony HTML luster

Duże zdjęcia luster mogą z łatwością zdominować stronę, przez co wymiary, warianty wykończenia i wytyczne montażowe stają się trudne do odczytania. Szablony HTML luster zapewniają zakodowane podstrony, w których zdjęcie produktu i lista parametrów znajdują się zazwyczaj w osobnych blokach, gotowych do ponownego wykorzystania przy kolejnym modelu. Większość modyfikacji wykonuje się wizualnie w Nicepage, a wyeksportowane pliki HTML można wgrać na własny hosting lub przekazać programiście pracującemu z kodem źródłowym.

Od galerii do formularza zapytania

Klient może początkowo zachwycić się samym wyglądem lustra, jednak decyzja zakupowa zależy przeważnie od wymiarów, sposobu mocowania lub możliwości wykonania na wymiar. Z tego względu bloki w karcie produktu najlepiej ułożyć w następującej kolejności:

1. Galeria prezentująca kilka ujęć tego samego lustra.
2. Zestawienie specyfikacji lub zwarta tabela z szerokością, wysokością i wykończeniem ramy.
3. Blok opcji personalizacji z krótką wskazówką montażową tuż pod nim.
4. Formularz zapytania umieszczony na tyle blisko danych technicznych, by nikt nie musiał przewijać strony w poszukiwaniu parametrów.

Na ekranie telefonu bloki te układają się pionowo jeden pod drugim, dlatego wymiary powinny nadal znajdować się nad formularzem. Szczególnej uwagi wymaga również tekst alternatywny, ponieważ zdjęcie lustra zawsze ukazuje odbicie otoczenia. Opis powinien określać ramę oraz kształt tafli, gdyż informacja o odbijającym się pokoju jest bezużyteczna dla użytkownika czytnika ekranu.

Zakres prac podzielony według stopnia ingerencji

Gdy powyższy układ sprawdza się przy jednym produkcie, kolejne modyfikacje można podzielić na cztery poziomy – od najszybszych po najbardziej zaawansowane:

1. Podmiana zdjęć i wierszy specyfikacji wewnątrz istniejącego bloku.
2. Duplikowanie bloku na potrzeby luster toaletkowych, ściennych lub stojących.
3. Zmiana nazw pól formularza dotyczących szerokości, kształtu i wymagań montażowych.
4. Dodanie niestandardowego kodu po eksporcie, np. kalkulatora cen szkła na wymiar.

Dokumentacja Nicepage poświęcona korzystaniu z elementów strony wyjaśnia, jak dodawać, edytować i przemieszczać elementy wewnątrz bloków. Wszystkie zmiany wprowadzone w ten sposób trafiają bezpośrednio do wyeksportowanego kodu, dzięki czemu pierwsze trzy grupy edycji nie wymagają otwierania plików źródłowych. Kod źródłowy wymaga uwagi programisty dopiero wtedy, gdy dana funkcja wykracza poza sam układ wizualny, jak w przypadku wspomnianego kalkulatora.

Co otrzymuje programista

Po przeprowadzeniu eksportu pliki HTML pozostają otwarte na bezpośrednią edycję kodu, co ma kluczowe znaczenie przy rozbudowie oferty. Sklep z lustrami dekoracyjnymi powiela głównie jedną kartę produktu, więc programista oczekuje, że każda kopia zachowa pełną spójność z oryginałem. Układy dla produktów na wymiar są bardziej wymagające, ponieważ galeria, tabela parametrów i formularz konfiguracji rywalizują o tę samą przestrzeń ekranu. Przykładowe dane demonstracyjne rzadko odzwierciedlają zachowanie strony pod obciążeniem rzeczywistą treścią. Wypełnij tę tabelę wszystkimi parametrami wymaganymi dla lustra podświetlanego, łącznie z mocą i barwą światła. Jeśli bloki zachowają właściwy układ bez modyfikacji kodu, szablon bez problemu poradzi sobie również z kolejną kategorią produktów.