Htmlka и – HTML, ЖЖ Тэги | Как форматировать текст, вставить картинку или ссылку: alex_inside — LiveJournal — Вебджем.рф

Содержание

Для тех кто не в курсе

Когда терзают смутные сомнения:
http://www.livejournal.com/manage/logins.bml — смотрим историю залогинивания в своем ЖЖ

http://ljplus.ru/friends/history — самая удачная, на мой взгляд, реализация «истории друзей». Минус — глючит при количестве друзей более 2000. Требует регистрации на ljplus.ru

http://ljplus.ru/post/?mode=later — «отложенный» во-времени постинг. Работают lj-cut и html-разметка. Требует регистрации на ljplus.ru

http://www.livejournal.com/mobile/post.bml — минималистская версия «Написать пост».

http://www.livejournal.com/mobile/friends.bml — френдлента с «птичьего полета», то бишь ее мобильный вариант. Если завести и назвать группу «Mobile view» — будем по ссылке читать только ее.

http://wildmale.livejournal.com/tag — читать журнал по меткам (то есть добавив к адресу интересующего журнала /tag)

http://www.ljtags.com — поиск по жж-меткам

http://www.livejournal.com/manage/settings/?cat=display&view=schemes
– все схемы оформления ЖЖ (включая XColibur и Dystopia — всего 6 схем).

Режем рекламу в ЖЖ.
http://www.onlinedisk.ru/file/523928 — скачиваем файл (rar), следуем инструкции, забываем про рекламу в ЖЖ
А вот здесь более новые «разработки»:
http://chtec-059.livejournal.com/24695.html
Совет по безопасности:

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

Изображения

Код любой картинки в сети в простом варианте выглядит так:

Уникальный URL (http://site/…jpg) выдает картинке фотохостинг (специальный сайт), куда ее необходимо закачать с вашего компьютера.

Совсем «чайникам» рекомендую действовать так (для ЖЖ):
1.Открываешь ljplus.ru
(одна из функций этого сайта – фотохостинг, заточенный под публикацию картинок в жж)
2. Регистрируешься
3. Жмешь: КАРТИНКИ-ЗАГРУЗИТЬ-ОБЗОР-ЖМИ УЖЕ!
4.Смотришь на HTML-коды и копируешь нужный в поле поста или каммента
5. Постишь. Становишься знаменитым.
В комментарии картинки ставятся аналогично, кат не работает.

Как сделать, чтобы текст «обтекал» картинку?
Легко – картинка слева, текст справа:
добавляем в код картинки:
align=left hspace=20
Код картинки примет вид:

Помни:
align=left – картинка слева, текст справа
align=right – картинка справа, текст слева
hspace=20 – расстояние между текстом и картинкой 20 пиксел по горизонтали
vspace=20 – расстояние между текстом и картинкой 20 пиксел по вертикали
Код картинки с плавным обтеканием текстом справа и снизу (или сверху):

Прекратить обтекание и вернуть текст под картинку можно тэгом

Закрывать не надо, он работает один.
выполняет перенос на следующую строку. В блогсервисах и редакторах текста его заменяет нажатие Enter.

– три пустые строки.

Вставить две и более картинки горизонтально:
<nobr>Текст (картинки)</nobr>– все, заключенное в этот контейнер будет находиться на одной строке. Применять с осторожностью, можно деформировать пост.

Регулируем расстояние меж картинками по-горизонтали:
С помощью «неразрывного пробела»:
Расстояние, равное 8 пробелам будет выглядеть так:

Вставляется меж кодов картинок, есс-но

Если надо всплывающую подсказку при наведении курсора на картинку, как здесь: – введите в код картинки title=»ТЕКСТ»

Если надо цветную рамку , добавьте в код картинки:style=»border:5px solid red;»– задана красная рамка толщиной 5 пикселей

Чтоб быстро вставить картинку с другого сайта, вставьте в пост:
<img src=»»>
затем войдите в «Свойства» картинки на этом сайте, скопируйте ее URL и вставьте в код меж кавычек

Изменить размер картинки можно с помощью атрибутов width (ширина) и height (высота). Вставьте в код картинки, например, width=300 и ваша картинка будет шириной 300 пикселов, высота подгонится пропорционально. Браузер при этом все равно подгружает изначальную картинку, и если та весила 3МБ, то меньше не станет:)

