Акваланг
5 Star DIVE CENTER PADI S-21976 просто окунитесь
в другой мир

Новости и события

Дайвинг снаряжение б/у

Фото дня от дайв-клуба

Случайное фото дня


Подписка на рассылку новостей

 
RSS feed RSS Yandex Lenta Google Reader


Learn to dive free! Introdive without playment!

Dive education. Additional doscounts.

Free Wi-Fi zone.

Главная / Блоки сайта / Стили оформления страниц

онлайн справочник HTML http://www.htmlbook.ru/

для хорошего индексирования поисковиками, ключевые слова, относящиеся к нашей теме деятельности, очень стараться выделять тэгами заголовков:

<h1><h2><h3><h4>
усиления акцента: <strong>новости дайвинга</strong>

А эти лучше использовать только для визуализации, так как роботы не любят таких вещей. <h2 class="terracote"><h2 class="terracote-small"><h2 class="blue">

Приоритеты текста в тэгах для поисковых роботов:
  • <h1><h2><h3><h4>, лучше всего строить из них лесенку
  • <strong>жирный
  • <b>жирный
  • <em>курсив
  • <I>курсив


к картинкам, видео и ссылкам обязательно писать параметры: alt="описание для IE" title="описание для ФФ"

вот такая разделительная полоса <hr>
Заголовки специально отбил полосками, чтобы видно было, кто и как оставляет строку, кто снизу а кто сверху

Заголовок H1

<h1>Заголовок H1</h1>

Заголовок H2

<h2>Заголовок H2</h2>

Заголовок H3

<h3>Заголовок H3</h3>

Заголовок H4

<h4>Заголовок H4</h4>

Заголовок H1 class="indigo"

<h1 class="indigo">Заголовок H1</h1>

Заголовок H2 class="terracote"

<h2 class="terracote">Заголовок H2 class="terracote"</h2>

Заголовок H2 class="terracote-small"

<h2 class="terracote-small">Заголовок H2 class="terracote-small"</h2>

Заголовок H2 class="blue"

<h2 class="blue">Заголовок H2 class="blue"</h2>

Заголовок H4 class="indigo"

<h4 class="indigo">Заголовок H4</h4>


Цитата 1
<blockquote id="quote-1">Цитата 1</blockquote>

Цитата 2


<blockquote id="quote-2">Цитата 2</blockquote>

Цитата 3


<blockquote id="quote-3">Цитата 3</blockquote>

нужный блок надо обрамить в такой код, 1 - это синий блок, 2 - зеленый, 3- бежевый
Тута пишем Текст...





<div id="bg_top_1"> </div> <div id="note-1"> Тута пишем Текст... </div> <br /> <div id="bg_bottom_1"> </div>

про картинки, картинки с помощью фотошопа режем в нужный готовый размер, и сохраняем save for web подбирая параметры и баланс между качеством и весом:
<img src="тут пишем путь" /> параметры допустимые width="" hight="" alt="" title=""

если картинка плавающее выравнивание пишем <div class="img" style="float:left;padding: 5px; 5px; 5px; 5px;"> <img src="тут пишем путь" width="" hight="" alt="" title="" /> </div> получается картинка центрированная слева с обтеканием 5 px

если картинка со сслыкой на большУю, и надо отобразить в отдельном всплывающем окне и сделать плавающее выравнивание у мелкой картинки пишем
<div class="img" style="float:left;padding: 5px; 5px; 5px; 5px;"> <a href="тут пишем путь"> <img src="тут пишем путь" width="" hight="" alt="" title="" /> </a> </div>

Список с точечками: <ul class="u"> <li>Пункт 1</li> <li>Пункт 2</li> </ul>
  • Пункт 1
  • Пункт 2

Упорядоченный список: ol
<ol class="u"> <li>Пункт 1</li> <li>Пункт 2</li> </ol>
  1. Пункт 1
  2. Пункт 2


фирменные цвета шрифтов: <font color=#B26312>тута текст</font> Цвет шрифта 1
<font color=#E1D796>тута текст</font> Цвет шрифта 2
<font color=#E4EBCB>тута текст</font> Цвет шрифта 3
<font color=#205283>тута текст</font> Цвет шрифта 4
<font color=#EBE1D1>тута текст</font> Цвет шрифта 5
<font color=#E9D6B8>тута текст</font> Цвет шрифта 6
<font color=#BCD8E4>тута текст</font> Цвет шрифта 7
<font color=#BCD8E4>тута текст</font> Цвет шрифта 8


ПРО ССЫЛКИ:
обязательно используем параметры с нашими ключевыми словами:
alt="описание для IE" title="описание для ФФ"

Ссылка стандартная <a href="">текст ссылки</a>
оранжевая
<a href="" class="light">оранжевая</a>

коричневая
<a href="" class="dark">коричневая</a>

голубая маленькая
<a href="" class="indigo">голубая маленькая</a>

голубая большая
<a href="" class="url">голубая, большая</a>

<a name="#имя якоря" /> - вставляется в текст, в то место куда надо перейти а ссылку потом пишем <a href="http://dive-arena.ru/страница/#имя якоря">текст ссылки</a>



<table> таблица, если надо без границ - используй class="null-border" <tr> <td colspan=2>объединение яйчеек</td> </tr> <tr> - открытие строки 1 <td> - открытие яйчейки 1 текст яйчейки 1 </td> - закрытие яйчейки 1 <td> - открытие яйчейки 2 текст яйчейки 2 </td> - закрытие яйчеки 2 </tr> - закрытие строки 1 </table> - закрытие таблицы


Привет
текст яйчейки 1 текст яйчейки 2