Читать с экрана не так удобно, как с листа. Одна из причин этого — чудовищно неправильная вёрстка документов. Для эргономичного восприятия текста с экрана его вёрстка должна соответсвовать нормам и правилам, принятым для печатных изданий.
Прежде чем приступать к подготовке документов для зеркалирования, внимательно изучите статью «§ 62. Экранная типографика» ру/ководства.
Обязательные требования к документам:
- убрать все теги <font>;
- заменить все тире длинным тире (код —), дефисы в словах как-то, кое-кто, Сами-Знаете-Кто и, тем более, Мак-Гонагалл заменять нельзя;
- заменить многоточия тремя точками или кодом …;
- заменить все кавычки на «ёлочки» (« и »);
- вставить <p class=txt> в начало каждого абзаца;
- заголовок статьи заключить в тег заголовка второго уровня <h2> </h2> (с учётом регистра);
- тексты статей не должны содержать никаких других тегов, кроме p, span, div, br, b и i.
Дополнительные требования для правильной вёрстки:
- заменить пробелы после предлогов, чисел, частицы не и перед частицами бы и то неразрывными пробелами (например, «2000 года», «4 тысячи», «сказал бы»);
- заменять английские десятичные точки русскими десятичними запятыми, а английские точки-разделители разрядов — неразрывными пробелами;
- не отрывать тире от предыдущего слова; если тире стоит в начале абзаца, выделяя прямую речь, то следует ставить после него неразрывный пробел.
Пример правильной вёрстки:
<p class=txt>— Благодарю покорно, — Джинни поморщилась. — Я и так рядом с едой с пяти утра, сыта по горло одним видом… — она развернулась и направилась к двери. После секундного колебания Драко пошел следом.</p>
<p class=txt>Нахмурившись, Драко несколько минут постоял, упершись невидящим взглядом в стену, потом развернулся и направился по коридору к лестнице, ведущей вниз. В холле он засунул руки в карманы и уставился в потолок, украшенный великолепными картинами, но всё, что в данный момент видел Драко, — это лицо Гермионы, на котором друг друга сменяли всевозможные эмоции: ненависть и страсть, безразличие и любовь, неприязнь и желание… Да, он скажет ей о своих чувствах, просто не сможет не сказать!..</p>
Другие примеры правильной вёрстки: Биография Роулинг, эта страница. Окончательный вариант файла для публикации должен выглядеть примерно как Отрывок из четвёртой книги в официальном переводе или ещё лучше.
Для защиты адресов электронной почты от роботов-собирателей на страницах используется фунцкия JavaScript. Для вывода адреса используйте следующий код:
<script language=javascript><!--
get_mail('имя пользователя','домен','стиль');
// --></script>
Например, get_mail('fanfiction','yarik.com','auth'); выведет текст:
К публикации принимаются документы в формате «Полная вёрстка» (как описано выше) или «Частичная вёрстка» (с учётом только обязательных требований).
Если в процессе подготовки у вас возникают вопросы, обращайтесь по электронной почте (адрес выше). Готовые *.htm файлы следует присылать по адресу в заархивированном виде. В начало файла (после тега HTML) вставьте информацию о файле и о себе в виде:
<HTML>
<!-- Статья Джоан Ролинг и Орден Британской империи / формат: полная вёрстка / подготовлено Васей Пупкиным vasya.pupkin[at]mail.ru -->
или
<!-- Фанфик Алисия и серебряный единорог. Глава 6 / формат: частичная вёрстка / подготовлено Настей Пупкиной nastya_pupkina[at]mail.ru -->
Для тех кто в танке. Подготовка документов к зеркалированию — дело сугубо добровольное. Это очень трудоёмкое монотонное занятие, которое отнимает кучу времени. Если Вам вдруг надоело (а Вы уже начали), лучше бросьте. Ни в коем случае не присылайте мне «недоделанные» статьи.
FAQ веб-издателя
1. Как проверить мою вёрстку в домашних условиях?
Для этого скопируйте файл стилей в папку с верстаемым файлом и временно пропишите в заголовке (между <HEAD> и </HEAD>) строку: <link rel="stylesheet" type="text/css" href="main.css">.
2. Как выделять цветом?
Чтобы выделить цветом нужно воспользоваться стилями. Для выделения красным (дата) используется контейнер SPAN и стиль date: <span class=date>26.04.2002</span>;
Автор статьи подписывается внизу. Для этого используется контейнер DIV и стиль AUTH: <div class=auth>Ярослав aka Нейтрон</div>;
Для выделения коментариев (как, например, в статье О сходных «Гарри Поттеру и Ко» героях, Ч.2) используется контейнер SPAN и стиль NOTE: <span class=note>Замечания цветом принадлежат Полине</span>.
3. Почему нельзя использовать контейнер FONT?
Потому что при любом изменении дизайна сайта придётся снова править все файлы.
4. Как оформлять подзаголовки?
Для оформления подзаголовков (как, например, в статье О сходных «Гарри Поттеру и Ко» героях, Ч.2) используется контейнер DIV и стиль UNHEAD: <div class=unhead>Научные размышлизмы</div>.
5. Когда я дома проверяю вёрстку, броузер ругается на функцию get_mail Javascript, почему?
Потому что сама эта функция определяется в отдельном файле, путь к которому прописан в заголовке документа. Когда документ будет размещён на сервере, всё будет нормально работать, и никто не будет ругаться.
6. Как оформлять цитаты?
Объёмные блоки цитат, например, письма, лучше оформлять отдельными абзацами. При этом используется контейнер P и стиль QUOTE. Для оформления небольших блоков цитат внутри предложения или одного абзаца нужно использовать контейнер SPAN и стиль QUOTE: <span class=quote>Мы приедем и заберем тебя в субботу, хорошо?</span>. Внутри блока небольшие абзацы лучше разделять тегом <br>. Пример правильного оформления можно найти в фанфике «Книга 5»
7. Как оформлять эпиграф?
Для оформления эпиграфа используется контейнер P и стиль EPI. Строки эпиграфа разделяются тегом <br>. Источник указывается ниже в виде <p class=epiauth>Имя Автора. «Название произведения»</p>. Примеры правильного оформления эпиграфов можно найти в фанфике «Проект история» или «Draco Veritas».
8. Как назвать файл?
Имя файла обычно имеет вид XXXY.htm, где XXX — код фанфика (статьи) в базе данных, Y — порядковый номер главы (нумерация начинается с нуля и продолжается до буквы z). Узнать код уже размещённого фанфика можно, например, наведя мышку на название в списке фиков. В статусной строке браузера при этом отобразится ссылка вида javascript:get_article(0,'XXXY.shtml');
9. Как оформлять сноски?
Все сноски в одном файле нумеруются, начиная с единицы. Для указания сноски в тексте используется код: <sup><a href="#_ftn1" name="_ftnref1" title="Краткое определение...">[1]</a></sup>. В конце текста (главы) перед авторством вставляется код <hr width="30%" align=left size=1>
<a name="_ftn1"></a>
<p class=footnote><a href="#_ftnref1" title="Определяемое понятие" class=comm>[1]</a> Текст сноски</p>
Примеры текстов со сносками: Re_Animat[i_on]. Глава 1, Отложенное возмездие. Глава 2.
10. Как автоматизировать процесс обработки файлов?
Используя различное программное обеспечение в комбинации можно существенно облегчить задачу по подготовке файла. Например, если исходный файл в формате RTF подготовлен должным образом, можно воспользоваться следующим алгоритмом:
1. RTF файл сохраняется вордом в html
2. Используется программа Microsoft Office HTML Filter 2.0, которую можно свободно скачать с сайта Майкрософт, со следующими настройками:
Delete backup copies after processing
Remove MSOffice native markup
Remove LANG attributes
Remove non-essential META tags
Remove standard CSS
Remove all STYLE elements
Remove standard @rule constructs
На выходе получается чистый текст с тегами <p> <b> <i> Файл открывается в любом текстовом редакторе (например, тот же ворд, расширение нужно сменить на txt), который умеет делать сквозные замены по образцу. Начало и конец файла (ненужные теги) удаляются. Желательно вручную переформатировать файл так, чтобы каждый абзац был одной строкой.
Замены:
[...]:[…]
[ - ]:[ —]
[<p>- ]:[<p>— ]
[<p>]:[<p class=txt>]
[«]:[«]
[»]:[»]
Далее начинается ручная обработка
- замена стилей абзацев на epi epiauth quote где нужно
- правка незаменённых участков
- вставка информации об авторе
Часто файлы приходят не в том виде, в каком хотелось бы, тогда возникают проблемы с прямой речью и кавычками. В этом случае вводятся другие замены и ручная обработка.
Для автоматизации подготовки текста можно также воспользоваться Типографом студии Артемия Лебедева.
Ярослав aka Нейтрон
