Ликбез — эта аббревиатура популярная в двадцатых годах прошлого века, означала ликвидацию безграмотности населения нашей страны. Я же хочу обратить Ваше внимание уважаемые авторы, жители ПРОЗЫ на компьютерную безграмотность! Ведь даже относительно продвинутые авторы не совсем понимают того, что они делают!?
ВИДЫ СТРАНИЦ
Будем считать, что наша страница находится в рамках таблицы. Ну и что? Пока ничего. Задаём атрибуту Width тега table значение 100% и тогда как бы не изменялся размер окна монитора, какое бы не было разрешение, мы всегда будем видеть всё содержимое, находящееся в рамках таблицы. Но что будет с текстом, как поведёт он себя? Скажем с уменьшением разрешения текст не будет вмещаться в размеры таблицы и будет что? Правильно! Он будет перетекать вниз страницы. Да внешний вид текста изменится, но прочесть Вы его сможете! Такие страницы у WEB-дизайнеров называются «резиновой» ширины. Перетекание текста происходит не отдельными буквами, а целыми словами. И если Вы писали текст ориентируясь на окно Вашего монитора, то в других разрешениях конечные слова предложения могут оказаться как в начале следующего предложения, так и в середине. По этой причине, как правило в таких страницах не существуют знаки переноса. А ведь нередко авторы копируя текст скажем с Вордовского документа оставляют эти знаки переноса! Все новостные сайты и в том числе аналоги газет в своих текстах не имеют знаков переноса! И все Ваши красивые как бы тексты могут выглядеть не совсем хорошо. То, что на бумаге красиво и правильно, здесь может выглядеть не совсем так как Вы задумали! Но! Но есть для таких авторов выход! Если назначить атрибуту Width фиксированное значение, скажем 1100, то и ширина таблицы и соответственно страницы будет неизменной! Такие страницы называются фиксированной ширины! Хорошо это или плохо? И что будет, как будет выглядеть такая страница при разных разрешениях?
На рисунке вверху показаны два окна монитора и в каждом страница, текст которой находится в таблице. Над окнами — часть кода страницы, касающийся таблицы. Обратите внимание на значение атрибута Width. Слева, Рис1, это 100%, а справа, Рис2, — 870! И если слева видны и рамка таблицы и весь без искажений текст, то справа часть страницы отрезана! Но текст не переплывает и остаётся в первозданном виде! Но к сожалению внизу появилась прокрутка. Во-первых это значит, что окно монитора меньше чем ширина таблицы. Во-вторых читать текст Вы сможете лишь перемещением страницы с помощью движка прокрутки! Ну, очень удобно читать, очень, романы особенно!
На рисунке ниже моя ПРОЗА-ровская страница при двух разных разрешениях монитора: 1280 и 800. Имеется ввиду только ширина! Будем считать текст нормально отформатирован при разрешении 1280 точек. Обратите внимание на скажем первую строку текста. А теперь посмотрите как выглядит текст при разрешении 800 точек? При разрешении 800 точек уже часть предложения, «...как обычно в это время возвращался...» «переплыла» на вторую строку. Аналогично и с других строк происходит «переплытие»! О чём это говорит? О том, что ПРОЗА-ровская страница — «резиновой» ширины! Но это до определённого момента, а дальше всё! Она превратится в страницу с фиксированной шириной. А до какого момента? До того самого, который зависит от нас с вами! О чём пойдёт речь ниже.
Не сомневаюсь, что не все пользователи сети и в частности авторы ПРОЗЫ знают, что жизнь любой страницы начинается с опорной точки, находящейся в левом верхнем углу окна браузера! По этой причине наша таблица со всем содержимом прижмётся к левой и верхней стороне окна браузера. А дальше как повезёт? Возьмём к примеру страницу с таблицей фиксированной ширины в 1100 пиксел. При разрешении монитора 1280 справа от нашей таблицы останется полоса ничейной территории шириной в 180 пиксел... А что будет с таблицей, текстом если скажем разрешение как у меня 1024? Таблица со всем находящемся в ней текстом будет просто отрезана правой стороной окна браузера! А внизу появится полоса прокрутки. И двигая движок по горизонтали Вы сможете прочесть текст гоняя этот самый движок за каждой строкой! Удобно ли это? А то!? Ещё как удобно! Лично у меня не более как на десять строк хватает терпения, а дальше всё! Я уже не читаю... А представьте таким способом читать «Войну и Мир»! А? Вот поэтому страницы ПРОЗЫ имеют «резиновую» ширину! И всё бы хорошо, но! Но те кто разрабатывал разметку страниц туда же определил и размещение фотографий и рисунков, — изображений, короче. Ну и что? Ничего! Ничего, до тех пор пока авторы ПРОЗЫ соблюдают рекомендации сервера, по размещению изображений на страницах.
Вы можете и сами посмотреть эти рекомендации. Зайдите через свой кабинет на «Ваша страница» и откройте любое, своё произведение. Далее «Редактировать». Откроется окно редактора, внизу (про иллюстрации). Щёлкните по ссылке и увидите страницу «КАК СОЗДАТЬ ИЛЛЮСТРАЦИЮ». Для особо ленивых я скопировал «что надо»! Оно вот здесь, ниже.
Технология создания иллюстрации
Для создания иллюстрации вам понадобится специальная программа – графический редактор. Даже в случае размещения фотографий, просто скопировать их с фотоаппарата недостаточно. С помощью этой программы вам необходимо уменьшить их размер изображений и привести их в формат, пригодный для размещения в Интернете. В качестве программы – графического редактора мы можем порекомендовать, например, Adobe Photoshop, наиболее распространенный как среди профессионалов-дизайнеров, так и фотографов-любителей. Правда, это коммерческий продукт, и лицензия стоит определенных денег. Существуют также бесплатные программы, а самый примитивный графический редактор под именем Paint встроен в Windows (находится в папке «Стандартные программы»). Отредактированное изображение необходимо сохранить в одном из форматов: JPEG или GIF, соответственно с расширениями файлов .jpg или .gif. В чем разница между этими форматами? JPEG подходит для фотографий: он сохраняет большое количество цветов и полутона. GIF подходит для схем и карандашных рисунков: он позволяет сохранять только ограниченное количество цветов и не отображает полутона, но зато тонкие линии и мелкие значки в нем не выглядят размытыми. Поэтому если вы размещаете фотографию, вам необходимо выбрать формат JPEG; если рисунок или схему – то GIF.
После сохранения файла, обязательно проверьте его объем: желательно, чтобы он не превышал 100 килобайт. Почему это важно? Нам в общем-то все равно, какие файлы хранить на сервере, современные технологии жестких дисков позволяют держать очень большие массивы данных. А вот вашим читателям не все равно, сколько по времени будет загружаться изображение. Средняя скорость доступа по модему – 33 Кбит/c, это означает, что файл объемом 100 килобайт (это 800 тысяч бит) будет загружаться 800/33=24 секунды. Если картинка будет грузиться дольше, ваш читатель может разозлиться, закрыть окно браузера и больше к вам на страницу не заходить. И будет прав, поскольку размещение не оптимизированных изображений – это проявление неуважение к читателю. В подобном случае лучше вообще не размещать иллюстрацию и радовать читателя хорошим текстом, чем раздражать непрофессионально сделанной картинкой.
Как оптимизировать иллюстрацию?
При сохранении файла в формате JPEG, графический редактор обычно предоставляет вам возможность выбрать так называемую «степень сжатия» или «качество оптимизации». Изображению для Интернета достаточно качества порядка 50-60% (в единицах Photoshop), и уж ни в коем случае не следует устанавливать 100%, иначе объем файла с картинкой получится слишком большим. Также имеют значение размеры изображения: ширина и высота. Современные фотоаппараты позволяют делать снимки высотой и шириной в 2000-3000 тысячи точек (пикселей), и даже больше. Но такие огромные изображения, размещенные в качестве иллюстраций, очень неудобно смотреть, ведь ширина экрана большинства пользователей всего 800 точек. Поэтому при создании иллюстрации изображение нужно уменьшить. Желательно, чтобы оно в ширину не превышало 600 точек (чтобы уместилось на экран шириной 800 точек с учетом полей слева и справа), и также не более 400-600 точек в высоту. При уменьшении изображения уменьшится также и объем его файла, что позволит быстрее загружаться в браузер ваших читателей.
Конечно всё, что рекомендовано, всё правильно! Но жизнь не стоит на месте, вот уходят в прошлое тихоходные модемы... Всё меньше становится мониторов с разрешением 800 точек. Появились мониторы с большим разрешением... Но! Если же в современных мониторах есть возможность перехода на разрешение 800 точек, значит найдутся пользователи, использующие такую возможность! И стало быть рекомендации сервера хоть и старые, но не устаревшие! Соблюдайте их и Вам читатели только скажут: «Спасибо!»
Продолжение здесь:
Ликбез. Часть5. http://www.proza.ru/2017/11/26/799
Ликбез. Часть6. http://www.proza.ru/2017/11/27/388
Ликбез. Часть5. http://www.proza.ru/2017/11/27/554
Ликбез. Часть8. http://www.proza.ru/2017/11/27/585
Ликбез. Часть9. http://www.proza.ru/2017/11/27/1072
Ликбез. Часть10. http://www.proza.ru/2017/11/27/1525
Ликбез. Часть11. http://www.proza.ru/2017/11/27/1574