форум webanet

Web Tycoon игра для создателей сайтов

webanet — Sat, 26 May 2018 10:24:01 GMT

Игра ещё не выпущена, но уже вызывает интерес. В первую очередь потому что, полноценных игр-симуляторов для вебмастеров история ещё не знает. А если в ней ещё и будет обучающая составляющая, игра может быть не только уникальной, но и полезной.
Подробнее о том, что это, зачем и почему можно узнать на официальном сайте игры web-tycoon.com
Мы же пока можем пофантазировать на тему

Декодировать расшифровать HTML и javascript онлайн

worldname — Wed, 02 May 2018 08:02:29 GMT

Если вы в поисках скриптов или элементов дизайна нашли закодированный или зашифрованный код, то не стоит его сразу ставить к себе на сайт. В первую очередь вы должны его декодировать и проверить содержимое. В противном случае вы рискуете установить к себе на сайт вредоносный код
Очень часто недобросовестные дизайнеры и кодеры запаковывают в код вредоносные элементы, а потом распространяют скрипты и элементы дизайна в сети, от чего и страдают неопытные пользователи
Лучше всего, если вы не понимаете работу скрипта или не можете самостоятельно анализировать тот или иной скрипт, не берите его и не устанавливайте к себе на сайт

Список онлайн декодеров и расшифровщиков HTML и javascript

Универсальный декодер от студии Артемия Лебедева универсальный декодер HTML и js

В простом варианте можно расшифровать простую URL кодировку вида

Код

%77%65%62%61%6E%65%74%2E%75%63%6F%7A%2E%72%75

В сложных вариантах нужно уже уметь определять тип кодирования

Декодер и кодировщик base64 Кодировать и декодировать онлайн base64

Декодирует код вида

Код

d2ViYW5ldC51Y296LnJ1

Сервис работает и как кодированием, так и раскодированием HTML и javascript и текстов

