Хочется ссылаться на людей по-человечески. Какой-нибудь короткий спецтэг типа <lj user=«имярек»>, а лучше — еще более простой синтаксис.

На дизайнерском сайте Web Design From Scratch опубликовано подробное руководство по дизайну Веб 2.0. Это руководство представляет собой список из 15 дизайнерских приемов, которые чаще всего используются на сайтах нового поколения, с конкретными примерами и скриншотами.

Опубликована предварительная спецификация HTML 5.

Вполне реальный случай на наших дорогах…

Прочитав комментарии к заметке Firefox 3: * {display: block } bug, понял что заметная часть читателей Хабра, в том числе серьёзно занимающиеся веб-разработкой, не совсем верно представляют себе что-то же такое HTML, и почему теги отображаются так, а не иначе.

Примечание: Luke Wroblewski является страшим дизайнером интерфейсов в Национальном Центре Приложений для Суперкомпьютеров, (NCSA), в котором появился первый широко распространенный графический браузер, NCSA Mosaic. В этом центре он проектировал интерфейсные решения для Hewlett-Packard, IBM, и Kellogg's и участвовал в совместной разработке Среды Взаимодействия для Открытого Портала (OPIE). Ниже перевод его статьи о выборе правильной разметки для отображения форм на веб-страницах.

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

–HTML: the Definitive Guide

Вашему внимание предлагается достаточно большой отрывок статьи «Levels of HTML knowledge», написанной Роджером Йоханссеном 30 Мая 2006 года.

Прим. переводчика: Изначально я опубликовал этот пост в виде юмористических выдержек из трех статей, написанных тремя разными авторами и озаглавленных схожим образом: «Уровни владения HTML», «Уровни владения CSS» и «Уровни владения Javascript». Что, конечно же, было довольно глупой затеей. Осознание допущенной ошибки пришло через 5 минут и два минуса к посту и карме. Исправляюсь. Перевод «Уровней владения CSS» ждите завтра.

Вашему внимание представляется вторая часть серии небольших заметок об уровнях владения HTML, CSS и Javascript. Сегодя речь пойдет о CSS. Эта часть является перевод отрывка «Levels of CSS knowledge», статьи, которую 11 января 2006 года на своем блоге опубликовал Эмиль Стенстром, где автор пытается идентифицировать и охарактеризовать основные группы людей, использующих CSS, а так же понять способы влияния на эти группы со стороны движения за веб‑стандарты.

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

Существуют различные методы визуального разграничения информации в таблицах для большего удобства восприятия. Такие как разделение строк таблицы различным цветом. Этот способ известен под названием «Полосатые таблицы».

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

Находится по адресу http://myfreeweb.ru/markup_maker.php он.

С помощью этого простого сервиса ты можешь быстро создать себе резиновый xhtml-макет c базовой разметкой, основу для сайта. Пока только двухколоночные, но скоро к нам завезут поддержку трёхколоночных.

Базовая разметка — значит только блоки и их расположение. Всякие закругления и прочие красивости делайте сами ;) Вёрстка, кстати, валидная. XHTML 1.1, CSS 2.1.

Просто выбираешь сторону и ширину боковой панели и размеры шапки/подвала. Получаешь zip-архив с html и css.

Пользуйтесь с удовольствием ;) Написан на PHP 4.

P.S. Главное предназначение — экономия времени, поэтому и «Я умный».

Описание

Представляю вашему вниманию расширение «человеческого» языка разметки Markdown для использования на хабре.Основные цели:

• Заменить «человеко-читабельный», но отнюдь не «человеко-писабельный» HTML на Markdown.
• Обеспечить поддержку расширенной разметки хабра.
• Автоматизировать загрузку изображений и вставку их URL в статью.
• Добавить подсветку синтаксиса.

Наконец-то, после появления Blend 3 RC, стал доступен Expression Web 3 Trial. Все бы ничего, но вместе с Expression Web 3 идет инструмент SuperPreview, который меняет представление о тестировании разметки в браузерах. Ранее уже писалось об этом инструменте, но он был доступен только для браузеров Internet Explorer. Теперь же появилась полноценная поддержка Firefox (и последних версий тоже).


