Настроить переключение клавиатурного регистра с английского на русский в Ubuntu не составляет проблемы, используя стандартный интерфейс настройки системы — Система / Параметры / Клавиатура / Параметры раскладки / функция смены раскладки и далее выбираем нужное (привычное) сочетание клавиш. Это все просто. Настоящие траблы начинаются тогда, когда символы, которые напечатаны на клавишах вашей клавиатуры не совпадают с теми, которые реально печатаются. Вот это, действительно, раздражает. Все время сбиваешься и приходится вспоминать. А это потеря темпа. И если вашей клавиатуры (типа или бренда производителя) нет в списке “Модель клавиатуры” меню “Раскладки” (см. выше) — то остается только тихо ругаться. Но выход есть.

Умудренный оптом Unix администрации коллега нашел такой выход достаточно быстро. Обладая правами root (в Ubuntu sudo –i) проходим в каталог /etc/X11 и находим там файл xorg.conf . В 48 строке после пробела после слова “XkbVariant” в пустых кавычках вписываем “,winkeys” (без кавычек, естественно) и перезапускаем иксы. (Ну или просто перезагрузите систему).
Вуаля! Все становится на свои места и теперь клавиатура функционирует одинаково в обоих ОС. Мне это помогло, надеюсь, поможет еще кому-то.

Иногда бывает, что при перезагрузке слетает установленная до этого в предыдущем шаге “переключалка” регистров — не страшно, просто повторите эту процедуру еще раз с помощью меню.

На сегодняшний день у меня всего 14 постингов, 3 из которых пользуются популярностью и я, вот не поверите, регулярно натыкаюсь на именно эти три постинга и самый “лояльный” референс был такой: “материал взят с сайта Айди Контент”. Нормальные пацаны?

Но вчера друг прислал ссылку на вот это www.elementdesign.ru/info/1/
(там три страницы такого, так может есть и ваше)

Скриншот, 33 кБ.

Не знаю, как это будет по-русски, а в Украине в таких случаях говорят: “Ну цэ, тля, ващще!”

И PR у первого каталога со статьями — троечка.

Я заметил интересную особенность — с главной страницы этой, с позволения сказать, веб-дизайнерской студии, нет ссылки на каталог со статьями, что, впрочем, врядли оправдывает этих ребят. Если вы “для себя” чужие статьи копируете — закрывайте общий доступ из Сети.

Специально для этих ребят хочу повтроить прописные “человеческие” истины, которые нужно учитывать, при использовании чужих материалов в Интернет.

Во-первых, стоит спросить разрешения, в 99% случаев вы его получите. Во-вторых, надо ставить гиперссылки на источник. (Тогда и разрешения спрашивать вообще-то не нужно, это ваше право). Гиперссылка — это такая штука, по которой можно “кликнуть” и которая регистрируется поисковыми роботами. Это ситуация “win-win”. Ну и в-третьих, все тайное становится явным, рано или поздно и вас “расшифрует” кто-нибудь. И возможный подрыв репутации будет куда сильнее своим эффектом чем теоретическая выгода (вот скажите мне — какая?) от “несанкционированного” использования чужих материалов на своем сайте.

Ставьте гиперссылки, дамы и господа, и вам воздастся.

Слегка популярные статьи на сайте “Айди Контент”:

Чем веб-дизайнер отличается от HTML кодера

Веб-разработка средствами Open Source

Процесс веб-дизайна. Как найти контент

1. Сколько стоит надежный хостинг?

Сразу оговорюсь, — этот постинг написан с потребительской точки зрения, — мне надо не хостинг купить на самом деле, а сайт разместить, в хорошем месте, “чтоб работал” (99,99% uptime), чтобы на мои вопросы, вдруг возникнут, круглосуточно отвечали в течении 20–30 минут. Причем внятно отвечали, как в том анекдоте, — “ты мне не Зюйд-Зюйд-Вест, ты пальцем покажи”, а то некоторые некомпетентные товарищи из службы поддержки начинают рассказывать, что я сам-де могу свои настройки Apache’a поменять. И это после того, как попросил, например, 403 включить на отсутствие индексного файла в основном каталоге — у нормальных хостеров включена по-умолчаннию.

Итак, у вас есть задача разместить простой, среднестатистический блог на платном хостинге. Берусь утверждать, что более $100/в год платить не разумно. Есть предложения $120/2 года (сразу платить). Но это просто цифры, а что предлагают нам за эти деньги?

2. Что входит в хостинг-пакет?

Судите сами: 96$ /год или 120$ /2 года. Но эта радость будем вам в том случае, если у вас есть кредитка Visa или Mastercard или American Express и вы не испытываете серьезных проблем в общении на английском языке и/или вашим клиентам не нужны документы, подтвержающие платежи.

