Практически техники и инструменти за заместване на динамични изображения

Когато става въпрос за уеб дизайн, творчеството на дизайна не трябва да се възпрепятства от ограничения избор на поддържани уеб шрифтове, които наричаме уеб-безопасни шрифтове. Дизайнерите трябва да имат свободата да използват всякакви шрифтове, които предпочитат за заглавия и съдържание.

През 2005 г., динамичната подмяна на изображения е направена популярна с техника, наречена Мащабируема замяна на Inman Flash (sIFR). Разработено от Шон Инман, sIFR се възползва от Javascript и Adobe Flash, за да позволи на уеб дизайнерите да използват всякакви персонализирани шрифтове, които харесват на уебсайта, и да поддържат видимост за тези, които нямат този шрифт. И тъй като мрежата продължава да се развива, днес ние имаме повече алтернативни решения, използващи различни технологии, само в случай, че не сте много почитател на Flash.

Без повече шум, нека да разгледаме някои от техники за постигане на динамични замествания на изображения.

Често използвани техники

Ето някои от най-често практикуваните техники за заместване на динамични изображения.

Мащабируема замяна на Inman Flash (sIFR)

sIFR е един от най-популярните методи за вграждане на персонализирани шрифтове в уебсайтовете. Той използва Javascript и Flash, за да генерира персонализиран шрифт за вашия сайт и позволява преобразувания шрифт да бъде избираем. Освен това конвертираният шрифт остава като текст в изходните кодове, така че търсачката все още може да ги обхожда.

sIFR 2 (препоръчва се) е текущата стабилна версия, но ако търсите за прилагане на sIFR, трябва да знаете това siFR 3 Бета версия също е достъпна за изтегляне. Може да е малко бъгове, но поне решава проблема с разширяването на шрифта sIFR 2.

Инструменти за sIFR, които може да са полезни:

sIFRvaultsIFRvault е хранилище на sIFR шрифтове, които можете да изтеглите.
Генератор на sIFRОнлайн инструмент, който ви позволява да създавате sIFR .swf файлове с няколко кликвания на мишката. Просто качете TTF шрифта на шрифта, който искате да конвертирате, визуализирате и изтеглите.
Конвертиране на шрифтове в sIFRКачете шрифт .TTF и този уебсайт ще ги конвертира в sIFR Flash файл.

sIFR Lite

Оригиналният sIFR е 22k, така че Дейв решихме да го преработим, използвайки по-обектно-ориентиран подход и резултата? 3x по-малко при 3.7k.

Замяна на динамичен текст на PHP + CSS (P + C DTR)

Както подсказва името, това е метод за подмяна на текст, който използва PHP и CSS, които използват оригиналния метод, описан от Стюард Розенбергер. Също така е подобрение от предишната версия, разработена от R. Marie Cox който не поддържа пренасяне на текст и вътрешни маркери. Друго страхотно нещо за P + C DTR е, че текстът на изображението може да се персонализира с CSS тагове.

typeface.js

Какво прави typeface.js специално е, че те използват само Javascript за вграждане на потребителски шрифтове и стил може да бъде допълнително персонализирани с HTML и CSS, без Flash е задължително. Той е с отворен код и поддържа повечето браузъри, които използваме в наши дни, независимо дали е Safari, Firefox, IE (6 и по-горе).

Лично след някои експерименти с typeface.js, смятаме, че може да има някаква потенциална възможност за подобрения. Първо, шрифтовете обикновено се различават малко по-различно между различните браузъри. Ако използвате typeface.js, ви препоръчваме да направите проверка на различни браузъри, преди да приемете, че това, което виждате в Firefox, ще бъде това, което виждате в Safari. Текстът също не може да се избира с typeface.js.

Персонализираните шрифтове в typeface.js не се компилират; което означава, че потребителите могат да изтеглят шрифтовете. Това може да доведе до проблем с авторските права. Препоръчително е да проверите внимателно, за да сте сигурни, че шрифтовете, които използвате, са нормални за преразпределение.

