css & seo

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

Зачастую видеть параграф-ссылку совсем неэстетично.

Имеем ссылку:

‹a href="#"›‹em›Много ключевых
слов… очень много… связанных с сайтом‹/em› «Рога и копыта»…‹/a›

И капельку CSS:

a em {
    display: none;
}

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

Время революции пришло…

Таким странным заголовком хочу выразить своё удивление по поводу того, как много вопросов я вижу в последнее время на форумах про «блочную» вёрстку.

Вакансии пестрят требованиями — кроссбраузерная, валидная, «дивная» вёрстка.

Похоже, люди заинтересовались всерьез, хотя для многих она остаётся «дивной». Об этом можно судить по вопросам. Таблицы настолько глубоко засели в сознании, что новички продолжают мысленно делить макеты таблицами. В «дивной» вёрстке недостаточно заменить td на div. Нужно думать иначе.

У меня же получилось. Получиться и у вас. Я тоже начинал таблицами. Пол года я верстал именно так. Потом, пол года, я осваивал наработки «дивной» вёрстки. И сделал выбор.

Уже больше года я не делал сайты на таблицах. Это же так сложно! Столько мусора в коде и ненужных проблем… зачем, мне это?

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

Почему тормозим? В чём у вас возникают основные проблемы при изучении CSS?

Медальки — новая мода

Встречались мне на сайтах такие круглые штучки. На одном, потом на другом. Потом alistapart сделал редизайн, и круглая медалька на самом видном месте. Денис Перехрест делает редизайн и опять медалька в шапке… Кто следующий?

А, может я параноик? :)

maniacalrage.net rubytuesday.com alistapart.com inforedesign.com

cssdesign & validator

Каждый второй сайт, который поступает по заявкам в cssdesign.ru не проходит валидацию, мне вот стало любопытно… а, на что они надеются?

Философия в картинках

Моя философия(скорее не только моя), относительно тэга ‹img› заключается вот в чём:

«Картинки на сайте должны быть только там, где они есть на самом деле.»

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

Многим это с непривычки это кажется невозможным… отнюдь.

Я вспоминаю те времена, когда на одном сайте, который я «резал» у меня получилось 182 картинки. Триумф «табличной вёрстки». Только представте себе, 182 тэга ‹img› в коде, которых там быть не должно!

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

Когда в коде встречается 5-10 идущих подряд дивов, есть о чём задуматься. Теряется эстетика кода, логика, семантика. Иногда, приходится делать маленькие исключения. И мечтать о скорейшей поддержке CSS 3.

Супер CSS-ластик

Когда мне надо сделать хороший css-сайт я пишу в таблице стилей:

* {
margin: 0; padding: 0;
}

Этот код убивает вме отступы у всех тэгов. Остаётся их назначить самому, и наслаждаться неизменно превосходным результатом :)

Валидный flash

По наводке Alex’а Mauzon’а наткнулся на симпатичные вставки flash, и главное — валидные, ничего лишнего.

Смотрите:

<object type="application/x-shockwave-flash" data="flash.swf" height="100" width="300">
<!--[if IE]><param name="movie" value="flash.swf"><![endif]-->
Test
</object>