Того, что входит в эти пакеты “навсегда хватит” 99% пользователей или клиентов. К тому же, вы сможете 5 раз “отбить деньги” на каждом своем аккаунте.

“Зачет”? Тема раскрыта? Поправьте меня, пожалуйста, если я ошибаюсь.

Патриотический хостинг

Но иногда нет кредитки, есть прихотливые клиенты, которые не хотят платить за год (ну хотят поторговаться, бывает такое, им волю дай они бы и домен понедельно оплачивали) или хочется чего-то особенно специфического. (Рекомендовано geek’ам, блоггерам и любителям недорого поиграться с возможностями современных веб-ориентированных языков программирования).

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

Конечно, очень серьезный интернет-проект может потребовать размещения своего собственного сервера в точке обмена трафиком, но это совершенно другая история (равно как и деньги).

P.S.
Конечно, я никак не связан с этим хостерами и мне за эти рекомендации ничего не будет :)

Тщательно все спланировать

Независимо от того, работаете ли вы полностью самостоятельно (что, безусловно, сложнее организационно, но легче технически) или работаете в команде, — самым лучшим средством планирования, лично для меня, является лист формата А4 и карандаш. Нарисовал страничку — поделил на предполагаемые основные зоны (div’ы), а их, в свою очередь, если нужно поделил на подзоны, визуально выделил каждую и пронумеровал. Кто учился в институте — знает как делать эскизы, главное, это чтобы вам было понятно (я исхожу из того, что эти эскизы нужны только для вас, и не есть частью документации по текущему проекту).

Отложите этот лист недалеко. Возьмите другой для вторичной страницы. Повторите процедуру, но уже учитывая пронумерованные блоки на главной странице. Очевидно, что на первой и второй странице будут блоки, которые совпадают, поэтому у них должен быть совпадающий номер. Я очень надеюсь, что суть вам понятна — нужно найти и обозначить одни и теже функциональные блоки в будущем XHTML коде веб-страниц сайта. Если есть страницы более глубокие — повторяйте эту процедуру до тех пор, пока не закончите.

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

Грамотно присвоить имена элементам XHTML структуры

Фокус в том, чтобы правильно “обозвать” пронумерованные вами ранее функциональные блоки. Сразу скажу, — пренебрегать этим просто глупо. Функциональным элементам структуры нужно присваивать функциональные имена. Это значит, что имена нужно присваивать основываясь на том, что данный элемент структуры делает, а не на том, как он сейчас выглядит. И тогда, даже через год, вы сможете быстро сообразить, что это за элемент и зачем он нужен на странице.

Простой пример. Можно назвать боковую панель redsidebar, а можно и outsidelinkblock. Как называть блоки — дело ваше, главное, чтобы это было вам понятно и носило функциональную окраску. Тогда ваша структура реально не зависит от презентации — дизайна и может иметь таких дизайнов сколько угодно. К тому же, пару раз воспользовавшись этой методикой вы, скорее всего, станете присваивать одинаковые имена одинаковым функциональным блокам на разных сайтах. Если это произошло — ваша эффективность как кодера возросла. Вот парочка интересных ссылок о том, как люди называют свои блоки в HTML структуре:

What’s in a name
What’s in a name (pt2)

А так же:

Use class with semantics in mind
Structural Naming

Компетентно использовать id и class’ы

Атрибут id или уникальный идентификатор, в отличие от атрибута class, может быть включен в код конкретной валидной страницы только один раз, для этого (идентификации элемента) и предназначен. Любая веб-страница имеет свой набор уникальных (единственных для каждой страницы) элементов, например #global-navigation, #search и так далее. Также, надо помнить, что у конкретного HTML элемента может быть только один id. А вот классов может быть несколько (сколько угодно), поэтому их можно “сцеплять”, как, например, в следующем коде:
<ul id="lookalsolinks" class="intext bullets outside"></ul>

Здесь я (зачем-то, для примера) захотел добавить буллеты (.bullets) к списку ссылок в тексте (.intext) и указать визуально признак того, что это внешниие ссылки, например прописав картинку в классе outside. Конечно, все это можно сделать и в одном классе, но тогда у меня не будет возможности манипулировать этими параметрами. Обращаю ваше внимание на то, что я не призываю плодить ненужные классы, наоборот, я предлагаю использовать возможности CSS эффективно и “гибко”.

Использовать CSS манипуляции с XHTML элементом body

