Як робився - Бізнес-лінч

отже

Чудово та зручно (не треба возитися ні з Фотошопом, ні з яваскриптом). А тепер креслення арт-директора доведеться показати на сайті.

У рисиОтже, ми залишилися наодинці з XML-даними в базі. Приблизно такими:

Вже якщо відмовлятися від флешу, треба верстати так, щоб текст залишався текстом (пошукові системи будуть щасливі). Тепер зрозуміло, чого слід прагнути: зібрати сторінки з трьох шарів — внизу оригінальна картинка, потім балони для рецензій, а зверху текст:

ImageMagick

Тіні на середньому шарі напівпрозорі, отже, потрібен PNG. А в розпорядженні поки що є лише XML — отже, потрібний конвертер. Розумно скористатися форматом SVG: це одночасно векторна графіка, і XML-код.

Зробити SVG з XML простіше - існує XSLT. А ось як зробити з SVG PNG, відразу не зрозумієш. (Потрібна ж автоматика, яка працюватиме на Юнікс-сервері).

Вже давно працює програма ImageMagick, з її допомогою ми в промислових масштабах робимо «прев'юхи» (наприклад, для «Рутини»).

ImageMagick розуміє підмножину формату SVG, але результатом (праворуч) залишиться задоволений хіба що Пікассо:

ImageMagick

Останній ривокНа пошуки потрібного інструменту пішов майже день. Існує близько десятка конвертерів SVG в PNG (наскільки вони перевершують ImageMagick, не завжди відомо), всі з них вимагають встановлення додаткових програм, і ці залежності розходяться віялом: кожен новий компонент потребує ще кількох.

Найрозумнішим виявилося поставити SVG-растеризатор (SVG rasterizer) із комплекту «Батик». Для його роботи, щоправда, знадобилося встановити і Яву, отже цей спосіб як розумний, а й сучасний.

ВсяТехнологічний ланцюг у результаті містить такий набір ключових слів: Flash, XML, XSL, PNG, Java.

Невже це все?Ні, звичайно, не всі. Крім пенге-файлу створюється ще й гіф, щоб порадувати власників старих браузерів. А окреме XSLT-перетворення створює HTML-розмітку, що розставляє текстові блоки на потрібні місця.