На скриншоте вы видите работу инструмента: сайт habrahabr для примера. Сравнивается разметка, эталлоном выбран Firefox, на стороне рендеринга IE8 отображается отклонение выбранного элемента разметки. Сравнивать можно с загружаемым исходным изображением, а не только результатом работы браузера.

Поддерживаются браузеры Firefox и IE. В скором времени будет добавлена поддержка Safari. Expression Web — это платное ПО с триалом на 60 дней.

PS: это очень удобно!
PS: в комментариях сообщили что вышла вся линейка Expression! Скачать всю студию разом можно тут www.microsoft.com/expression/try-it/Default.aspx?filter=studio3

 

Представляю вашему вниманию перевод статьи "Redesigning the ExpressionEngine Site" от Jesse Bennett-Chamberlain. Перевели в компании UXDepot. Специально для пользователей Хабрахабра с одобрением издания Digital Web Magazine.

Офицер-пограничник на границе между США и Канадой: «Вы направляетесь по делам или же отдыхать, сэр?»
Я: По делам.
Офицер: Уточните причину, пожалуйста.
Я: Я веб-разработчик и еду на встречу со своим клиентом в штате Орегон для обсуждения проекта.
Пограничник: Как называется компания вашего клиента?
Я: «pMachine».
Пограничник: Вы везете какие-либо сайты с собой?
Я: *недоумевающий взгляд*
Пограничник: В вашей машине есть какие-либо сайты, сэр?
Я: Хмммммм… нет, сайты сейчас на серверах. В машине я ничего не везу.
Пограничник: Тогда как вы хотите показать их вашему клиенту?
Я: Хмм… вообще-то я просто еду на встречу с клиентом для обсуждения сайта, пока я ему ничего не везу.
Пограничник: Хорошо, тогда наслаждайтесь поездкой, сэр.

(30 секунд молчания)

Хизер: В следующий раз скажи, что мы едем на отдых.

 

 

Предисловие

Многое, ранее сделанное с использованием JS, можно реализовать средствами CSS, часто это упрощает некоторые задачи. В статье будет рассказано о том, как выравнить треугольную стрелку балуна по середине по вертикали и о том, как избежать использования изображения для отрисовки этого самого треугольника.

Преамбула

Eclipse и Idea имеют собственные средства визуального редактирования разметки Android-приложения. NetBeans лишен этого счастья. Желание сотворить нечто подобное для привычной NetBeans сравнительно простыми средствами привело к идее перенести процесс визуального редактирования в само приложение. Резонов здесь несколько:

• естественный Preview разметки средствами самого Android;
• возможность автономной работы без desktop-ой IDE (может быть интересно, в первую очередь, дизайнерам);
• «Богу – богово, а кесарю — кесарево». При реализации удобно использовать уже имеющиеся структуры данных View-объектов, константы классов и т.п…

Разметка структурированных данных позволяет показывать дополнительную информацию с вашего сайта в результатах поиска и сервисах Google. Мы рады представить несколько обновлений, которые помогут создавать разметку на сайте:

• Новый Инструмент проверки структурированных данных, который показывает, как Google интерпретирует ваш контент.
• Дополненная документация и правила использования возможностей Google, основанных на технологии структурированных данных.
• Расширенная поддержка синтаксиса разметки JSON-LD.

Инструмент проверки структурированных данных

Новый Инструмент проверки структурированных данных лучше показывает то, как Google интерпретирует разметку структурированных данных на странице сайта.

Привет, Хабр! Начнём неделю с разговора о том, как сочетать в работе JSON-LD и Web Components. JSON-LD – это формат структурирования данных на сайте для их отображения в результатах поиска Google и других поисковых систем. Например, если на сайте представлен список событий, мест или людей, то в HTML-код можно добавитьразметку этих данных при помощи конструкций словаря schema.org в виде кода JSON-LD. Структурирование данных помогает Google лучше понимать содержание ваших страниц и выделять его в результатах поиска. Так можно сообщить о предстоящих мероприятиях посредством функции «Сеть знаний» или показать расширенное описание страниц в поисковой выдаче.