Присваивая конкретный класс элементу body на конкретной странице вы обретаете возможность кардинально сменить CSS параметры как всей страницы в целом, так и отдельного элемента на такой странице. Этот класс работает как переключатель. Освоив эту технику вы сможете менять дизайн каждой отдельной страницы и “подсвечивать” навигацию, например текущее расположение пользователя на сайте. Все просто как 2x2:
body {background:#fff;}
body.about {background:#fff url(aboutus.jpg) top right no-repeat;}

И продолжая эту тему, подсвечиваем (изменяем стиль по умолчанию на другой) в меню ссылку “О Нас” на странице “О нас”, указывая тем самым “местоположение” пользователю на сайте:
body.about ul#navigation a#aboutuslink {color:#f50;}

Естественно, вы можете писать какой-угодно стиль, изменяя все, что угодно, а не только цвет. Три строчки кода — и 2 решенные серьезные задачи :) — альтернативный дизайн страницы “О нас” и улучшение usability сайта. Ну а что вы хотите? Современный CSS дизайн.

Использовать CSS каскад

Вот как использую его я. В коде страницы я прикрепляю css файл для отображения на экране компьютера (media screen). Этот файл называю почти всегда screen.css В этом файле содержится следующий код:
@import url(layout.css);
@import url(typo.css);
@import url(visuals.css);

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

Использовать стандартные возможности CSS по полной программе

Никита Вакорин, from Umade.ru замечательно на мой взгляд перевел статьи Роджера Йохансена (Roger Johansson) CSS tips and tricks, для начинающего CSS дизайнера — “источник мудрости и вдохновения”, переводы прочесть просто необходимо, вот они:

CSS: советы и приёмы, часть 1
CSS советы и приёмы, часть 2

Подводя итог, в очередной раз хочу напомнить, что CSS это не “rocket science” и все зависит от практики и желания. Чем быстрее человек освоит CSS, тем быстрее его работа станет похожа на творчество, а не на тупое переписывание табличных тегов.

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

XHTML врядли можно считать языком программирования, но свои “языковые конструкции” он точно имеет. Остается только использовать эти конструкции по назначению.

Правду сказать, — все очень просто. Сложности, у некоторых, начинаются там, где надо использовать CSS. А поскольку эти самые “некоторые” изучать CSS, прямо скажем, не хотят, то и продолжают делать меню с помощью табличных тегов (<td>ссылка</td>), а заголовки с помощью тегов <b>. Но я думаю, что такой код свидетельствует о компетентности кодера лучше, чем все остальное.

XHTML имеет простую и понятную структуру

В набор тегов (tag set) входит все, что необходимо для написания HTML кода веб-страницы в соответствии со стандартной спецификацией.

Особенно замечателен (во всяком случае для меня) факт, суть которого заключается в следующем: (X)HTML структура нормального веб-сайта, может состоять из простейших тегов элементов, таких как заголовки <h1>, абзацы <p>, нумерованные, ненумерованные списки <ol>, <ul>, списки определений <dl>, формы <form> и, конечно, ссылки <a>. Добавьте к этому набору тэги, объединяющие эти элементы в логические блоки — <div> или <span> и вы получите впечатляющие результаты. Конечно, визуально таких же результатов можно добиться, просто порезав картинку на слайсы в Image Ready, но будет ли конечный продукт современным веб-сайтом, очень большой вопрос.

Рискну предположить, — суть метода “семантической” HTML верстки в использовании тегов, соответствующих по смыслу содержанию. Что представляет из себя навигация сайта? Это список, состоящий из ссылок. Как правило, это ненумерованный список — unordered list — <ul>. Тогда навигацию можно закодировать, например, так:

<ul><li><a>ссылка 1</a></li><li><a>ссылка 2</a></li></ul>

или вот так, если это список определений, definition list — <dl> :

<dl><dt><a>Мобильные телефоны</a></dt>
<dd><a>Nokia</a></dd>
<dd><a>Motorola</a></dd></dl>

Выбор того или иного набора тегов зависит от контекста и личных предпочтений. Надеюсь, что из этих примеров видно, что ничего сложного в этой концепции нет. Эта “best practice” известна давно. Я не могу понять почему до сих пор люди пишут меню сайтов, используя совершенно не предназначенные для этого табличные теги? Особенно, если учесть, что их код получается гораздо больше и практически абсолютно недоступным (inaccessible) для альтернативных устройств. Хотя нет, — могу понять, эти люди просто не хотят изучать CSS.

Откуда берется семантика

Веб-страницы состоят из заголовков (статей например или каталогов с описаниями), блоков текста, списков ссылок, табличных данных и форм. Для каждого из этих элементов есть свои наборы тегов. Конечно, такие наборы не универсальны. Именно поэтому и существует XML. Но, к сожалению, на сегодняшний день развитие технологий опережает их внедрение и поэтому XML люди вынуждены конвертировать в XHTML, который понимает MS IE. :)

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