Полезные приложения:
Семаджик – программа-клиент для ведения блогов
LiveJournal Addons — расширение для браузера Firefox
LiveJournal Extension – расширение для Chrome
ljbook.com – сохранение блога в pdf
ljArchive – сохранение, архивация жж

Полезные страницы ЖЖ:
Карта всея ЖЖ
Cлужба тех. поддержки
Возможности разных типов аккаунтов
Статус аккаунтов друзей, купить аккаунт другу
Менеджер почтовых ящиков
Защищенная страница входа в ЖЖ
Текстовая страница входа в ЖЖ (без java script)
Дни рождения друзей
Страница управления сеансами связи с ЖЖ
Разбуди друга!
Административная Консоль
Редактирование меток
Список трансляций
Сменить имя пользователя
Сменить пароль
Cменить e-mail
Тем, кто забыл имя пользователя или пароль
Сменить уровень доступа к записям (для Платного)
Страница Удаления (восстановления) журнала
Написать в Конфликтную Комиссию
Написать в отдел техподдержки
Бан

Livejournal

Элементарный жж-кат (с “Read more”):
<lj-cut> ТЕКСТ </lj-cut>
жж-кат с ВАШИМ ПОДЗАГОЛОВКОМ:
<lj-cut text=»ПОДЗАГОЛОВОК»> ТЕКСТ </lj-cut>
Работу ката не видно в режиме «ПРОСМОТР»
Как в сообщение вставить жж-пользователя чтобы это выглядело, например, так: wildmale
<lj user=»wildmale»>
Сссылка на сообщество, например: aforism
делается точно так же:
<lj user=»aforism»>

Вместо wildmale пишем Дикий самец:
<a href=»lj://user/wildmale/»>Дикий самец</a>
Ежели надо с «человечком»: Дикий самец:
<lj user=»wildmale» title=»Дикий самец»>
Скопировав код, не забудьте поменять реквизиты.

Ежели хотите сделать так: wildmale
или эдак: comm и commun
то вам СЮДА

Кнопка Repost (Перепостить)
Вставкой в пост этого тега вы публикуете кнопку «Repost» (Перепостить):
<lj-repost ></lj-repost>

Одинарный тег
приведет к размещению всей записи.

Для репостинга фрагмента исходной записи используется парный тег:
<lj-repost>Перепост этого фрагмента <lj-repost ></lj-repost>

Название кнопки меняется параметром «button»:
<lj-repost button=»Разместить у себя» ></lj-repost>
С недавних пор в ЖЖ в посты можно вставлять интерактивные карты с сервисов Google.Maps или Яндекс.Карты
Для этого используется специальный тег:<lj-map url=URL-карты>
Что такое URL-карты можно узнать ЗДЕСЬ

Вместо ссылки на страничку можно делать кнопку. В нее можно вставить картинку, например, движущийся gif:

Let Помощь — коды!

Ее код:

Шпаргалочка по тегам: wildmale — LiveJournal

«Шпагалочка» прошла множество update’ов и стала сайтом http://htmlka.com. На этой страничке остались лишь специальные LJ-теги.
Кто желает иметь такую кнопку:

код для вставки:
<a href=http://htmlka.com/><img src=http://htmlka.com/wp-content/uploads/2009/07/butto.png border=0 alt=»Помощь блогеру» title=»Помощь блогеру» target=_blank></a>
вносим в Профиль (поле «О себе»), сайдбар и т.д.

Для новичков:
1. Теги можно ставить в журнал copy-paste’ом (копировать-вставить)
2. Не надо пытаться ставить их в режиме «Визуальный редактор»
_________________________________________________________________
LJ-теги:
Элементарный лже-кат (с “Read more”):
<lj-cut> СПРЯТАННЫЙ ТЕКСТ </lj-cut>
Лже-кат с ВАШИМ ПОДЗАГОЛОВКОМ:
<lj-cut text=»ВАШ ПОДЗАГОЛОВОК»> СПРЯТАННЫЙ ТЕКСТ </lj-cut>
ВНИМАНИЕ: Работу ката не видно в режиме «Просмотр» Нужно постить.
В каментах, профиле, сайдбаре и т.д. кат НЕ РАБОТАЕТ!
Как в сообщение вставить сообщество, чтобы это выглядело, например, так: aforism
<lj user=»aforism»>
Как в сообщение вставить жж-пользователя чтобы это выглядело, например, так: wildmale
<lj user=»wildmale»>
Как вместо wildmale написать Дикий самец:
<a href=»lj://user/wildmale/»>Дикий самец</a>
Ежели надо с «человечком», типа, Дикий самец:
<lj user=»wildmale» title=»Дикий самец»>
Скопировав код, не забудьте поменять мои реквизиты на свои
Ежели хотите сделать так: wildmale
или эдак: comm и commun
то вам СЮДА