Cufon

Не е необходим Flash, Cufon е чудесна алтернатива на sIFR и е доста проста за изпълнение. Първо, използвайте генератора на Cufon, за да генерирате и персонализирате шрифта, който искате, след това вмъкнете Cufon Javascript в изходния код и кажете на скрипта кои селектори искате да бъдат персонализирани шрифтовете.

Най-големият проблем с Cufon ще бъде правният проблем при използването на тези персонализирани шрифтове онлайн. Тъй като е вграден в Javascript, той може лесно да бъде извлечен от всеки, който разглежда изходния код. Потребителските шрифтове на Cufon не могат да се избират, а другият е изключен.

Фейслифт

Също известен като Смяна на образа на лицето (FLIR), това е друг чудесен метод за sIFR, който не изисква Flash. Изглежда, че много друга алтернатива е удари в Flash въпрос на sIFR.

Facelift използва PHP и GD библиотеката на PHP. Те наследяват проблема с наследството на персонализираните заместители на шрифтове - не могат да изберат текста. Освен това смятаме, че е страхотно.

Още методи

Техниките по-горе биха могли да бъдат по-широко използвани, но забелязахме и други начини да се превърне текста в красиви персонализирани шрифтове.

Тип Изберете

TypeSelect лостовете на typeface.js, jQuery, платното, toDataURL, CSS фоновите свойства и реалния наслагван текст, за да дадете персонализиран шрифт на вашия сайт. Изборът на текст работи в Firefox, Safari и дори Chrome, но не и в IE.

Замяна на Swf изображение (swfIR)

SWFIr ви дава възможност да приложите асортимент от визуални ефекти към всички или всички изображения на уебсайта си. Например, можете да добавяте изображения на уебсайта си и swfIR ще добави по-голяма граница, завърта позиционирането или дори ще добави сенки към нея.

Девет техники за подмяна на CSS изображения

Това не са динамични заместители на текст, а Крис Койер демонстрира до девет различни CSS техники, за да замени текста с изображения; всеки с карта за докладване, в която се посочва състоянието на - какво, ако изображенията са включени / изключени, CSS е включен / изключен.

Горелка за шрифтове

Горелка за шрифтове използвайте Scalable Inman Flash Replacement (sIFR), за да промените заглавията си в потребителски шрифт. Всичко, което трябва да направите, е да намерите шрифта, да го изберете и да вмъкнете кода в главата и заглавието ви ще бъде променено за нула време.

Замяна на WordPress + динамично изображение

Ако сте потребител на WordPress, който търси динамично решение за подмяна на изображение за заглавието или дори съдържанието на вашия блог, шансовете са за тях. Ето някои добавки за подмяна на текст, за които знаем.

sIFR Plug-in за WordPress - WP sIFRWP sIFR е създаден, за да премахне усложненията от получаването на персонализирани шрифтове в WordPress сайт. С WP sIFR, трябва само да качите SWF файла си в директорията с приставки и след това да влезете, да го активирате и да конфигурирате стиловете му в панела с настройки..

Cufon Plug-in за WordPress - WP-CufonЕдинственото нещо, което трябва да направите, е да конвертирате вашите шрифтове и да ги качите в директорията с приставки. Можете да активирате обектите, които искате да замените в менюто за администратор на WordPress.

Възстановяване на образа на лицето (FLIR)FLIR за WordPress е SEO приятелски и само прави изображението в браузъра, ако JavaScript е активирана. Вашият HTML / XHTML код остава непроменен, оставяйки ви главни етикети, четими от търсачките, а страницата може да се чете от тези без JavaScript.

Контролен панел за записване на шрифтНай- Горелка за шрифтове Приставката за контролния панел ви позволява лесно да добавите всеки от 1000-те безплатни шрифта, налични на уебсайта на Burner за шрифтове, във вашата WordPress тема.