Декодер и кодировщик javascript по типу eval(function(p,a,c,k,e,r) Кодировать и декодировать eval(function(p,a,c,k,e,r)

Сервис работает как распаковщик и декодер, так и как кодировщик
Декодирует по типу

Код

eval(function(p,a,c,k,e,r)

Деобфускация распаковка и форматирование javascript Распаковать и форматировать javascript

Декодирование и кодирование HTML Онлайн кодирование и декодирование HTML кода

Сервис поможет вам как в рашифровке, так и в кодировании HTML кода. Работает на основе Unicode

Как закодировать HTML и JS с помощью функции charCodeAt Онлайн кодировщик в js Unicode

Для опытных пользователей могу посоветовать программу Malzilla. Программа обладает довольно широким инструментарием для вскрытия, дешифровки, деобфускации, распаковки и форматирования JavaScript
Программа не требует инсталляции
Вес 2. 5 мб
Загрузить malzilla_1.2.0.zip

Сайт производителя программы Malzilla Посетить

Кодирование текста и HTML

worldname — Sun, 26 Feb 2017 05:56:38 GMT

Этот инструмент поможет вам закодировать любой текст или HTML код в js Unicode с помощью charCodeAt
Кодировать лучше всего маленькие кусочки кода или текста, так как на выходе получится довольно большой код

Как это будет выглядеть после кодировки.

После кодировки вы получите код следующего вида

Предупреждения: используйте на своих сайтах подобные зашифрованные коды как можно умереннее. Поисковики и некоторые антивирусы могут неправильно понять зашифрованные участки кода.

А вот и сама форма кодированияв js Unicode

В левую форму нужно вставить то что вы хотите закодировать, а в правой получите готовый код

Музыка на сайте нужна ли

worldname — Mon, 19 May 2014 12:16:52 GMT

Музыка на сайте, хорошо это или плохо? Посмотрим на это глазами жертвы или глазами пользователя.
Поздний вечер, кругом тишина в наушниках тихо играет любимая композиция, пользователь находится в интернетАХ и тыкает по ссылкам, сёрфит в общем в полусонном состоянии. Ничего не предвещает беды. Поисковик. Запрос. Выдача. Выбор. Переход по ссылке, открывается страница...и тут грянул гром!
Да! Именно как гром среди ясного томного вечера звучит музыка на сайте на автозапуске и на полную громкость. Дело в том, что плеер пользователя может быть настроен на очень тихую работу, ушлые же вебмастера или не понимают что делают, или специально настраивают плеер на сайте или само музыкальное сопровождение на полную громкость. И тогда музыка в ушах пользователя гремит с внутренними настройками звуковой карты, и если эти настройки близки к пику, то эффект от попадания на такой громыхающий сайт можно сравнить только с ведром кипятка вылитым внезапно на голову.
Старые версии Касперского радовали пользователей звуком обнаружения вируса. Звук визжащей свиньи никогда не забудет ни один юзер этого бравого антивируса. Много народа пугались и так и не привыкли к подобным аллертам, но стали очень бояться вирусов Эффект достигнут.
Примерно так же пользователи бояться попадать на сайты под фанфары.

Теперь посмотрим на все это со стороны вебмастера и попытаемся понять его мотивы. Зачем они все же ставят музыку на сайт.

Мотив первый.
Ну это как всегда, удивить крутизной. Крутой плеер иногда не самый легкий, крутое радио, крутая музыка, крутой вебмастер который таки смог поставить любимую композицию так, чтобы она проигрывалась на всех страницах сайта без отрыва от производства. То есть, куда бы несчастный юзер на зашел, музыка везде его достанет. Такие вебмастера или прячут источник музыкальной радости или не выводят на страницы управление плеером или радио

Мотив второй.
Эда как меня пропёрло! Что в прямом переводе можно понимать так, что владельцу сайта так понравилась музычка и он так тащится от неё, прослушивая её по кругу сотни раз с неугасающим эффектом. Отсюда непреодолимое желание поделиться кайфом с миром. Ну а как же это сделать, если не через сайт. Пользователи придут, услышат и навеки останутся на сайте в благоговейном экстазе. Такие ярые меломаны даже не догадываются о том, что вкусы у всех разные, как и настроения

Мотив третий.
Часть дизайна сайта или элемент незабываемой харизмы ресурса. Сайтик про море может шелестеть волнами воплями чаек на всем протяжении полета. Ресурс посвященный авиации и самолетам может реветь турбинами и незабываемым звуковым выхлопом взлетающего самолета... Или просто фоновая заставка для гламурного сайта. Иногда при заходе на страницу, она человеческим голосом делает что-то типа приветствия

Мотив четвертый.
А чтоб не скучно было пользователям. Им должно быть весело. Ну не понимают такие сайтостроители, что не такого веселья хочется юзерам. Ибо не за стрессами идут они, а больше за информацией. Так уж устроены интернеты, для обмена информацией. В этом их цель. Индустрия развлечений в интернетах конечно тоже сильна, но развлекаться идут по собственной воле, в строго отведенные места (шутка), и такие развлечения в виде грома на сайте не всем нужны
На самом деле мотивов и вариаций намного больше

Почему пользователи не любят звучащие страницы

Иногда хочется тишины. Или душа просит или вынуждено. Человек может быть на работе. Или дома, когда кругом все спят, а звуки подключены через динамики. В таких случаях, попадая на сайт с музыкой у такого пользователя происходит сначала испуг, потом шок во время которого он судорожно пытается найти ту самую кнопку сначала на сайте-источнике, потом у себя на компьютере, потом он судорожно рвет провода или сдирая с себя наушники или вырывая провода динамиков. Когда шок и все судороги проходят, такой юзер просто закрывает сайт. Навсегда
Так же часто получается так, что музыкальные вкусы не совпадают и по громкости и по насилию и по составляющей.
Пользователь может серфить и под своё музыкальное сопровождение, в таком случае резкие инородные звуки его если не напугают, то точно будут раздражать из-за наложения друг на друга
Испуг. Это самая частая реакция, обусловленная неожиданностью. Большинство страничек в интернеАХ все же молчаливые. За звуками ходят на Ютуб, вКонтакт и в прочие места. Но везде на уважающих себя ресурсах, даже посвященным звукам, везде сам пользователь жмет на ту самую кнопку.

Так быть или не быть? Быть! Но никогда ни при каких обстоятельствах не ставьте музыку на автозапуск и не делайте фоном сайта. Дайте в руки юзеру кнопку! Пусть он сам решает и запускает праздник в своих ушах. Тогда будут довольны все. И вебмастера со своими мотивами и пользователи, которые не любят быть жертвами

Данный текст был написан в отчаянии и под впечатлением тройного попадания по долгу службы на сайты под фанфары. Никогда мне к этому не привыкнуть, всегда вздрагиваю и пугаюсь

Конструктор фигурных лент для сайта

webanet — Sun, 22 Sep 2013 12:32:11 GMT

Фигурные ленты - довольно оригинальный элемент дизайна сайта, который может использоваться для навигации, для анонсов, для украшения, для объявлений и для многого другого

Конструктор фигурных лент поможет вам создать свою собственную ленту, непохожую на остальные. С помощью конструктора фигурных лент, вы сможете сделать ленту для сайта необходимого размера, цвета и содержания. Также вы сразу получите готовый код для вставки на свой сайт

Как использовать конструктор фигурных лент для сайта

Конструктор предоставляет всего 12 параметров, настраивая которые вы сможете полностью подогнать ленту под нужды сайта

Управление шириной ленты
Настройка кончиков ленты
Настройка надписи на ленте и регулировка шрифта: размер, цвет, тени для текста (если необходимо)
Управление тенью и окантовкой
Настройка цвета самой ленты с помощью градиентов: верхний градиент, нижний градиент, настройка цвета внутренних углов и цвет кончиков ленты

Окончательно подогнав вид будущей ленты для сайта вы должны нажать на две кнопки, чтобы получить готовый код для вставки на сайт.

Кнопка Создать HTML сгенерирует HTML код для вставки в шаблон сайта, в то место где вы пожелаете видеть созданную ленту
Кнопка Создать CSS сгенерирет стили вашей ленты, которые вы должны скопировать в сплывающем окне и вставить в любое место файла таблицы стилей вашего сайта. Обычно, чтобы не путаться скопированный код ставят в самый низ
Если вам нужны ленты разных цветов и с разным оформлением, то для каждого варианта оформления нужно обязательно получать готовый стиль! HTML код в данном случае будет для всех видов лент одинаковый, если надписи на лентах будут одинаковыми. В противном случае вам придется заменять участок кода, отвечающий за содержание. В примере он выделен слово ЗАМЕНЯЕМЫЙ ТЕКСТ

Код

ЗАМЕНЯЕМЫЙ ТЕКСТ

Также обратите внимание на то, что в HTML коде текст ленты взят в теги аш 1

Код

Если у вас на странице, куда вы устанавливаете ленту уже прописан тег

Код

то из полученного в конструкторе кода нужно удалить данный тег или заменить необходимым. Пример

Код

ЗАМЕНЯЕМЫЙ ТЕКСТ

Если у вас есть знания в HTML и CSS, то полученный на конструкторе код даже после вставки в шаблоны сайта вы можете править под себя, настраивая ленту как вам угодно

Онлайн конструктор фигурных лент для сайта на CSS

Генератор стилей для кнопок CSS

webanet — Sat, 30 Jun 2012 23:05:27 GMT

Инструмент, с помощью которого можно создать кнопки для сайта с помощью стилей. Создать кнопку CSS онлайн

Обычно кнопки создаются с помощью картинок, получают код и вставляют в любое место сайта. Это хорошо для баннеров и некоторых отдельных элементов сайта, но иногда нужно сделать менюшку или хочется сделать полноценную кнопку со всеми атрибутами: изменение цвета при наведении, изменение цвета текста при наведении и многое другое. В этих случаях логичнее делать кнопки на стилях

Генератор CSS cтилей для кнопок удобен тем, что в левой части экрана вы видите то что у вас получается в реальном времени, то есть после каждого изменения в правой части экрана вы видите наглядный результат

В правой части экрана находятся основный настройки. Что мы настроить:
1) Размер будущей кнопки
2) Размер текста
3) Задать интенсивность закругления края