Но с помощью того же XML можно создать стандартизованный формат, описывающий информацию по известным правилам, где каждый конкретный элемент несет заведомо определенное значение, которое и есть семантика этого конкретного элемента. Например? RDF или набирающие обороты Микроформаты.

Отлично. Но для чего нужна эта семантика?

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

Мы можем внести свой скромный вклад в процесс превращения информации в знания просто кодируя содержание веб-страниц в соответствии с семантическим значением элементов стандартизованного формата XHTML.

Если Вы пользуетесь браузером Firefox, есть простое и очень эффективное средство решить эти проблемы, а заодно и некоторые другие.

ScrapBook — расширение Firefox

ScrapBook — уникальное по своим свойствам расширение. Этот инструмент позволяет вам создавать различные тематические коллекции (с пролинкованным содержанием) , состоящие из отдельных веб-страниц или целых сайтов. Эти коллекции вы можете группировать в каталоги и вообще — управление полное. Сохраняя таким образом страницу, вы можете вписать сколь угодно большой комментарий к каждому отдельному ресурсу до его сохранения (очень удобно на сайтах, которые блокируют Javascript) или сделать этот комментарий потом.

Персональная tagsonomy

Но самое интересное, на мой взгляд, то, что поддерживается поиск внутри всей коллекции. (Одна из моих составляет около 3 гигабайт, — есть где поискать). Ничто не мешает отметить тэгом (ключевым словом) нужную страницу и — вуаля — ищет по слову все ресурсы, этим словом отмеченные. Надо ли говорить, что в дополнение к комментарию (который вообще-то слишком долго писать) можно через пробел вписать сколько угодно тэгов и искать потом в своей коллекции, используя собственную tagsonomy. Во всяком случае для меня это очень удобно. Все дело в том, что мы пользуемся довольно ограниченным набором ключевых терминов или “меток” (tags). И все эти термины мы помним “автоматически”.

Если кто еще не пользуется этим расширением — очень рекомендую, экономит время и создает вашу собственную базу знаний, которую целиком или частями можно носить с собой, например на флэшке.

Насколько мне известно, любое умение формируется путем постоянной практики. Если уж вам приходится заниматься чем-то постоянно (а может быть вам это просто нравится), — то, почему бы не заниматься этим с удовольствием.

Операционная система Linux

Почему Linux? Потому, что надежно, устойчиво и безопасно. К тому же, купив или скачав дистрибутив (дистрибутив — это набор программ и программных библиотек, входящих в поставку той или иной версии Линукс), — вы получите практически все, что вам нужно для веб разработки: веб-сервер, базу данных, PHP, редактор и много, очень много других, весьма полезных программ.

Веб-сервер Apache

Надо ли еще что-то говорить? Этот широко распространенный, очень надежный веб-сервер более чем успешно конкурирует с продуктами известных фирм. Apache входит в стандартную поставку Linux (я пользуюсь Mandriva Linux, там точно входит), — нужно только при установке не пропустить момент, когда флажком выделить “Веб-сервер”. По умолчанию работает как и должен.

Базы данных MySQL и PostgreSQL

Тоже входят в стандартную поставку. Просто установите и работайте. Создавать, администрировать и редактировать базы данных можно с помощью простых интерфейсов, я пользуюсь Webmin. Маньяки могут все делать “руками”, из командной строки.

Server side scripting

:) Опять же, практически все есть на установочном DVD. PHP точно есть и Pyton и Ruby.

Веб-редактор Quanta

Quanta+ — очень “взрослый” веб-редактор. Настраивается почти все. Имеет врожденную поддержку UTF-8. Помимо Quanta в дистрибутиве Mandriva Linux 2006 есть еще как минимум 2 других веб-редактора.

А вообще код можно писать вручную в простом текстовом редакторе KWrite. Highlighting (подсветка специфических кусков кода) есть.

Браузеры

Mozilla Firefox и Konqueror стоят по умолчанию. Скачать Оперу под Linux не составляет труда (что-то около 4 Мб без поддержки Java). И вот вам “бонус”. Не берусь утверждать, но думаю, что факт — если ваш сайт выглядит нормально в Konqueror, то в эпловском Safary будет выглядеть только лучше. А все потому, что Safary использует KHTML rendering engine Konqueror’a.

Тестирование. Виртуальная машина VMware

Справедливости ради нужно сказать, что VMware не Open Source. Но, как говорил мой бывший сотрудник:” — В бедных странах очень многие живут по-богатому”, так что, я думаю, справимся :). Установив на виртуальный компьютер винду (XP в самый раз) вы будете иметь все “виндовые” браузеры. Таким образом, перед вами открывается возможность на одном компьютере тестировать свою продукцию на двух операционных системах и соответствующих браузерах. Это очень удобно и эффективно.