Html V.1.1
1 like828 views
Семинар «Практический HTML для PR-специалиста» проведен Антоном Штульбергом и охватывает основы HTML, включая вставку ссылок, работу с изображениями, таблицами и списками. Участники также изучили BBCode и основы типографики для эффективного оформления текстов. Документ содержит примеры кода и полезные ссылки для дальнейшего изучения темы.
![BBCode. Основные теги Вставить ссылку: [url=http://example.com] нажми сюда [/url] Вставить изображение: [img]http://example.com/test.jpg[/img] Цитата: [quote] текст цитаты [/quote]](https://image.slidesharecdn.com/htmlv11-1233828597988096-3/85/Html-V-1-1-19-320.jpg)
![BBCode. Форматирование текста Заголовки: [h1] Название [/h1] [h2] Заголовок [/h2] Цветовое выделение: [font color=red] Красный текст [/font]](https://image.slidesharecdn.com/htmlv11-1233828597988096-3/85/Html-V-1-1-20-320.jpg)
![BBCode. Форматирование текста Жирный, курсив, подчеркнуто, зачеркнуто: [b] жирный текст [/b] [i] текст курсивом [/i] [u] подчеркнутый текст [/u] [s] зачеркнутый текст [/s]](https://image.slidesharecdn.com/htmlv11-1233828597988096-3/85/Html-V-1-1-21-320.jpg)
Html V.1.1
- 1. Семинар «Практический HTML для PR -специалиста»
- 2. Давайте познакомимся! Антон Штульберг, руководитель проекта е-Штаб http://e-shtab.ru/user/2
- 3. HTML. Немного истории
- 4. HTML. Как вставить ссылку. Относительные/абсолютные ссылки. Кавычки. Открытие ссылки в новом окне Подробности на нашем сайте ( http://www.example.com/) Подробности на <a href=“http://www.example.com/”> нашем сайте </a> , или по <a href=“mailto:mail@example.com”> почте </a>
- 5. HTML. Работа с изображениями (картинками) <img src=“http://www.e-shtab.ru/imgs/logotip.png” align=“bottom” alt=“ е-Штаб ”> <a href=“http://www.example.com”> <img src=“image.gif”> </a>
- 6. HTML. Таблицы <table> <tr> <th> Функции </th> <th>Nokia 3310</th> <th>iPhone 3g</th> </tr> <tr> <td>MSS</td> <td> нет </td> <td> нет </td> </tr> <tr> <td> Запись видео </td> <td> нет </td> <td> нет </td> </tr> </table>
- 7. HTML. Таблицы . Атрибут colspan
- 8. HTML. Таблицы. Атрибут align <table> <tr> <th> Функции </th> <th>Nokia 3310</th> <th>iPhone 3g</th> </tr> <tr> <td>MSS</td> <td colspan=“2” align=“center” > нет </td> </tr> <tr> <td> Запись видео </td> <td colspan=“2” align=“center” > нет </td> </tr> </table>
- 9. HTML. Таблицы. Атрибут rowspan
- 10. HTML. Таблицы. <table> <tr> <th> Функции </th> <th> <a href=“http://www.nokia.com”> <img src=“nokia.jpg”>Nokia 3310 </a> </th> <th>iPhone 3g</th> </tr> <tr> <td>MSS</td> <td colspan=“2” rowspan=“2” align=“center”> нет </td> </tr> <tr> <td> Запись видео </td> </tr> </table>
- 11. HTML. Списки. Нумированные/ненумированные, вложенные списки, списки определений <ul> <li> Написать е-Штаб </li> <li> Подготовить презентацию </li> <li> Купить хлеб </li> </ul>
- 12. HTML. Списки. Нумированные/ненумированные, вложенные списки, списки определений <ul> <li> Написать е-Штаб </li> <li> Подготовить презентацию <ol> <li>HTML</li> <li>BB-Code</li> <li>Типографика</li> </ol> </li> <li> Купить хлеб </li> </ul>
- 13. HTML. Списки. Нумированные/ненумированные, вложенные списки, списки определений <dl> <dt> PR </dt> <dd>( англ. public relations - связи с общественностью) - деятельность, направленная на достижение эффективной коммуникации как внутри организации, так и между организацией и общественностью. Целью PR является достижение эффективной коммуникации, а главной задачей PR выступает организация эффективного коммуникативного пространства общества. </dd> <dt> Прес-релиз </dt> <dd> 1) обзорная информация для печати; 2) специально подготовленная информация о товаре или фирме, распространяемая фирмой для возможного опубликования в печати. </dd> </dl>
- 14. HTML. Жирный/курсив/подчеркнуто/зачеркнуто. <strong> Жирный</ strong> <em> Курсив</ em> <u> Подчеркнуто</ u> <s> Зачеркнуто</ s>
- 15. HTML. Заголовок, абзац <h1> Тема: «Почему конструктивно продвижение проекта?» </h1> <p> Таргетирование индуцирует анализ рыночных цен, отвоевывая свою долю рынка. Еще Траут показал, что повышение жизненных стандартов вполне выполнимо. </p> <p> Восприятие марки отталкивает конвергентный жизненный цикл продукции, размещаясь во всех медиа. Перераспределение бюджета, согласно Ф.Котлеру, концентрирует инвестиционный продукт, полагаясь на инсайдерскую информацию. </p>
- 16. HTML. Заголовок, абзац <h1> Тема: «Почему конструктивно продвижение проекта?» </h1> <p> Таргетирование индуцирует анализ рыночных цен, отвоевывая свою долю рынка. Еще Траут показал, что повышение жизненных стандартов вполне выполнимо. </p> <p> Восприятие марки <br /> отталкивает конвергентный жизненный цикл продукции, размещаясь во всех медиа. Перераспределение бюджета, согласно Ф.Котлеру, концентрирует инвестиционный продукт, полагаясь на инсайдерскую информацию. </p>
- 17. BBCode. Что это такое? BBCode (аббр. от англ. Bulletin Board Code) — язык разметки, используемый для форматирования сообщений на большинстве форумов. Для форматирования текста используются теги, подобные тегам HTML, но, в отличие от них, заключённые в квадратные скобки.
- 18. Bbcode. Как выглядит ввод текста? Панель иконок позволяет в текст добавить необходимые теги Для того чтобы разослать текст в несколько форумов, лучше сразу отформатировать текст вручную
- 19. BBCode. Основные теги Вставить ссылку: [url=http://example.com] нажми сюда [/url] Вставить изображение: [img]http://example.com/test.jpg[/img] Цитата: [quote] текст цитаты [/quote]
- 20. BBCode. Форматирование текста Заголовки: [h1] Название [/h1] [h2] Заголовок [/h2] Цветовое выделение: [font color=red] Красный текст [/font]
- 21. BBCode. Форматирование текста Жирный, курсив, подчеркнуто, зачеркнуто: [b] жирный текст [/b] [i] текст курсивом [/i] [u] подчеркнутый текст [/u] [s] зачеркнутый текст [/s]
- 22. Азы типографики. Что такое типографика? Типогра́фика — графическое оформление печатного текста посредством набора и вёрстки с использованием норм и правил, специфических для данного языка.
- 23. Азы типографики. ASCII-коды часто используемых символов ASCII -код – это код, в котором числа от 0 до 255 соответствуют символам, числам, знакам препинания, и другим специальным элементам (перевод строки, звонок и так далее). Код ASCII стандартизирован, чтобы облегчить передачу текстов между компьютерами или между компьютером и периферийным устройством
- 24. Азы типографики. ASCII-коды часто используемых символов
- 25. Азы типографики. Тире, минус и дефис В типографской традиции существует три типа горизонтальных черточек: дефис, знак минуса и тире. Дефис, минус и тире отличаются друг от друга, в первую очередь, областью применения, а во вторую — длиной.
- 26. Азы типографики. Тире, минус и дефис Дефис пришел в русский язык в период заимствования немецкой типографской терминологии. Немецкое Divis идет от латинского divisio — деление, разделение, расчленение. Употребляется в словах и словосочетаниях русского языка: для присоединения частиц (кто-либо, где-то); для присоединения префиксов (во-первых, по-русски); для разделения сложных слов (физико-математический); в качестве знака сокращения (физ-ра); в словосочетаниях (бизнес-ланч, интернет-кафе); в качестве знака переноса (в интернете сегодня практически не встречается) и т. д.
- 27. Азы типографики. Тире, минус и дефис Тире (tiret, от tirer — тянуть) пришло в русский в период заимствования французской типографской терминологии. Употребляется: для обозначения пауз; для выделения прямой речи; в качестве интервала значений или диапазона.
- 28. Азы типографики. Кавычки-«ёлочки» и кавычки-„лапки“ В русских текстах используются «ёлочки» или „лапки“: В текстах на английском:
- 29. Азы типографики. Перенос слов Нужно уделять максимум внимания словам, которые могут быть перенесены на новую строчку при изменении ширины окна браузера. Так как никто не может знать, когда и где предложение будет разбито на строчки, нужно обрабатывать все случаи. На строчке не могут остаться: инициалы, одно-, двух- и некоторая часть трехбуквенных слов, цифры года. На строчке должно остаться длинное тире. Чтобы слова не перескакивали нежелательным образом, их нужно «привязывать» к соседним словам неразрывным пробелом.
- 30. Азы типографики. Перенос слов Для «привязывания» необходимо: Поставить между словами текст: Заключить текст в тег <nobr> (используется для «привязывания» телефонных номеров или слов, разделенных дефисами)
- 31. Азы типографики. Знаки в тексте Во всех случаях надо использовать специальные знаки, не пытаясь их эмулировать с помощью других знаков.
- 32. Азы типографики. Инструменты для типографирования текстов MS Word . Умеет проставлять тире, кавычки и обрабатывать набор символов в специальные знаки Типограф от Студии Артемия Лебедева. Настраивается и умеет многое http://www.artlebedev.ru/tools/typograf/
- 33. СПАСИБО Спасибо всем участникам семинара. Полезные ссылки: http://htmlbook.ru При создании презентации использовались материалы из книг Алексея Петюшкина и «Ководства» Артемия Лебедева