Инструментарий:

Верхний градиент - Да. Генератор поддерживает работу с градиентами, но не все браузеры понимают что это такое. IE ниже 9-ой версии не понимает даже скругление углов border-radius, поэтому заставлять его понимать градиенты gradient было бы жестоко. Если вы предпочитаете IE, то вам нужно работать с генератором именно в этом браузере, чтобы сразу видеть результат
Mozilla Firefox, Opera и Google Chrome отлично отобразят созданные кнопки и мучений особых не доставят

Общий фон кнопки - Это тот цвет, который вы будете видеть во всех браузерах и даже в IE. Ослик отобразит именно этот фон. Остальные браузеры отобразят с учетом верхнего градиента.

Цвет обводки кнопки - Это граница, которую можно выделить, если задать цвет темнее основного фона. Можно его просто слить с основой по цветовой схеме. Тогда границ видно не будет

Цвет при наведении - Это цвет фона кнопки, если навести на неё курсор

Цвет текста - Это цвет шрифта, который будет отображаться по умолчанию

Цвет текста при наведении - Это цвет на который будет меняться основной по умолчанию при наведении на кнопку. Можно сделать не только изменение оттенка фона, так же можно настроить и изменение текста

Фон активной кнопки - Если нажать на кнопку, то мы получим изменение фона

Выбор шрифта - Можно выбрать между Georgia, Helvetica и Lucida Grande

