Что такое верстка сайта простыми словами
Зачастую, заказчики не уделяют должного внимания такому этапу разработки, их больше интересуют вопросы о CMS сайта и что это такое , согласование дизайна и последующая корректная работа сайта.
Что такое верстка сайта
Все те, кто в той или иной мере касались веб-разработки, вероятно знают, что такое верстка сайта и как происходит данный процесс. Но для тех, кто только начинает свой путь разработчика или просто познаёт мир интернет-технологий мы доступно разъясним все тонкости.
Верстка сайта – это описание программным кодом визуальной части Вашего сайта. Проще говоря – это соединение и расположение всех составных элементов сайта на странице документа. Такими составными элементами являются: текст с заголовками, различные изображения и таблицы.
От того, насколько ответственно и качественно верстальщик выполнит свою работу, будет зависеть многое. Например, если Вы заказываете разработку сайта-визитки , то насколько готовый ресурс будет положительно восприниматься пользователями, покажет профессиональность разработчика. Его работа направлена так же на то, насколько быстрой будет скорость загрузки сайта и будет ли готовый сайт соответствовать требованиям той или иной поисковой системы.
Scribus. Урок 1: Интерфейс. Принцип работы
Верстка сайта: с чего начать
Для того чтобы разобраться с чего начать верстку сайта, рассмотрим её виды. Сегодня мы поговорим только об основных видах, обычно их выделяют три – это табличная, блочная и адаптивная верстки. О последней мы поговорим чуть позже.
Суть табличной верстки заключается в том, что структура сайта представляется в виде таблиц, в свою очередь ячейки в таблице – это каждый элемент страницы. С одной стороны она считается простым вариантом верстки и довольно широко распространена в кругу верстальщиков. Но так же, являет собой объёмную и сложную структуру, в случае чего для изменения, которой понадобится много времени.
Большинство профессионалов уже перешли и продолжают переходить на более гибкую верстку, то есть блочную. Её суть заключается в создании сайта на основе блоков, или как их ещё называют тегов — «div». Они содержат в себе текст, изображения и т.д. Главный их плюс и особенность в том, что при верстке они могут накладываться друг на друга.
Адаптивная верстка сайта: что это такое
В наше время всё больше и больше отдаётся предпочтение мобильным телефонам и устройствам с широкоформатными экранами, поэтому для профессионала важно знать, что такое адаптивная верстка сайта и насколько она важна.
Многие сталкиваются с такой проблемой, когда заходишь на какой-либо ресурс с мобильного устройства дизайн и функционал сайта превращается в ужасно неудобный для использования. Если клиенту нужно заказать СЕО-продвижение сайтов , а он сталкивается с такой проблемой, естественно, он сразу захочет закрыть такой сайт и перейти на более удобную площадку. Всё это являет собой большую проблему, ведь посетители – это самый ценный ресурс, для которого и создается сам сайт.
Верстка сайта — инструменты разработчика
Суть адаптивной верстки состоит в том, что при создании сайта используются современные технологии, которые позволяют создать все элементы «плавающими». Проще говоря, такие элементы будут самостоятельно менять свой размер, и располагаться на странице в зависимости от того устройства, на котором будет просматриваться страница.
Что нужно для верстки сайтов
Следующий вопрос, который может возникнуть, что нужно для верстки сайтов и с помощью чего это сделать. Для того, чтобы сверстать самую обыкновенную интернет-страницу Вам может понадобиться только блокнот. Но если Вы заглядываетесь на более масштабные проекты, то здесь уже не обойтись без специализированных html-редакторов.
По большей части профессионалами используются такие программы, как: Notepad++, Microsoft FrontPage, CoffeeCup HTML Editor и NetBeans. Чаще всего такие редакторы делятся на обычные и визуальные. Работая со вторыми, справиться сможет даже новичок.
Сегодня мы убедились в том, что при создании сайта, верстке стоит уделять достаточно внимания и находить для этого грамотных специалистов. Если изложенной информации Вам было недостаточно, советуем изучить, что такое онлайн курсы и пройти их для получения новых знаний. Становясь хорошим специалистом, Вы сможете сотрудничать с любыми заказчиками.
Источник: dzen.ru
Иллюстрированный самоучитель по Microsoft Publisher
Еще несколько лет назад, работая над книгой «Домашний компьютер», я высказал нечто вроде прогноза, что если унификация пакета Office пойдет и дальше такими темпами, то Билл Гейтс придумает и графическую программу, и программу верстки. Верстать, как уже говорилось, можно и в «Ворде», но Word, он хоть и напичкан всевозможными параметрами форматирования, для верстки все же не приспособлен или, скажем, приспособлен плоховато.
Он не умеет держать на месте строчки, особенно если у вас получилось, независимо от вашего желания, так, что абзац, начинавшийся на одной странице, последние свои строки (парочку-троечку) перебросил на следующую. Вот эти следующие строчки и начинают издеваться над вами: то они все перепрыгнут на прошлую страницу, то потянут за собой с той страницы одну-две строки. И так далее. Неприспособленность Word к верстальным делам выматывает пользователя, который, не умея работать в истинно верстальной MS Publisher программе, захотел выполнить в «Ворде» какой-нибудь буклетик к столетию любимого шефа или для чего-нибудь соответствующего. Редкость занятий версткой подсказывает пользователю, что один раз и так сойдет, что авось все образуется… В результате можно заработать нервный срыв, гипертонию, инвалидность.
Когда-то я тоже сверстал в Word несколько материалов, в том числе книги, газеты, буклеты, журнал. Но происходило это от бедности: я все никак не мог модернизировать свой ПК, ему катастрофически не хватало памяти.
Представьте себе пользователя, пишущего компьютерную книгу (в смысле, книгу о домашнем компьютере), вынужденного весь текст набирать и верстать в «Ворде» (вставляя в текст все те картинки, что существуют и в этой книге, – то есть не обкрадывая читателя по части изобразительного ряда), потому что у него на диске осталось свободного пространства всего 30 мегабайт, на которые не только ни одна уважающая себя программа не установится, но и с которыми вообще опасно работать: того и гляди накроется хард-диск. Технологически же это выглядело и вовсе смешно.
Напишу на 5 мегов, заархивирую – и, перебросив это на дискету, бегу к посреднику, сбрасываю на его ПК весь материал. Там проверяю материал вторично, правлю (после разархивирования Word может запросто потерять все свои форматы, да и картинки частенько терялись), временами кое-что дописываю на месте, переделываю картинки и так далее.
Приезжаю домой, бросаюсь к своему аппарату и с радостью неописуемой выбрасываю с него все 5 мегабайт, которые с таким трудом наработаны в течение долгого времени. И у меня опять остается 30 Мб свободного пространства. А ведь всем давно известно, что операционная система работает стабильно и уверенно, если на жестком диске есть по меньшей мере треть чистого пространства от общего его объема. Представьте: Windows 98 занимает примерно 650 Мб, Офис 97 еще 150 Мб (уже 800), а кроме того нужны Фотошоп (50-60 Мб), CorelDRAW (100-120 Мб), еще что-то… У меня к тому времени набралось работ бесчисленное множество по разным поводам и на разные темы, из них одна книга размером в 100 Мб (там были составные «вордовские» картинки – каждая размером от 7 до 11 Мб, и всего их было 8-9 штук). Вот и получается, что «мощный» диск размером в 1.1 Гб у меня был перегружен, хотя еще за год до того момента я считал, что теперь эта модернизация на всю жизнь.
Кажется, именно в той книге и была высказана мной мысль о том, что Майкрософт пойдет по пути устранения конкурентов не экономическим, а технологическим путем. Правда, пока Майкрософт занималась разработкой новой операционной системы (сначала Windows 95, потом 98, потом 2000, не считая NT, потом 2002…), фирмы Corel, Adobe, Quark и другие преспокойно занимались себе единственной версией одной-единственной программы-приложения. Правда, и это не так: Corel разрабатывала блестящий пакет CorelDRAW, да и была первой, кто начал работать в окнах Windows! Adobe также напридумывала не только программ для верстки, но и выпустила великолепный «Иллюстратор» (близкая к CorelDRAW программа, не ставшая популярной лишь из-за серенького невзрачного интерфейса, в то время как в CorelDRAW интерфейс всегда веселый, жизнерадостный, как бы только что из баньки), сверхвеликолепный Adobe Photoshop, которому и сейчас почти нет равных… Ну, и прочие утилиты и приложения.
Некогда было Корпорации Майкрософт заниматься частностями, но начиная с Офиса 95 фирма находит силы и, главное, время, чтоб конкурировать. И успешно! Непревзойденный пакет Microsoft Office, куда, конечно, входит всегда самый последний Word, стал вторым крючком, на который Майкрософт зацепила пользователя, кажется, настолько основательно, что очень скоро не станет и вовсе никаких альтернатив.
Это, конечно, плохо, когда монополист начинает диктовать всему миру свою волю. От этого не в выигрыше ни конкуренты, уже перестающие таковыми быть, ни пользователи.
Но одно дело быть монополистом, к примеру, в угольной промышленности (клиенту все равно, кто добывает и доставляет ему уголек: самое главное, чтоб доставили), где качество угля зависит от месторождения, и только, а совсем иное дело – держать монополию в области ПК. Пользователь не дурак, ему нужно, чтобы все программные решения соответствовали его пользовательским задачам. Если этого нет, он немедленно переключится на другую фирму, пусть даже непопулярную, но которая в своем приложении решила все пользовательские проблемы и пользоваться которым гораздо проще, чем продуктом монополиста. Именно эти нюансы должны учитывать монополисты Майкрософт, создавая очередной шедевр.
Прямо надо сказать, работа над ХР не прошла даром: получилась операционная среда, которая, несмотря на недоработки, выглядит очень и очень привлекательно, задавила многие приложения, отодвинув их на второй план. К примеру, FineReader, как говорилось, стал в одночасье неактуальным.
Фирма, его производящая, наступила на свои же грабли: она так беспокоилась о своей программе, такие поставила замки против взлома, так доняла всех своей серьезностью отношения к самой себе, что многие российские хакеры еще несколько лет назад посчитали своим долгом расправиться с этой чопорностью и выпустили на рынок массу взломанных версий FineReader 3.0, потом 4.0, а теперь, совсем недавно, версию 5.0. Взломаны они разными способами, но все работоспособны. Правда, учреждения и организации платили и платят и за лицензированные версии, но ведь программа сканирования текста необходима прежде всего не в офисе, а домашнему пользователю! Ну, какой дурак в офисе станет сканировать текст документа (его потом надо еще править), когда под руками всегда есть ксерокс? Дома же работает над своими собственными произведениями масса литературных, научных и технических работников, других пользователей, которым отсканировать текст, причем быстро и качественно, гораздо важнее. Есть множество мелких коллективчиков, выпускающих буклеты, брошюрки, газетки и газетенки, которым также необходим FineReader…
И вот Майкрософт выпускает пакет Средства Microsoft Office, где есть программы сканирования картинок и текста!
Причем Microsoft Office Document Scanning (и Imaging, конечно, утилита сканирования изображений) сканирует текст нисколько не хуже, чем FineReader. А может быть, и лучше! Со временем – всего-то через месяц работы со Средствами Майкрософт – стало ясно: сканирование и распознавание идет лучше!
У FineReader есть одна сомнительная услуга: возможность правки отсканированного текста прямо на месте – здесь же, в программе FineReader. Это серьезно, этого нет в майкрософтовской программе (хотя беру свои слова обратно, – возможно, и есть, не пробовал). Но только представьте себе: зачем это нужно.
Допустим, FineReader установлен в офисе, на мощном компьютере, на котором ежеминутно что-нибудь сканируется. Станет человек, который сидит на сканере и на этой программе, заниматься правкой на месте? – Конечно, нет! Он сбросит на дискету отсканированный материал, и сбросит его не в формате пакета FineReader (99%!), а в формате ТХТ или Word. Или еще в каком-нибудь приемлемом для заказчика формате.
Если у заказчика нет своего сканера, то у него нет и программы FineReader. Значит, править он будет на своем ПК, в другой программе, скорее всего, Word. Необходимость в правке на месте отпадает: просто нет физических предпосылок для этого.
Источник: samoychiteli.ru
Верстка сайта: инструкция для начинающих
Разработка сайта – это долгая и плодотворная работа, которая, как правило, разделена на несколько этапов. Начальный этап заключается в прототипировании, когда прорисовывается основная структура сайта. На основе этого разрабатывается макет будущих страниц, который в последующем верстается. Верстка сайта – это преобразование готового макета в продукт, состоящий из языка разметки HTML и CSS.
О том, что включает в себя верстка сайта и какие этапы проходит профессиональный верстальщик, поговорим в сегодняшней статье.
Что включает в себя верстка сайта
Основная задача верстальщика – переместить прототип в код, который будет в точности отображать проделанную работу дизайнера. Верстку можно сравнить с издательской деятельностью – книги, журналы и газеты содержат структурированную информацию, в них текст и графические материалы упорядочены таким образом, чтобы максимально облегчить читателю процесс потребления информации и заинтересовать его.
Выделяется два типа разработчиков сайтов:
- Backend– занимается разработкой внутренней части сайта, программирует основной функционал;
- Frontend – занимается внешней частью сайта, настраивает отображение всех элементов, добавляет к ним анимацию и так далее.
Верстка – это про Frontend, в основу которого входит язык разметки HTML, базис любого сайта.
HTML позволяет показывать страницы и контент, размещенный на них, в заданном порядке. Работа с языком разметки заключается в описании тегов. Вот основные из них:
- – главный тег, в котором содержатся другие теги;
- – включает в себя различные SEO-элементы, код JavaScript и многое другое;
- – внутри этих тегов находится все содержимое страницы;
- – используется для обозначения заголовка первого уровня;
- – используется для обозначения заголовка второго уровня, после которого следуют заголовки h3, h4, h5, h6;
- – здесь прописывается текстовое описание, например заголовок статьи;
- – придает тексту жирность;
- – текст, написанный внутри этого тега, отрображается курсивом;
- – обозначает маркированный список;
- – обозначает нумерованный список;
- – указывает на пункты внутри списка;
- – позволяет добавить к тексту ссылку на другую страницу, номер телефона, почту или иной элемент с помощью атрибута href;
– используется, чтобы добавить картинку на сайт с компьютера либо из интернета;
- — тег для создания таблицы.
Теги работают следующим образом:
Привет – это мой первый сайт!
В таком случае на странице будет отображен заголовок h1 со стандартным шрифтом, размером и начертанием.
Аналогичным образом прописываются другие теги, в результате чего получается готовый сайт.
Комьюнити теперь в Телеграм
Подпишитесь и будьте в курсе последних IT-новостей
Виды верстки
Существует два вида верстки – блочная и табличная.
Табличная верстка
Первый вид верстки, с которого началась эпоха сайтов. Именно через таблицы создавались простые веб-ресурсы в далеком 2000-м году. При табличной верстке страница поделена на соседствующие ячейки, что напоминает стандартную работу с таблицами в Excel.
Минус такого подхода состоял в том, что приходилось создавать дополнительные таблицы, которые впоследствии могли остаться пустыми. Например, если требовалось разместить изображение и зафиксировать его положение, то необходимо было создать новую строку и разделить ее на несколько столбцов. Только один из них бы содержал изображение, а другие служили бы для него фиксаторами.
Таким образом, страница могла содержать большое количество пустых таблиц, из-за которых сайт становился «тяжелым». Мало того, что такой сайт долго грузится, на него еще не любят заходить поисковые роботы для индексации страниц.
Блочная верстка
Самый актуальный вид верстки сайтов – блочный. Он основан на теге , с помощью которого создаются контейнеры, включающие в себя весь контент страницы или отдельного блока. Например, мы можем разделить сайт на несколько блоков: первый экран, о компании, контакты – для каждого блока будет отведен свой тег .
Внутри тега уже находятся другие теги, отвечающие за те или иные элементы. Вот пример небольшого блока:
Привет – это мой первый сайт!
Сегодня 2021 год и я сделал свой первый сайт.
Прописав его в HTML-документе, получим следующую страницу:
При таком подходе язык разметки HTML всегда взаимодействует с CSS-стилями, которые преобразуют обычную страницу в стильное дизайнерское решение: добавляются цвета, устанавливаются отступы для элементов, задается базовая анимация и многое другое.
Например, у нас есть тег h1, и мы хотим сделать его красным – для этого в стилях прописывается следующий код:
HTML и CSS обычно хранят в разных файлах – такой подход позволяет быстро вносить изменения и не путаться в больших проектах.
Также стоит сказать, что блочная верстка позволяет легко создать адаптивный сайт, что в наше время является обязательным требованием для каждого проекта. Такая разработка позволяет не только создавать сайты для телефонов и планшетов, но и обеспечивает попадание сайта в топ выдачи поисковых систем.
Вот так выглядит типичная схема блочной верстки:
Валидная верстка
Валидная верстка – это верстка, соответствующая стандарту W3C и означающая корректное отображение сайта на всех пользовательских устройствах. Такой подход обеспечивается строгим соблюдением правил построения кода, его оптимизации и минимизации. В результате это позволяет выводить сайт на более высокий уровень – его репутация в поисковиках сильно улучшается.
При валидной верстке элементы HTML-кода должны находиться строго на своих местах, в начале обязательно прописывается тег , а также , , .
Когда верстка считается правильной
Существует множество правил, которых следует придерживаться во время верстки. Нарушение некоторых из них может привести к плохой оптимизации сайта.
- Рекомендуется разбивать HTML-код, CSS-стили и JavaScript-код на разные файлы.
- Весь написанный код должен быть чистым и легко читаемым.
- Верстка макета сайта чаще всего должна быть пиксель в пиксель, но в некоторых случаях допускаются погрешности, согласованные с заказчиком.
- Для оптимизации кода рекомендуется использовать методологию БЭМ от Яндекса.
- Сайт должен работать одинаково во всех браузерах.
- Используйте заголовки H1-H6, а также знайте, что H1 – единственный заголовок на одной странице. Важно соблюдать это правило, иначе могут появиться проблемы с поисковыми системами.
- Также для поисковиков важно, чтобы были заполнены атрибуты , и .
- Не используйте «тяжелые» изображения, чтобы избежать длительной загрузки сайта.
- Сайт должен быть адаптирован для мобильных устройств.
Естественно, что это не все основы «идеальной» верстки, но соблюдение даже этих правил позволит создать быстрый и устойчивый сайт.
Инструменты для верстки сайта
Верстальщик – это не простой разработчик, который работает с блокнотом и пишет в нем теги да атрибуты.
Если говорить об инструментах разработчика, то чаще всего используются:
- Notepad++ – простой редактор кода;
- SublimeText – наиболее используемый редактор;
- Webstorm – самый мощный редактор.
Последняя программа для верстки сайтов платная, однако для обучения можно получить ее студенческую версию даром и с полным функционалом.
Как проверить верстку
После того как сайт будет сверстан, потребуется проверить его работоспособность. Базовое тестирование включает в себя проверку адаптивности на всех устройствах.
Более обширную информацию можно получить на сервисах Jigsaw.W3 и Validator.W3.
Если требуется узнать, соответствует ли верстка макету пиксель в пиксель, то для этого подойдет сервис WellDoneCode.
Сервис Page Ruler нужен как линейка, чтобы в пикселях измерить сверстанные блоки и прочие элементы страниц.
Window Resizer – расширение для Google Chrome, позволяющее узнать, насколько хорошо страница адаптирована под разные устройства.
Источник: timeweb.com
Вёрстка сайта — что это, какой бывает и как верстать грамотно
Вёрстка — важный этап производства печатных и электронных материалов. Верстают книги, газеты, журналы, макеты и др. Видов вёрстки множество, в этой статье мы расскажем о том, по каким правилам из разных элементов собираются сайты, и какие курсы помогут быстро освоить азы вёрстки.
Содержание статьи скрыть
Что такое вёрстка сайтов
Сверстать сайт — значит собрать все элементы интерфейса в единый макет. За вёрстку отвечает отдельный специалист — верстальщик. Он знает, как расположить заголовки, на каком расстоянии друг от друга разместить иллюстрации и какие интервалы и шрифты выбрать для набранных текстов.
Изначально понятие «вёрстка» появилось в издательской деятельности. Все книги, газеты и журналы собраны по определённым макетам с чёткой структурой блоков. Именно в этих блоках иллюстрации и тексты располагаются таким образом, чтобы читателю было максимально легко и просто воспринимать информацию.
Многие принципы создания печатной продукции перешли и в электронный мир.
Ежедневные советы от диджитал-наставника Checkroi прямо в твоем телеграме!
Подписывайся на канал
Подписаться
Как верстают сайты
Чтобы сверстать веб-ресурс, нужно использовать язык гипертекстовой разметки страницы — HTML. «Читая» этот язык, браузер понимает, как нужно отображать созданные страницы.
Язык HTML состоит из тегов. Теги — это команды, благодаря которым отдельные элементы отображаются на сайте и собираются в единое целое.
Если использовать тег с атрибутом src, в котором указывается ссылка на файл, то на странице появится изображение.
Также для создания полноценной страницы нужно подключать таблицу стилей CSS и язык скриптов JavaScript. CSS или каскадные таблицы стилей — язык описания внешнего вида HTML-документа. JavaScript — язык скриптов, которые помогают пользователю выполнять различные действия.
HTML структурирует документ и упорядочивает информацию, CSS взаимодействует с браузером, чтобы придать документу оформление, а JavaScript делает страницы интерактивными
Кто участвует в вёрстке сайтов
Создать простой проект можно и в одиночку, но если нужен стильный, удобный, максимально информативный и эффектный сайт, потребуется целая команда специалистов. В эту команду входят:
Веб-дизайнер — продумывает и создаёт внешний вид веб-портала. Веб-дизайнер рисует красивые интерфейсы, кнопки, меню и другие элементы. Именно от него зависит первое впечатление пользователей.
Верстальщик — пишет код и переводит концепцию веб-дизайнера на язык HTML-кода. Главная задача верстальщика грамотно сверстать сайт, чтобы он корректно отображался на всех устройствах.
Веб-разработчик — создаёт интерактивные блоки обратной связи и контактные формы и тестирует их. Веб-программист делает всё возможное, чтобы сайт быстро загружался в браузере.
Виды вёрстки
Есть два наиболее популярных вида вёрстки: табличный и блочный, отдельно выделяют валидную и адаптивную вёрстку. Расскажем о каждом виде подробно.
Табличная вёрстка
При табличной вёрстке каждая страница — это набор таблиц, в ячейках которых располагается различный контент: текстовые блоки, иллюстрации, кнопки, формы обратной связи и др. Первые сайты, появившиеся в сети, были созданы именно по такому принципу. Однако этот вид вёрстки не совсем удобен из-за своих особенностей и почти не используется в современной веб-разработке.
Формат блочной вёрстки
Особенности табличной вёрстки. Если нужно расположить на странице, например, иллюстрацию и зафиксировать её положение, верстальщик создаёт новую строку и делит её на несколько столбцов. Эти пустые столбцы станут своеобразными фиксаторами изображения.
Пустые столбцы необходимо создать и в том случае, если на странице не хватает «воздуха» и нужно добавить пустое поле между текстовыми блоками. Большое количество ячеек в таблице утяжеляет сайт, поэтому он долго грузится и плохо ранжируется в поисковиках.
Несмотря на то, что сегодня табличная вёрстка используется редко, она может пригодится при создании электронных писем для рассылок.
Блочная вёрстка
Блочная вёрстка — это наиболее популярный и удобный способ создания сайтов на сегодняшний день. Если в табличной вёрстке каждый элемент интерфейса помещается в отдельную ячейку, и в целом такая вёрстка напоминает работу с экселевской таблицей, то в блочной вёрстке немного иной принцип. В отдельный блок помещается каждая часть страницы: первый экран, текст о компании, контакты, боковая панель, основной контент и др.
Формат блочной вёрстки
Особенности блочной вёрстки. Ни один сайт, свёрстанный блоками, не обходится без CSS-стилей, которые позволяют из обычной страницы сделать стильный проект, отличающийся от других. В CSS прописываются отступы, выравнивания, позиционирование, прозрачность, границы, тени и др. При блочной вёрстке страницы прогружаются быстрее, и сайт лучше ранжируется поисковиками.
Как создаётся блочная вёрстка. В блочной вёрстке для каждого блока используют тег , внутри этого тега могут находиться другие теги.
Пример использования тега в блочной вёрстке. Источник: Хабр Qhttps://checkroi.ru/blog/chto-takoe-verstka/» target=»_blank»]checkroi.ru[/mask_link]
Программы для вёрстки, кроме InDesign
Какие ещё есть программы для верстки, помимо InDesign, и почему он стал так популярен? Чтобы подробнее ответить на этот вопрос начнём немного издалека.
Настольные издательские системы (DTP, desktop publishing) — ведут свою историю из 1970-х, когда компания Ксерокс активно занималась разными экспериментальными разработками. Есть спорное мнение, что именно настольные издательские системы начались в 1983 году — с программы, разработанной Джеймсом Дэвайзом для общественной газеты Филадельфии.
В 1984 выходит Программа Type Processor One работала на PC, и использовала видеокарту для вывода WYSIWYG интерфейса. (Разбирать TeX и LaTeX, более поздние FrameMaker и прочие тут не будем.)
Рынок издательских систем буквально взорвался, когда в январе 1985 Apple представили свой принтер LaserWriter, а позже — в Июле — Aldus (впоследствии Aldus была поглощена Adobe, как и Macromedia в 2004 — та самая, которая выпустила Flash, FinalCut, и прочие) представили программу PageMaker, которая быстро стала стандартом индустрии, в 1985 даже обогнав Майкрософт Ворд в этом сегменте. Ещё была Ventura — впоследствии Corel Ventura, и пара других.
В 1990-х годах QuarkXPress (первая версия вышла на рынок в 1987 году) приобрел широкую популярность в области профессиональной верстки и полиграфического дизайна благодаря простоте использования, неприхотливости системных требований, поддержке векторных шрифтов и других широко востребованных в отрасли возможностей.
На момент появления своего основного конкурента Adobe InDesign в 1999 году, QuarkXPress, несмотря на постоянную критику за высокую стоимость лицензии и довольно долгий период внедрения инноваций, де-факто являлся промышленным стандартом, покрывая около 90% рынка.
Adobe PageMaker 7.0.
Выпуск пятой версии в 2002 году привел к конфликту с фирмой Apple, поскольку релиз все еще не поддерживал Mac OS X, в то время как Adobe InDesign, выпущенный на той же неделе, поддерживал.
Настальгический сплеш-скрин моей первой версии Кварка. QuarkXPress 6.5, 2004.
Одновременно с этим президент Quark Inc. Фред Эбрахими (англ. Fred Ebrahimi) выступил с резкой критикой платформы Macintosh и отметил, что тем, кто не удовлетворен работой Quark на платформе Mac, стоит попробовать что-нибудь другое.
Adobe InDesign CC.
Вследствие соперничества с InDesign, Quark стал сдавать свои позиции и был вынужден предпринять ряд шагов для того, чтобы удержаться на рынке. Впрочем, они не помогли выиграть у InDesign.
Основная проблема Quark, которая стала основной причиной их проигрыша в 2000-х — глухота компании к пользователям, и действительно сильно завышенная на тот момент цена. Вторая — как следствие — техническое отставание, которое компания-производитель здорово сократила в 2018 году, однако все же не смогла окончательно ликвидировать. Были ещё причины, связанные именно с качеством производства, но их можно отнести к первому пункту.
Однако есть распространённое мнение, что с введением в Adobe системы подписки с версии CC, и постепенным полным отказом от бессрочных лицензий, Adobe стала вести себя так же, как и Quark когда-то. Мое личное мнение заключается в том, что для Адоби это совсем не ново (см. хотя бы судьбу бездарно угробленного Flash), и отсутсвие конкуренции ведёт к тому, что отпадает острая необходимость реагировать на замечания пользователей, что многие старые баги не исправляются от версии к версии, а новые функции не вводятся так же активно, как на ранних стадиях развития.
В PageMaker я стал работать, перейдя из QuarkXPress, через который в принципе вошёл в вёрстку. В то время (это была середина 2000-х) QuarkXPress проигрывал PageMaker, и уже появился приличный InDesign. (Тут надо отметить, что с интернетом у нас в стране в это время было ещё всё очень непросто, и программы эти поступали к нам с хорошей задержкой, на CD. И было мало информации о том, что происходит в мире.)
После работы в PageMaker, InDesign — как его продолжение и замена — казался большущим шагом вперёд, он был значительно удобнее. С тех пор прошло больше 15-ти лет, и InDesign развивался стремительно почти все это время.
В определенной степени, в последних версиях это развитие замедлилось, но оживление со стороны Quark настраивает на оптимизм. Ещё очень вдохновляют нововведения в недавно вышедшей последней — на момент написания этого текста версии (CC 2018) — а именно возможность менять размеры макета и автоматически перестраивать свёрстанное содержимое в связи с этим — эта столь долгожданная функция реализована на качественно новом уровне по сравнению с предыдущем решением. Так что надежда на развитие остаётся, и конкуренция между производителями его подстёгивает.
Ну а если вы ещё не знаете InDesign в совершенстве — у нас есть курс, на котором вы научитесь профессионально верстать в нём всё что угодно. И ещё немножечко шить.
Может быть интересно:
- Подкасты для архитекторов на русском языке
- Отчего Ревит уныл
- Кернинг и трекинг
- 5 причин наконец-то начать верстать в InDesign
- Поля ввода в InDesign (и прочих программах Adobe CC)
Источник: dmtrvk.ru