Система купли-продажи ссылок INDEK.Биржа, не только открывает новые возможности по более эффективной монетизации сайтов, но и анонсируют очень привлекательную двухуровневую партнерскую программу. Которая будет интересна как вебмастерам и владельцам собственных ресурсов, так и всем активно работающим в сети людям. , не только открывает новые возможности по более эффективной монетизации сайтов, но и анонсируют очень привлекательную двухуровневую партнерскую программу. Которая будет интересна как вебмастерам и владельцам собственных ресурсов, так и всем активно работающим в сети людям.
“Привычный взгляду” интерфейс и удобная функциональность, при всех положительных отличиях INDEK.Биржи, позволяет работать на площадке в привычном режиме, поэтому освоение данной системы не займет много времени. Но все же, интерфейс выглядит пока сыровато: не работают некоторые ссылки, форма регистрации мало соответствует правилам юзабилити. Думаю, что разработчики торопились с запуском, поэтому все будет дорабатываться в процессе.
Провести юзабилити-тест сайта – очень мудрая затея. Хороший интерфейс – это не только удобство навигации, но и простота восприятия сайта в целом, а значит, еще и довольные посетители, и покупатели.
Однако, не все идеи по улучшению интерфейса могут быть воплощены на практике, т.к. для одних пользователей они кажутся превосходными, а для других – совсем наоборот.
В данной статье мы рассмотрим 10 online инструментов, которые помогут улучшить юзабилити вашего сайта, даже с небольшим бюджетом. Как дизайнеры и разработчики, мы, как правило, не можем корректно судить о собственном произведении: если мы это сделали, значит, мы знаем как оно работает.
Значение многих атрибутов описания характеристик объектов на Web-страницах выражается в цифрах. Цифры сопровождаются названием единиц измерения. Не всегда обязательно эти названия приводить, поскольку броузер распознает некоторые единицы по умолчанию, но для точного определения значений атрибутов элементов документа нужно знать как сами единицы, так и способы их записи.
Единицы измерения, применяемые в описании многих свойств элементов документов, можно разделить на два типа: абсолютные единицы и относительные единицы. Значения одних и тех же атрибутов могут выражаться как в абсолютных, так и в относительных единицах. Например, для описания высоты шрифта могут использоваться абсолютные единицы – миллиметр (mm) или пика (pc), или же относительные единицы, например пиксели (px), величина которых зависит от разрешающей способности экрана. Или проценты, в которых можно выражать величины, составляющие часть или многократное повторение других величин (например, 75% ширины экрана).
Довольно часто дизайнеров справедливо обвиняют в том, что, создав дизайн сайта, они уходят в свой кокон и замыкаются в неведении, оставляя всю «грязную работу» по воплощению дизайна в жизнь разработчикам. Такая равнодушная позиция отмечается не только в индустрии создания сайтов, но и при разработке программного обеспечения и игр.
Суровая действительность указывает на то, что весь процесс разработки должен происходить при участии дизайнеров. Для достижения оптимальной эффективности дизайнер должен уметь не только нарисовать картинку, но и встроить ее! В этой статье я хотел бы поделиться несколькими соображениями о том, почему дизайнеры должны уметь верстать сайты.
Имея четкое представление о том, как будет реализовываться конечный продукт, дизайнер будет предлагать более реальные и практически осуществимые идеи. Поскольку работа дизайнера является неотъемлемой частью процесса разработки сайта, он должен озаботиться тем, чтобы дизайн можно было успешно претворить в сетевую реальность, в частности, учитывая юзабилити сайта, удобство его просмотра и доступность. Дружественный интерфейс сайта подразумевает не только удобство и четкую логическую организацию навигации, но и предоставление пользователю всей необходимой ему информации упорядоченно и не перегружая его сверх меры. Единственный реальный способ узнать, правильно ли «работает» ли верстка сайта, - это научиться делать ее самому.
Упрощение коммуникаций
Фактически, продукты, разработанные одними людьми и воплощенные другими, никогда не оправдывают ожиданий всех участников, особенно это касается неосязаемой продукции, такой как веб-сайты, программное обеспечение или игры. Обычно все заканчивается компромиссом между тем, что ожидалось, и тем, что возможно осуществить на деле. Все вроде бы уловили общую идею, но редко когда получается передать ее в точности. Панацея от этого - сделать так, чтобы дизайнеры не только генерировали идеи, но и пожинали плоды их реализации. Тогда исключается путаница, недопонимание и искаженная передача информации.
Удобный циклический процесс разработки
На практике, готовый дизайн не должен всегда быть окончательным вариантом. Я имею в виду, что он должен быть гибким, чтобы его можно было менять и адаптировать под технические ограничения системы без утраты его изначальной сущности. Такие многократные и неизбежные изменения могут осуществляться только самим дизайнером. Дизайнер/разработчик в одном лице может вносить необходимые изменения гораздо быстрее, чем если бы разработчику приходилось повторно отсылать макет дизайнеру, который, к тому же, редко находится в пределах досягаемости, чтобы внести изменения. К тому же, в такой ситуации могут возникать - и часто возникают - трения между дизайнерами и разработчиками.
Лучший и более гармоничный результат
Я люблю проводить параллель между созданием ПО, сайтов или игр и оркестровой музыкой, когда дизайнер сравнивается с композитором, а разработчик с руководителем ансамбля или дирижером. Представьте, что будет, если дирижер сам является композитором? Я думаю, это придаст симфонии поистине превосходное звучание и очарование. Ведь она не только была написана мастером своего дела, но и сыграна под руководством своего создателя!
Экономия времени на разработку
Если дизайнер умеет верстать сайты, то стадии дизайна и верстки происходят непосредственно одна за другой, если не одновременно. Получается, на разработку затрачивается меньше времени - а кому не хочется, чтобы работа шла эффективнее?
Дизайнер начинает соответствовать требованиям рынка
Сегодня дизайнеру, чтобы оставаться востребованным, нужно постоянно расширять свое портфолио и улучшать свои конкурентные качества - уже недостаточно обладать каким-то одним набором навыков. Часто приходится быть мастером на все руки - и дизайнером, и разработчиком пользовательских интерфейсов, и копирайтером, и менеджером проекта.
Умея претворять свои дизайнерские работы в жизнь, а не оставляя их на милость разработчиков - вы повышаете свою ценность. К тому же, указанные рядом в резюме навыки дизайна и верстки сайтов еще никому не мешали. Даже наоборот, это делает сотрудника более востребованным и незаменимым, что жизненно важно в наше экономически неспокойное время корпоративной реорганизации (тотальной экономии) и сокращения штатов (массовых увольнений).
Однако, у такого сценария, когда дизайнер занимается версткой своих инноваций, есть и недостатки.
Как написал Лукас Мэтис (Lukas Mathis) в одной противоречивой статье на нашу тему под названием «Дизайнеры - не программисты» [1]:
Если дизайнер претворяет в жизнь собственные идеи, перед ним стоят две разные задачи: написать качественный код и создать приятный пользовательский интерфейс. Эти две задачи противоречат друг другу. Если вам необходимо самому воплощать свой дизайн, вам придется чем-то поступиться ради качества кода, а это повредит дизайну.
Дизайнеры, сами занимающиеся версткой сайтов, сталкиваются с двумя проблемами: они знают, когда новая замечательная идея может вылиться в неряшливый код, и они знают, где имеющийся код может повлиять на качество пользовательского интерфейса. Таким образом, две их задачи противоречат друг другу, поскольку пользовательский интерфейс включает множество мелких деталей, а эти мелкие детали приводят к нежелательному загромождению кода.
Отсюда вытекает нелегкое решение, принятое пуристами от веб-разработки. Они придерживаются старой школы, выступающей в защиту четкого разграничения между дизайном и разработкой. В самом деле, дизайнеры творят для людей, а разработчики программируют для компьютеров. Таким образом, дизайнеры, заботящиеся о восприятии пользователем, должны создавать максимально удобные пользовательские интерфейсы, а разработчики должны принимать оптимальные решения в программировании. Хотя в этом и есть разумное зерно, но сам я заметил, что безуспешно пытаюсь абстрагироваться от кода, работая над пользовательским интерфейсом, и, в конечном счете, удобнее иметь в виду ограничения, связанные с техническим воплощением и удобством использования.
Заключение
Учитывая все сказанное, объем разрабатываемого проекта может, в конечном итоге, определять роли, которые отводятся в нем дизайнеру и разработчику. Небольшое приложение может с успехом контролировать менеджер проекта [2], в то время как обширной системой, определенно, должен управлять специализированный персонал!
Спасибо Роману Настенко за интереснейшую акцию по обмену трафиком для блоггеров. Суть очень простая: нужно установить у себя на блоге небольшой скрипт Google Reader, который будет отображать записи из блогов, на RSS которых вы подписаны. Затем отмечаетесь в комментариях на странице акции у Романа и попадаете в так называемый список “желанных блогов”, что дает вам преимущество получить новых подписчиков.
А теперь о бонусе :) Как установить блок Google Reader подробно написано на странице акции, я же хочу вам рассказать как можно этот блок стилизовать конкретно под ваш сайт с помощью CSS. Начну с того, что перечислю, какие стили используются для отображения блока:
#readerpublishermodule0 { } /* главный контейнер. В CSS для этого блока можно прописать нужную вам ширину, фон и границы; */ #readerpublishermodule0 .f { } /* блок с надписью "Читать еще"; */ #readerpublishermodule0 h3 { } /* заголовок вашего блока (у меня называется "Я читаю"); */ #readerpublishermodule0 ul { } /* блок списка с записями */ #readerpublishermodule0 ul li { } /* пункты с записями */ #readerpublishermodule0 ul li a.i { } /* ссылка на запись */ #readerpublishermodule0 ul li div.s { } /* блок, где размещается информация о том, какому сайту принадлежит запись */ #readerpublishermodule0 ul li div.s а { } /* ссылка на сайт, где размещена запись */
Важно! Чтобы прописанные вами стили “заработали”, в некоторых случаях, у правил придется приписывать !important, т.к. все стили прописаны в исходном коде и просто так не перепишутся.
Например, это потребуется, для переопределения цвета ссылки на запись:
#readerpublishermodule0 ul li a.i { color:#084C69 !important; }
Теперь вам не придется лазить по исходному коду в поисках нужного элемента. Просто скопируйте нужные вам блоки в CSS файл и настраивайте на свой вкус и, конечно же, под дизайн вашего блога :)
Релиз состоялся 10 июня. В новой версии, как и должно быть, довольно много нового. И обновление движка для пользователей будет очень полезно. Давайте обобщим наиболее важные обновления движка, а также рассмотрим несколько пунктов, которые вы должны знать, прежде чем обновить блог.
Прежде чем обновить движок
Есть 2 важных замечания, которые вы должны учесть, прежде чем обновить движок: совместимость плагинов и совместимость темы.
1. Совместимость плагинов
Это наиболее важный пункт, который вы должны обязательно проверить. Мы используем множество различных плагинов для расширения возможностей блога. Как минимум один из этих SEO-плагинов, не так ли? Если установленные плагины не совместимы с новым Wordpress 2.8, это может привести к некорректной работе всего блога! Wordpress 2.8 Codex составил плагинов, которые прошли проверку на совместимость с новой версией.
Кроме этого, проверить совместимость плагинов вы можете на сайте BraveNewCode, где выложен огромнейший . В настоящий момент список содержит около 5040 плагинов:
Если вы не нашли какой-либо плагин в списке, свяжитесь с автором плагина, прежде чем обновить блог.
P.S. Мой плагин помечен там как несовместимый, однако я уже исправила это и теперь вы можете и использовать его в версии 2.8.
2. Совместимость тем
После того, как вы убедились, что плагины будут работать корректно, необходимо проверить совместимость вашей темы с Wordpress 2.8. В большинстве случаев, темы будут полностью совместимы, но скорее всего, кроме тех, которые используют множество функций и фильтров. Вы можете посетив Wordpress Codex.
Тем, кто использует авторские и уникальные темы, советую обратится к их авторам.
Хотите профессионально изучать с преподавателями из-за рубежа? On-line. Играй в Carnage!
Что вас ждет после обновления
Если вы уже убедились, что установленные плагины и темы полностью совместимы с новой версией движка, то вы совершенно уверенно можете обновить блог и наслаждаться новыми возможностями. Ниже мы рассмотрим 8 преимуществ Wordpress 2.8.
1. Установщик тем
В версии Wordpress 2.7 был добавлен Установщик плагинов, который упрощает загрузку плагинов до пары кликов. Теперь, в Wordpress 2.8 добавлен Установщик тем.
Вы можете найти тему по ее специальным возможностям, цвету, количеству колонок и ширине. Вы также можете загрузить вашу собственную тему через встроенный загрузчик или проводник Установщика тем. В Wordpress 2.8 добавлена возможность установить тему в один клик!
2. Улучшенное управление темами
В предыдущей версии, кликая на скриншот темы и после на ссылку активации мы могли увидеть тему в действии, т.е. превью. Однако не всегда это получалось сделать, т.к. возникали ошибки из-за плагинов.
И теперь, с новой системой управления темами, вы можете запросто активировать/просматривать/удалять любую тему.
3. Улучшенный редактор тем/плагинов с подсказками функций и подсветкой синтаксиса
Если вы уже использовали встроенный редактор в предыдущей версии, то теперь вы увидите насколько он стал еще удобнее. Взгляните на скриншот:
Теперь в редакторе есть подсветка синтаксиса и всплывающие подсказки с функциями согласно документации движка.
4. Редактирование комментария одновременно с редактированием записи
В Wordpress 2.8 появилась возможность редактировать комментарии во время редактировании записи. Комментарии расположены в отдельном блоке, который по умолчанию находится под блоком Обсуждение. Теперь комментарии можно запросто одобрять, запрещать, удалять, помечать как спам не покидая страницы редактирования записи.
5. Улучшенная система управления тегами
В Wordpress 2.8 появилась новая улучшенная система управления тегами. Как и в управлении категориями, вы можете добавлять/удалять название тега, описание, метку. Главное отличие версии 2.8 и предыдущей в возможности добавлять описание к тегу, как в категориях.
6. Улучшенный интерфейс системы управления виджетами
Изменений в управлении виджетами не так много. Но в первую очередь удивляет новый интерфейс. Теперь сайдбары с виджетами находятся отдельно, в отличие от предыдущей версии, где их нужно было выбирать из выпадающего списка. Стало намного удобнее.
Кроме этого, в новой системе управления виджетами появился блок называемый Неактивные виджеты, в котором помещены те виджеты, которые были ранее активны - их настройки сохранились, на случай если пользователь захочет снова их активировать.
7. Выбор часового пояса и переход на летнее время
В предыдущей версии вы должны были вручную выбирать часовой пояс для указания летнего времени. В новой версии вам достаточно просто выбрать город, который находится в вашем часовом поясе и движок автоматически будет обновлять переход на летнее время. Для этого требуется PHP не ниже 5.1.0.
8. И наконец, улучшенные настройки доски объявлений
Новые опции позволяют выбрать то количество колонок, которые вы выберите для отображения на вашей рабочей доске.
Прежде чем передавать готовую верстку заказчику, вы должны быть уверены, что все необходимые элементы учтены и изменение контента не приведет к “развалу” страницы. Поэтому хочу привести свой небольшой проверочный список пунктов, которые должны быть учтены при верстке.
Даже если body не имеет никакого фона, обязательно прописывайте background, дабы избежать некорректного цвета, в случае если на компьютере изменена палитра.
body {background:#FFF}
2. Минимальная ширина
Если вы верстаете “резиновый” дизайн, вам необходимо напомнить заказчику, что должна быть минимальная ширина, при которой страница на развалится. Как правило, это либо 1004px, либо 780px. Если вы верстаете под IE6, то вам придется использовать специальную , либо воспользоваться JS скриптом, исправляющим многие недостатки IE6. Я использую скрипт IE7.js JavaScript library.
3. Наличие правил для отсутствующих элементов в дизайне.
Здесь я имею ввиду правила для заголовков H1-H6, посещенных и активных ссылок (a:visited, a:active), списков (ol, ul), таблиц, форм. Все стандартные элементы, которые не присутствуют в дизайне, но процент их использования велик - должны быть прописаны в CSS. Не стоит лениться, воспитывайте в себе обязательство всегда выполнять полноценную верстку.
4. Картинки-ссылки
Этот пункт я вынесла отдельно, хотя он и относится к предыдущему. Не забывайте обнулять границы у картинок, которые обернуты в ссылку (если конечно, для таких картинок не предусмотрен отдельный дизайн).
a img {border:none}
5. Проверка в браузерах, указанных в ТЗ
Как правило, это FF2/FF3, Opera 9, IE6/IE7, Safari. Я тестирую верстку для IE6 в IETester (там же есть и 7й, и 8й).
6. Семантика во всем
Следите за тем, чтобы ваш код был как можно более правильным и читабельным. Советую почитать об этом статью на моем блоге.
7. Вес страницы
Важно помнить о том, что вес страницы должен быть как можно более минимальным. Постарайтесь избегать громоздких картинок и скриптов. Как оптимизировать вес страницы можно узнать из этого обзора.
8. Валидность
И в заключение, не забудьте , впрочем как и CSS. Даже если это не обязательный пункт ТЗ, то сделайте это для себя, чтобы в будущем не делать ошибок.
А вы учитываете эти пункты при верстке? Буду рада вашим дополнениям к списку :)
Принимаю от и расскажу о железе своей машины :)
Работаю я на ноуте ASUS F7Z:
Процессор
AMD Turion 64 X2 RM-70 2 GHz
Кэш L2
1 Mb
Экран
17″ (43.2 см)
Разрешение экрана
WXGA+ (1440×900)
Видео
интегрированная ATI Mobility Radeon
Оперативная память
3072 Mb DDR2 RAM (расширяется до 4096 Mb)
Привод
DVD-RW
Жесткий диск
320 Gb (5400 об/мин)
Программное обеспечение
Windows Vista™ Home Premium
Порты и коммуникации
5 x USB 2.0 Wi-Fi Bluetooth Выход на внешний монитор VGA IEEE 1394 (FireWire) Веб-камера HDMI ТВ-тюнер
Провести юзабилити-тест сайта – очень мудрая затея. Хороший интерфейс – это не только удобство навигации, но и простота восприятия сайта в целом, а значит, еще и довольные посетители, и покупатели.
Значение многих атрибутов описания характеристик объектов на Web-страницах выражается в цифрах. Цифры сопровождаются названием единиц измерения. Не всегда обязательно эти названия приводить, поскольку броузер распознает некоторые единицы по умолчанию, но для точного определения значений атрибутов элементов документа нужно знать как сами единицы, так и способы их записи.