После окончания творческого процесса по настройке, наступает кульминационный момент получения кода. Жмем на кнопку в левой части экрана "Получить CSS"

Получаем код и что с ним делать? Всё просто. Добавляем полученный код в файл стилей CSS. Далее, если нам нужно сделать любую ссылку кнопкой прописываем стили к ссылкам. Пример для меню

Код

Создать кнопку и получить стиль CSS

Где

Код

class="button"

и будет прописан стиль к простой ссылке
Вот так вот простая ссылка с
анкором может стать кнопкой

Те кто понимают толк в приготовлении кошек, а так же в CSS и HTML, могут отредактировать полученный код под себя.

Бесплатная графика для сайтов

worldname — Thu, 12 Apr 2012 23:47:35 GMT

На любом сайте присутствует графика - это неотъемлемая визуальная часть
Для тех, кто не умеет рисовать в фотошопе, есть специальные базы готовой бесплатной графики в которых можно покопаться и подобрать готовое решение

Векторная графика
Поиск по базе бесплатной векторной графике: логотипы, кнопки для сайтов, иконки http://vector.us

Иконки и логотипы для сайта
Поиск по базе готовых бесплатных иконок. Можно найти и скачать как отдельные иконки, так и целые паки и тематические наборы иконок. На сайте присутствует конвертер изображений. Vожно скачать довольно оригинальные и необычные иконки. Перейти к отбору иконок FindIcons.com
Вы можете скачать иконку в любом формате на выбор и любого размера (до 10-и размеров)

Подбор иконок

Поиск по базе готовых иконок (русский язык)
Тоже неплохой сервис с хорошей базой, но чуть меньше возможностей Iconsearch

Бесплатные прозрачные PNG

Как выглядит сайт в разных браузерах

worldname — Thu, 12 Apr 2012 23:12:34 GMT

Корректное отображение сайта различными версиями и разными браузерами - это то к чему должен стремиться любой веб-мастер. Но на пути этих стремлений часто возникают проблемы.
Самая главная проблема - это использование пользователями не самых последних версий обозревателей. Особенно остро стоит проблема отстающего в развитии Internet Explorer. Только с 9-ой версии этот браузер можно назвать браузером, так как он стал более или менее дружить с современными технологиями. Версии ниже 9-ой - это проблема. Проблема, которой пользуется большинство пользователей, а вебмастера лепят хаки и костыли в попытках прийти к идеалу
Некоторые просто запрещают просмотр страниц с IE, вешая таблички с предупреждениями или чего хуже - с редиректами на страницы скачивания FF или Opera

IE NetRenderer отличный онлайн сервис, с помощью которого можно увидеть страницы вашего сайта "глазами" ослика (IE) различных версий, включая самые древние
Если хотите увидеть как отображается ваш сайт в
Internet Explorer 10
Internet Explorer 9
Internet Explorer 8
Internet Explorer 7
Internet Explorer 6
Internet Explorer 5.5
IE7-IE6 смешанный
IE7-IE6 разница между 7 и 6
вам нужно перейти на главную страницу сервиса проверки отображения страниц в IE IE NetRenderer выбрать нужную версию и ввести адрес страницы. Возле окошка пуска есть пустая форма ввода. Туда нужно вбить цифру не менее 150, в противном случае, вы увидите только верх страницы. Сервис совершенно бесплатный и не требует регистрации
Для локальных тестов сайта в IE есть программа IETester v0.4.11, как и онлайн сервис работает со всеми версиями ослика включая Internet Explorer 5.5 и 10 и тоже бесплатна. Узнать больше, а так же скачать вы сможете на сайте производителя DebugBar

Список обозревателей на самом деле IE не ограничивается, и выбор довольно большой.

Browser Shots - один из лучших онлайн сервисов с огромными функциональными возможностями поможет увидеть вам ваш сайт совершенно бесплатно в различных браузерах, таких как
Google Chrome
Dillo
Epiphany
Firefox
SeaMonkey
Konqueror
Kazehakase
Opera
Iceape различных версий OS Linux

Google Chrome
Avant
Firefox
Flock
K-Meleon
IE
Netscape
Opera
Navigator
Safari
SeaMonkey
Shiretoko различных версий OS Windows

Safari 5.0 OS Mac

А так же для любителей бесплатной простоты и экстрима просмотр с обозревателей OS

Вы можете настроить необходимое вам разрешение экрана, можете выбрать настройки цветового разрешения, возможность просмотра с отключенным яваскрипт или версию, так же можно установить версию флеша и запрет на отображение
Вам придется подождать всех скриншотов выбранной вами страницы, иногда до 1,5 часов. Но оно того стоит. Перейти на Browser Shots

