0 added
0 removed
Original
2026-01-01
Modified
2026-03-10
1
<p><strong>Подготовка документа для анимации</strong>-- важный этап, к которому нельзя относиться пренебрежительно, так как это может обернуться весьма неприятными последствиями. Давайте рассмотрим, какие существуют особенности экспорта<strong>SVG</strong>в<strong>Adobe Illustrator</strong>.</p>
1
<p><strong>Подготовка документа для анимации</strong>-- важный этап, к которому нельзя относиться пренебрежительно, так как это может обернуться весьма неприятными последствиями. Давайте рассмотрим, какие существуют особенности экспорта<strong>SVG</strong>в<strong>Adobe Illustrator</strong>.</p>
2
<p>В данной заметке мы не будем учить, как лучше всего рисовать в Illustrator. Но скажем полезную вещь:<strong>при отрисовке фигур очень важно следить за значениями</strong>, причем весьма желательно, чтобы они имели только одно число после запятой, а в идеале -- вообще были целыми. Конечно, совсем не обязательно всегда следовать этому правилу, однако если вы будете это делать, то имейте в виду, что в результате:</p>
2
<p>В данной заметке мы не будем учить, как лучше всего рисовать в Illustrator. Но скажем полезную вещь:<strong>при отрисовке фигур очень важно следить за значениями</strong>, причем весьма желательно, чтобы они имели только одно число после запятой, а в идеале -- вообще были целыми. Конечно, совсем не обязательно всегда следовать этому правилу, однако если вы будете это делать, то имейте в виду, что в результате:</p>
3
<ul><li>уменьшится размер файла,</li>
3
<ul><li>уменьшится размер файла,</li>
4
<li>упростится дальнейшая анимация,</li>
4
<li>упростится дальнейшая анимация,</li>
5
<li>визуально сократится объем информации.</li>
5
<li>визуально сократится объем информации.</li>
6
</ul><p>Рассмотрим пример:</p>
6
</ul><p>Рассмотрим пример:</p>
7
<p>В нем реализована одна и та же кривая, однако в 1-м случае мы видим одну цифру после запятой, тогда как во 2-м их три. Сама кривая состоит всего из четырех точек, причем обратите внимание, что 2-й пример на одну треть длиннее 1-го. А теперь представьте, насколько больше места займет кривая, если она будет состоять из 20-ти точек...</p>
7
<p>В нем реализована одна и та же кривая, однако в 1-м случае мы видим одну цифру после запятой, тогда как во 2-м их три. Сама кривая состоит всего из четырех точек, причем обратите внимание, что 2-й пример на одну треть длиннее 1-го. А теперь представьте, насколько больше места займет кривая, если она будет состоять из 20-ти точек...</p>
8
<p>Хорошо, каркас мы нарисовали, теперь хотим сохранить изображение в качестве<strong>SVG</strong>-файла. У нас существуют для этого 2 пути:</p>
8
<p>Хорошо, каркас мы нарисовали, теперь хотим сохранить изображение в качестве<strong>SVG</strong>-файла. У нас существуют для этого 2 пути:</p>
9
<ul><li>"Сохранить как";</li>
9
<ul><li>"Сохранить как";</li>
10
<li>"Экспортировать как".</li>
10
<li>"Экспортировать как".</li>
11
</ul><p>Какой из них лучше? Мы рекомендуем первый: "<strong>Сохранить как</strong>". Почему, если на первый взгляд никакой разницы нет, ведь мы и так, и эдак получим файл с изображением и с расширением .<em><strong>svg</strong></em>? Однако отличия есть, и начинаются они еще на этапе параметров экспорта.</p>
11
</ul><p>Какой из них лучше? Мы рекомендуем первый: "<strong>Сохранить как</strong>". Почему, если на первый взгляд никакой разницы нет, ведь мы и так, и эдак получим файл с изображением и с расширением .<em><strong>svg</strong></em>? Однако отличия есть, и начинаются они еще на этапе параметров экспорта.</p>
12
<p>Очевидно, что в случае с вариантом "<strong>Сохранить как</strong>" мы имеем гораздо больше настроек, что уже является весомым аргументом для использования именно этого варианта. Однако продолжим.</p>
12
<p>Очевидно, что в случае с вариантом "<strong>Сохранить как</strong>" мы имеем гораздо больше настроек, что уже является весомым аргументом для использования именно этого варианта. Однако продолжим.</p>
13
<p>Если мы откроем файлы, которые сохранены 2-мя способами в веб-браузере, то не увидим разницы, но только на первый взгляд. Но ведь нас больше интересует<strong>не внешний вид, а начинка</strong>, поэтому лучше всего выполнить открытие через<strong>текстовый редактор</strong>. И вот здесь отличия станут более очевидными. Впрочем, лучше попробуйте выполнить это сами, что позволит вам сделать однозначные выводы.</p>
13
<p>Если мы откроем файлы, которые сохранены 2-мя способами в веб-браузере, то не увидим разницы, но только на первый взгляд. Но ведь нас больше интересует<strong>не внешний вид, а начинка</strong>, поэтому лучше всего выполнить открытие через<strong>текстовый редактор</strong>. И вот здесь отличия станут более очевидными. Впрочем, лучше попробуйте выполнить это сами, что позволит вам сделать однозначные выводы.</p>
14
<p><em>По материалам https://habr.com/ru/post/450924/.</em></p>
14
<p><em>По материалам https://habr.com/ru/post/450924/.</em></p>
15
15