Больше не нужно мучаться с кнопкой «Перепостить в свой ЖЖ».
В ЖЖ введен новый спец. тег: <lj-repost />
Вставкой в пост этого тега вы публикуете кнопку «Repost» (Перепостить)

Особенности использования:

Пока тег доступен только в режиме HTML-редактора.

Одинарный тег <lj-repost /> приведет к размещению всей записи.
(Пробел перед «/» обязателен!).

Для репостинга фрагмента исходной записи используется парный тег:

<lj-repost>Перепост этого фрагмента <lj-repost />

Название кнопки меняется параметром «button»:

<lj-repost button=»Разместить у себя в журнале» />

Кнопка дублирует заголовок записи оригинала и ставит в запись себя же для последующего перепоста.

В режиме «Просмотр» работу кнопки не увидите, только после публикации.

Самые распространенные вопросы новичков:

1. «Почему именно у меня и не работает кат?»
или «Почему введенная в пост LJ и HTML-разметка не работает и публикуется как есть?» или «Как пользоваться http://htmlka.com?»
Дело в том, что на странице «Написать пост» (http://www.livejournal.com/update.bml) ДВА режима — «Визуальный редактор» и «HTML». Представленные здесь и на htmlka.com теги работают только в режиме «HTML»:

2. «Почему картинки в моем жж отображаются не оригинального размера, а маленького?»
Потому что жж сейчас устроен так, что картинки новички по умолчанию закачивают в «Фотоальбом ЖЖ», откуда они показываются в уменьшенном виде. Забей на «Фотоальбом ЖЖ», во-первых, он неудобен, во-вторых, если когда-нибудь закроешь журнал (взломают, закроют), все картинки пропадут вместе с ним. Зарегистрируйся на http://www.ljplus.ru, жми «картинки»-«загрузить», получай html-код для вставки и публикуй картинки в любом размере в режиме HTML. А вообще хостингов для картинок сейчас прорва:)

Если хочешь уметь делать так:
Мой офигительно креативный текст!
или эдак:
я крутой! как олень!
и многое другое, то ранее находившаяся на этой странице знаменитая в ЖЖ и Рунете»Шпаргалочка по тегам» переехала на

Коды ЖЖ. Памятка для блогера: u3poccuu — LiveJournal

В этом посте собраны практически все необходимые коды жж для блогера Живого журнала.

Коды ЖЖ и оформление частично взяты с сайта htmlka.com, я лишь сделал оформление удобнее для себя с необходимыми мне ссылками.

Самые необходимые коды ЖЖ для блогера

Все теги ставятся в блог copy-paste‘ом
(В режиме «HTML», а не «Визуальный редактор») !!!

Оформление текста
Перечёркнутый текст: ~~ТЕКСТ~~
<s> ваш текст </s>
Подчёркнутый текст: ТЕКСТ
<u> ваш текст </u>
Полужирный текст: ТЕКСТ
<b> ваш текст </b>
Полужирный крупный: ТЕКСТ
<big> ваш текст </big>
Курсивный текст: ТЕКСТ
<i> ваш текст </i>
Маленький текст: текст
<small> ваш текст </small>
Неразрывный пробел:
 

Центрирование:

текст (картинка) по центру

<center>ваш текст (картинка) </center>
Выравнивание текста по правому краю поста:
<div align=right> ваш текст </div>
Выравнивание текста по всей ширине поста:
<div align=justify> ваш текст </div>
Отступ (для цитат и определений, текст отделен пустой строкой и отступ слева 8 пробелов):
<blockquote> текст </blockquote>

Линия:

ее код: <hr>
Ударение:
Cтавим после нужной буквы:
́

РАЗМЕР ШРИФТА:

Уменьшить текст: текст – 2
<font size=»-2″> уменьшенный текст </font>
Увеличить текст на 1 пункт: текст
<font size=»+1″> увеличить текст на 1 пункт </font>
Увеличить текст на 2 пункта: текст
<font size=»+2″> увеличить текст на 2 пункта </font>

И так далее, увеличивая цифру, увеличиваем текст.

ЦВЕТ ШРИФТА:

КРАСНЫЙ: красный текст
<font color=»red»> красный текст </font>
ЖЕЛТЫЙ: желтый текст
<font color=»yellow»> желтый текст </font>
ФИОЛЕТОВЫЙ: фиолетовый текст
<font color=»purple»> фиолетовый текст </font>
ЗЕЛЕНЫЙ: зеленый текст
<font color=»lime»> зеленый текст </font>
СИНИЙ: синий текст
<font color=»navy»> синий текст </font>
ФУКСИЯ: фуксия текст
<font color=»fuchsia»> фуксия текст </font>

Таблица «базовых» цветов (вводим «Имя» или «Код»):

Таблица безопасных цветов
Все цвета Интернета
ВИД ШРИФТА:
Шрифт этого текста «Monotype Corsiva»
<font face=»Monotype Corsiva»> текст </font>
Все вышеперечисленные атрибуты тега font можно объединять в одном теге:
Шрифт этого текста «Monotype Corsiva»
код этого текста:
<font face=»Monotype Corsiva» size=»+2″ color=»fuchsia»> текст </font>
Оформление ссылок
Как вставить ссылку на веб-страницу:
<a href=»АДРЕС СТРАНИЦЫ»> ВАШ ТЕКСТ</a>
Как сделать, чтобы картинка была ссылкой на веб-страницу:
<a href=»АДРЕС СТРАНИЦЫ»><img src=»АДРЕС КАРТИНКИ»></a>
Как вставить ссылку на веб-страницу, чтоб она открылась в новом окне:
<a href=»АДРЕС СТРАНИЦЫ» target=»_blank»>ВАШ ТЕКСТ</a>
Окошечко для вставки кода, типа:
ВАШ КОД
получаем так:
<textarea rows=»2″ cols=»60″> ВАШ КОД </textarea>
где rows и cols определяют площадь окна
- Можно сделать покрасивше:
  <textarea>ВАШ КОД</textarea>
  <textarea >КОДЫ </textarea>
- Элементарный жж-кат (с “Read more”):
  <lj-cut> ТЕКСТ </lj-cut>
  жж-кат с ВАШИМ ПОДЗАГОЛОВКОМ:
  <lj-cut text=»ПОДЗАГОЛОВОК»> ТЕКСТ </lj-cut>
  Работу ката не видно в режиме «ПРОСМОТР»
Кнопка Repost (Перепостить)
Вставкой в пост этого тега вы публикуете кнопку «Repost» (Перепостить):
<lj-repost />
Название кнопки меняется параметром «button»:
<lj-repost button=»Разместить у себя» />
Публикация картинок:

Код любой картинки в сети в простом варианте выглядит так:
<img src=»http://site/…jpg»>
Уникальный URL (http://site/…jpg) выдает картинке фотохостинг (специальный сайт), куда ее необходимо закачать с вашего компьютера.

«Чайникам» рекомендую действовать так (для ЖЖ):
1.Открываешь ljplus.ru
(одна из функций этого сайта – фотохостинг, заточенный под публикацию картинок в жж)
2. Регистрируешься
3. Жмешь: КАРТИНКИ-ЗАГРУЗИТЬ-ОБЗОР-ЖМИ УЖЕ!
4.Смотришь на HTML-коды и копируешь нужный в поле поста или каммента
5. Постишь. Становишься знаменитым.

В комментарии картинки ставятся аналогично, кат не работает.

Запомните: Если вы удаляете картинку из галереи хостинга (например, с ljplus.ru), то она исчезнет и из вашего блога!

Как сделать, чтобы текст «обтекал» картинку?
Легко – картинка слева, текст справа:
добавляем в код картинки:
align=left hspace=20
Код картинки примет вид:
<img src=»http:…» align=left hspace=20>
Помни:
align=left – картинка слева, текст справа
align=right – картинка справа, текст слева
hspace=20 – расстояние между текстом и картинкой 20 пиксел по горизонтали
vspace=20 – расстояние между текстом и картинкой 20 пиксел по вертикали
Код картинки с плавным обтеканием текстом справа и снизу (или сверху):
<img src=»http:…» align=left hspace=20 vspace=15>

Прекратить обтекание и вернуть текст под картинку можно тэгом <br>
Закрывать не надо, он работает один. <br> выполняет перенос на следующую строку. В блогсервисах и редакторах текста его заменяет нажатие Enter.
<br><br><br> – три пустые строки.

Вставить две и более картинки горизонтально:
<nobr>Текст (картинки)</nobr> – все, заключенное в этот контейнер будет находиться на одной строке. Применять с осторожностью, можно деформировать пост.

Регулируем расстояние меж картинками по-горизонтали:
С помощью «неразрывного пробела»:  
Расстояние, равное 8 пробелам будет выглядеть так:
       
Вставляется меж кодов картинок, есс-но

Фотохостинги

Полезно:

Некоторые хитрости ЖЖ

http://ljplus.ru/post/?mode=later — «отложенный» во-времени постинг. Работают lj-cut и html-разметка. Требует регистрации на ljplus.ru

http://www.livejournal.com/mobile/post.bml — минималистская версия «Написать пост».

http://u3poccuu.livejournal.com/tag — читать журнал по меткам (то есть добавив к адресу интересующего журнала /tag)

http://www.ljtags.com — поиск по жж-меткам

http://www.livejournal.com/manage/settings/?cat=display&view=schemes
– все схемы оформления ЖЖ (включая XColibur и Dystopia — всего 6 схем).

Совет по безопасности:

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

Если считаете, что в этом посте должны быть еще какие-то коды жж, то напишите в комменты.

Другие полезные посты:

Как добавить социальные кнопки для блога и постов
Каталог ссылок, полезных для ЖЖиста
Удобная панелька для отправки СМС
Как настроить архивирование жж и перестать беспокоиться
Как навсегда избавиться от рекламы при просмотре Интернет
Как удалить учётную запись с популярных интернет-сервисов
Утилиты резервного копирования для ЖЖ
Как я обуздал френдленту ЖЖ
Простоплеер без ограничений бесплатно
Тся или ться?
Шарики (пузырьки). Другая версия
Шарики (пузырьки)
Шарики (пузырьки). Новый вариант
Дешевые аналоги лекарств
Стишок-разминка
Прикольная онлайн-рисовалка
Про эти клавиши клавиатуры Вы должны знать!
Горячие клавиши Windows, с которыми легче жить
Как сделать перепланировку квартиры
О вреде сидячего образа жизни
Взаимозаменяемые препараты
Удобные приложения для Live Journal (ЖЖ)
Если из Избранного не удаляется запись
Советы по избавлению от похмелья

Отправить этот пост в социальные сети и закладки:

Узнать код кнопок социальных сетей для Живого Журнала

Вокруг и около сказок — ЖЖ

Читать

Ссылки

Ссылка на веб-страницу:
На главную страницу

<a href=»АДРЕС СТРАНИЦЫ»> Ваш текст </a>

Как сделать, чтобы картинка была ссылкой на веб-страницу:
<a href=»АДРЕС СТРАНИЦЫ»><img src=»АДРЕС КАРТИНКИ В СЕТИ»></a>
Как вставить ссылку на веб-страницу, чтоб она открылась в новом окне:
<a href=»АДРЕС СТРАНИЦЫ» target=»_blank»> ВАШ ПОДЗАГОЛОВОК </a>

Чтоб быстро вставить картинку с другого сайта, вставьте в пост:
<img src=»»>
затем войдите в “Свойства” картинки на этом сайте, скопируйте ее URL и вставьте в код меж кавычек

<img src=»»> — ограничение по ширине

<img src=»»> — ограничение по высоте

Всплывающий комментарий к ссылке:
htmlka.com <a href=»АДРЕС СТРАНИЦЫ» target=»_blank» title=»Откроется в новом окне»>текст</a>

ЕЩЕ О ССЫЛКАХ

Вставить две и более картинки горизонтально:
<nobr>Текст (картинки)</nobr> — все, заключенное в этот контейнер будет находиться на одной строке. Применять с осторожностью, можно деформировать пост.

Регулируем расстояние меж картинками по-горизонтали:
С помощью “неразрывного пробела”:  
Расстояние, равное 8 пробелам будет выглядеть так:
       
Вставляется меж кодов картинок, есс-но

Так называемый “спойлерный” текст, проявляющийся при его выделении. Типа:
“А убийцей в том кино был дворецкий”
<span>спойлерный текст</span>

Всплывающее окошко с пояснением при наведении на текст курсора (подведите курсор к следующему тексту):

Ваш офигительно креативный текст

<p title=»Пояснительный текст»>Основной текст</p>

текст (картинка) по центру
<center>ваш текст (картинка) </center>

Окошечко для вставки кода, типа:
ВАШ КОД
получаем так:
<textarea rows=»2″ cols=»60″> ВАШ КОД </textarea>
где rows и cols определяют площадь окна

ЕЩЕ ПОДСКАЗКИ

LJ Repost
Originally posted by wildmale at Кнопка «Repost»

Больше не нужно мучаться с кнопкой «Перепостить в свой ЖЖ».

В ЖЖ введен новый спец. тег: <lj-repost />

Вставкой в пост этого тега вы публикуете кнопку «Repost» (Перепостить)

Особенности использования:

htmlka

Все теги можно ставить в блог copy-paste’ом

HTML-теги, работающие на любой web-страничке:
Оформление текста
(рекомендую спец. страничку TEXT):

Перечёркнутый текст: ~~ТЕКСТ~~
<s> ваш текст </s>
Подчёркнутый текст: ТЕКСТ
<u> ваш текст </u>
Полужирный текст: ТЕКСТ
<b> ваш текст </b>
Полужирный крупный: ТЕКСТ
<big> ваш текст </big>
Курсивный текст: ТЕКСТ
<i> ваш текст </i>
Маленький текст: текст
<small> ваш текст </small>
Неразрывный пробел:
 
Расстояние в 8 пробелов (между словами, картинками и т.д.):
       
Центрирование:

текст (картинка) по центру
<center>ваш текст (картинка) </center>
Выравнивание текста по правому краю поста:
<div align=right> ваш текст </div>
Равномерное выравнивание текста по всей ширине поста:
<div align=justify> ваш текст </div>
Отступ (для цитат и определений, текст отделен пустой строкой и отступ слева 8 пробелов):
<blockquote> текст </blockquote>
Бегущая строка (рекомендую спец. страничку Бегущая строка):
бегущая, как олень, строка
<marquee> ваша бегущая строка</marquee>
Вместо текста можно вставить картинку:

Код этой картинки:
<marquee><img src=»АДРЕС КАРТИНКИ В СЕТИ»></marquee>

Добавленный атрибут direction=right задаст направление движения слева направо, по умолчанию — справа налево

Сноска вверху: ТЕКСТ^сноска
<sup>ваша сноска</sup>

Сноска внизу: ТЕКСТ_сноска
<sub>ваша сноска</sub>

Линия:

ее код:<hr>
Ударение:
Cтавим после нужной буквы:
́
“Закрепитель” (фиксирует текст так, как и расположите его в поле поста):

Я
  Пешу
       Лесинкой!!!

<pre>ваш текст</pre>

РАЗМЕР ШРИФТА:
Уменьшить текст: текст — 2
<font size=»-2″> уменьшенный текст </font>
Увеличить текст на 1 пункт: текст + 1
<font size=»+1″> увеличить текст на 1 пункт </font>

Увеличить текст на 2 пункта: текст + 2

<font size=»+2″> увеличить текст на 2 пункта </font>

Увеличить текст на 3 пункта: текст + 3

<font size=»+3″> увеличить текст на 3 пункта </font>

Увеличить текст на 4 пункта: текст

<font size=»+4″> увеличить текст на 4 пункта </font>

ЦВЕТ ШРИФТА:

КРАСНЫЙ: красный текст
<font color=»red»> красный текст </font>

ЖЕЛТЫЙ: желтый текст
<font color=»yellow»> желтый текст </font>
ФИОЛЕТОВЫЙ: фиолетовый текст
<font color=»purple»> фиолетовый текст </font>
ЗЕЛЕНЫЙ: зеленый текст
<font color=»lime»> зеленый текст </font>
СИНИЙ: синий текст
<font color=»navy»> синий текст </font>
ФУКСИЯ: фуксия текст
<font color=»fuchsia»> фуксия текст </font>

Таблица “базовых” цветов (можно ставить как “Имя” так и “Код”):

Имя	Код	Имя	Код	Имя	Код	Имя	Код
aqua	#00FFFF	green	#008000	navy	#000080	silver	#C0C0C0
black	#000000	grey	#808080	olive	#808000	teal	#008080
blue	#0000FF	lime	#00FF00	purple	#800080	white	#FFFFFF
fuchsia	#FF00FF	maroon	#800000	red	#FF0000	yellow	#FFFF00

ВИД ШРИФТА:
Шрифт этого текста “Monotype Corsiva”
<font face=»Monotype Corsiva»> текст </font>
Все вышеперечисленные атрибуты тега font можно объединять в одном теге:
Шрифт этого текста “Monotype Corsiva”
код этого текста:
<font face=»Monotype Corsiva» size=»+2″ color=»fuchsia»> текст </font>

Оформление ссылок (рекомендую спец. страницу Ссылки):

Как вставить ссылку на веб-страницу:
<a href=»АДРЕС СТРАНИЦЫ»> ВАШ ПОДЗАГОЛОВОК</a>
Как сделать, чтобы картинка была ссылкой на веб-страницу:
<a href=»АДРЕС СТРАНИЦЫ»><img src=»АДРЕС КАРТИНКИ В СЕТИ»></a>

Как вставить ссылку на веб-страницу, чтоб она открылась в новом окне:
<a href=»АДРЕС СТРАНИЦЫ» target=»_blank»> ВАШ ПОДЗАГОЛОВОК </a>

Специальные теги блогсервиса ЖЖ:

Элементарный жж-кат (с “Read more”):
<lj-cut> ТЕКСТ </lj-cut>
жж-кат с ВАШИМ ПОДЗАГОЛОВКОМ:
<lj-cut text=»ПОДЗАГОЛОВОК»> ТЕКСТ </lj-cut>
ВНИМАНИЕ: Работу ката не видно в режиме “ПРОСМОТР“
Как в сообщение вставить жж-пользователя чтобы это выглядело, например, так: wildmale
<lj user=»wildmale»>
Как вместо wildmale написать Дикий самец
<a href=»lj://user/wildmale/»> Дикий самец</a>
Ежели надо все же с “человечком” , например: Дикий самец: cкопировать след. код (не забыв заменить “wildmale” (2 раза) и “Дикий самец” на свое):
<a href=»http://www.livejournal.com/userinfo.bml?user=wildmale><img height=17 border=0 src=http://www.livejournal.com/img/userinfo.gif align=absmiddle width=17></a><b><a href=”http://wildmale.livejournal.com”>Дикий самец</a></b>

Друзья! Скопировав этот код, не забывайте, плиз, менять мои реквизиты на свои. Иначе ваша ссылка будет вести на меня! Надоело читать, что я всю ночь с кем-то пил, с кем-то спал:)
ВСТАВКА МЕДИА-ФАЙЛОВ:
Видео, флеш и проч. с некоторых пор в ЖЖ вставляется на раз:
<lj-embed> код вашей вставки</lj-embed>

Публикация картинок (в ЖЖ и не только):

1.Открываешь ljplus.ru — (есть и другие хостинги, но новичку лучше сюда)
2. Регистрируешься
3. Жмешь: КАРТИНКИ-ЗАГРУЗИТЬ-ОБЗОР-ЖМИ УЖЕ!
4.Смотришь на HTML-коды и копируешь “Просто картинка” или “Картинка под катом” в поле поста или коммента
5. Постишь. Ждешь комментов. Много комментов.

Чтоб быстро вставить картинку с другого сайта, нужно написать:

<img src=»»>
затем войти в “Свойства” картинки, скопировать её URL и вставить меж кавычек

Как сделать, чтобы текст «обтекал» картинку?

Легко — картинка слева, текст справа:
добавляем в код картинки:
align=left hspace=20
Код картинки примет вид:
<img src=»http:…» align=left hspace=20>
Помни:
align=left – картинка слева, текст справа
align=right — картинка справа, текст слева
hspace=20 — расстояние между текстом и картинкой 20 пиксел по горизонтали
vspace=20 — расстояние между текстом и картинкой 20 пиксел по вертикали
Код картинки с плавным обтеканием текстом справа и снизу (или сверху) может иметь вид:
<img src=»http:…» align=left hspace=20 vspace=15>

Прекратить обтекание и вернуть текст под картинку можно тэгом <br>
Закрывать не надо, он работает один.

<br> выполняет перенос на следующую строку. В блогсервисах и редакторах текста его заменяет нажатие Enter.
<br><br><br> — три пустые строки.
Обратен ему по действию тег <nobr>:
<nobr>Текст (картинки)</nobr> — все, заключенное в этот контейнер будет находиться на одной строке. Применять с осторожностью, можно деформировать пост.

Если надо всплывающую подсказку при наведении курсора на картинку, как здесь: — введите в код картинки title=»ТЕКСТ»
(если текст с пробелами, из нескольких слов — кавычки обязательны!)
Если надо цветную рамку, добавьте в код картинки: — задана красная рамка толщиной 5 пикселей

Окошечко для вставки кода, типа:
ВАШ КОД
получаем так:
<textarea rows=»2″ cols=»60″> ВАШ КОД </textarea>
где rows и cols

определяют площадь окна

Можно сделать это окошечко покрасивше:

Кнопка-ссылка на веб-страничку
Например, на эту:

Некоторые спецсимволы:

Спецсимвол	Вид в браузере
<	<
>	>
&	&
"	«
®	®
™	™
©	©
&hearts;	♥
×	×
±	±
≈	≈
•	•
½	½
¾	¾
°	° (градус)
много символов

Если вы видите это: ★, ☠, ☭ — есть смысл посмотреть “Прочие” спецсимволы HTML, пока редко включаемые в официальные таблицы спецсимволов

Фотохостинги
не все (их много развелось), более-менее знакомые:

Видеохостинги
вставка видео аналогична вставке картинок — размещаем видеофайл на видеохостинге и получаем код для вставки в блог:

Файлообменники
выложить друзьям файлы mp3, rar, zip и прочие можно через:

Он-лайн аудио-плееры
Быстро вставить мр3 с компа и послушать он-лайн — boomp3.com (регистрации не требует, работает и в Opera):

Другие плееры, с наворотами:
imeem.com (инструкция)
ijigg.com (инструкция)
бонус:
turbomp3.ru — классный поисковик по mp3-файлам

Полезно почитать:
Про счетчики (для ЖЖ и не только)
Советы по работе с кодами

В начало ↑

Анализ сайта htmlka.com

Удобство для пользователей:

45 из 100

Оптимизация загрузки страниц:

70 из 100

Время ответ сервера:

Уменьшите время ответа сервера при открытии сайта с мобильных телефонов, чтобы оно составляло не более 0.2 секунды. Сервер ответил за 2.57 сек.

Плагины:

На сайте не используются дополнительные плагины (Micromedia Flash, Microsoft Silverlight, Java), поэтому контент доступен максимальному числу пользователей интернета.

Тег viewport:

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

Кеширование статики:

Кеширование статических файлов включено.

Сжатие CSS файлов:

Файлы CSS стилей оптимизированы.

Сжатие HTML страниц:

Удалите из HTML кода лишние байты (пробелы, табуляции и переносы строк)

Сжатие JS файлов:

JS код оптимизирован.

Блокируещие файлы:

Переместите файлы, загрузка которых мешает быстрому отображению страницы как можно ниже. Подгрузка JS или CSS файлов в секции head тормозит загрузку HTML кода страницы. Найдено блокирующих JS файлов: 0, CSS: 1

Сжатие изображений:

Изображения оптимизированы.

Видимый контент:

Загрузка основного контента оптимизирована.

Адаптация по ширине:

Ширина страницы не выходит за область просмотра, прокрутки по горизонтали нет.

Размеры элементов:

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

Размеры шрифтов:

Размер шрифта и высота строк на сайте позволяют удобно читать текстовый контент.

Вид на телефонах и планшетах:

Анализ оптимизации для мобильных устройств позволяет узнать, насколько удобен веб-ресурс для просмотра на смартфонах или планшетах. Ключевые элементы данного анализа включают в себя сведения о скорости загрузки сайта на мобильных устройствах, ширине области просмотра его страниц, размере используемых шрифтов, наличии всплывающих окон, корректной работе HTML- и CSS-кода, а также других аспектах адаптации сайта под гаджеты.
Сегодня, когда ведущие поисковые системы (Google и Яндекс) главную ставку делают на развитии мобильного поиска, владение такой полезной информацией позволяет в разы повысить эффективность оптимизации сайта для мобильных устройств.
К примеру, зная, что сайт нуждается в увеличении скорости загрузки страницы, его владелец может осуществить ряд необходимых для достижения этой цели мер. Как следствие, ускорение отображения страницы уменьшит показатель отказов, увеличит время пребывания пользователей на сайте, а также улучшит его поведенческие факторы.

Htmlka и – HTML, ЖЖ Тэги | Как форматировать текст, вставить картинку или ссылку: alex_inside — LiveJournal