Если кто-то знает бесплатные сервисы подобного рода, то обязательно делитесь ссылками

Поиск по сайту. Активность пользователей

worldname — Wed, 07 Mar 2012 14:06:08 GMT

Данный опрос - это маленькое исследование поведенческой активности пользователей на сайте. Поиск по сайту - один из пунктов этой активности.
Зачастую посетители приходят по определенным конкретным поисковым запросам из поисковиков. Существует несколько вариантов поведения:
1) Нашел что нужно: взял или прочел и ушел удовлетворенный
2) Не нашел что нужно и ушел с сайта вообще обратно к первоисточнику к поисковой системе спрашивать дальше
3) Нашел что нужно и стал раскапывать сайт дальше в поисках интересного
На разных ресурсах поведение посетителей может быть очень разным. Но общий стиль поведения может указать на то интересен ли пользователям сайт или не очень. И самое главное может выявить некоторую степень заинтересованности

Подбор кода цветов HTML

worldname — Sat, 19 Nov 2011 22:08:34 GMT

Цвета в HTML задаются в шестнадцатеричном коде. Прописываются коды через решетку
Пример HTML:

Код

Пример CSS:

Код

{
background-color: #000000;
}

Что будет означать черный фон

Легче всего подбирать цветовой код по готовым таблицам, где есть визуальная расстановка по оттенкам начиная с черного и заканчивая белым
Воспользуйтесь нашей таблицей на сайте HTML цвета Таблица кодов
Каждая ячейка окрашена тем цветом, который будет отображаться у вас в HTML и промаркирована кодом

Так же вы можете воспользоваться специальным онлайн сервисом - генератором кодов.

Работает по принципу графического редактора, где вы ползунком настраиваете оттенок и автоматически получаете код. Сервис полезен ещё тем, что имеет обратное действие, то есть вы вставляете код и получаете его цвет

Есть ещё простенькая программа для компьютера с теми же свойствами Coolcolor Text Generator Программка генерит HTML и Би-Би коды

Как добраться до вебмастера Google

worldname — Sat, 24 Sep 2011 22:16:53 GMT

Инструкция о том, как понять новый интерфейс профиля в Google и как добраться до всех сервисов, а так же в вебмастер. Теперь путь в вебматер Гугла стал неблизким, как и в остальные сервисы

С запуском в открытый доступ новой социальной сети Google+ при залогинивании в аккаунт мы попадаем прямиком в свой профиль на plus.google.com где вебмастером даже не пахнет

Если раньше было все просто и понятно. Логин - Настройки - Настройки аккаунта Google - Список сервисов - Инструменты для веб-мастеров
То теперь мы попадаем именно в настройки, но plus.google, где уже нет списка используемых сервисов.
Но на этот раз гуманизм разработчиков не подвел. Для тех кто потерялся просто кинули ссылку на старую версию профиля.
Под вкладкой безопасность и под настройками адресов электронной почты, нам бросили спасательный круг в виде спасительной ссылки

Вот такая картина в настройках профиля теперь

Наверное тупо говорить о том, как это неудобно. А хотелось бы иметь выход на профиль со всеми сервисами, и прямой выход
Кто не хочет заморачиваться то можно пройти по прямой ссылке прямо в вебмастер https://www.google.com/webmasters/tools/home?hl=ru

Для тех кто хочет найти путь в новом интерфейсе и найти остальные используемые сервисы, открою секрет и сообщаю дорогу. Вам нужно выйти на Личный кабинет
Как выйти на личный кабинет со списком сервисов

Залогиниваемся - Настройки - Настройки профиля Google - Приватность - В самом низу страницы - Google
Личный кабинет - Тыкаем на Войти в Личный кабинет и получаем список своих сервисов и вебмастер тоже

Вот так это выглядит

Сижу и думаю, зачем я рисую эту тупейшую тему? Но сколько усилий и армейской смекалки мне стоило чтобы пробраться в вебмастер по лабиринтам, то тема сразу кажется не тупой.
Очень очень неудобно, надо везде догадываться, путь тернист и извилист и более похож на квест.
Странно, что такой высокотехнологичный гигант как Гугл мог создать настолько недружелюбный к пользователю интерфейс. Или они хотят чтобы мы развивались? Квесты наверное развивают. Этот квест мой был пройден аж за 20 минут. Остальные интерфейсы в виду своей деятельности я воспринимаю в диапазоне от 10 секунд до 5-и минут максимум!