Как сделать портфолио веб-дизайна онлайн

Будучи веб-дизайнером, вы гордитесь проектами, над которыми так усердно работали в своей карьере. Это может означать только одно — пора собирать ваши лучшие работы и выставлять их на обозрение. То, как вы преподносите свои работы, говорит о вашем профессионализме. В ваших интересах демонстрировать свои проекты аккуратно и организованно. Здесь на помощь приходят портфолио веб-дизайна.

Ваши клиенты или работодатели скорее увидят, чем услышат о ваших работах и ​​проектах. Хорошее портфолио дает им такую ​​возможность и помогает вам завоевать их доверие. Если вам интересно, как именно создать портфолио веб-дизайна, продолжайте читать. Эта статья проведет вас через процесс шаг за шагом.

Мы собираемся использовать один из шаблонов веб-сайта Renderforest для создания портфолио. Итак, переходим в « Создать сайт » в меню навигации и приступаем к созданию.

Когда вы окажетесь на странице конструктора веб-сайтов, вы найдете несколько категорий и подкатегорий для шаблонов веб-сайтов. Выберите тот, который соответствует вашим потребностям. Для портфолио веб-дизайна вы можете выбрать «Портфолио» в категории «Личные» или «Дизайн» в категории «Искусство».

Кроме того, вы можете нажать «Все», чтобы открыть все доступные шаблоны, и использовать панель поиска, чтобы найти нужный.

Когда вы выберете категорию, вам будет предложено несколько различных шаблонов веб-сайтов на выбор. На картинке ниже показаны варианты портфолио.

После того, как вы выберете один из них, нажмите на него для полноэкранного предварительного просмотра шаблона. Мы выбрали «Резюме веб-дизайнера».

На странице предварительного просмотра вы можете прокрутить вниз, чтобы просмотреть шаблон, а также посмотреть, как он выглядит на экранах компьютеров, планшетов и телефонов.

Если вы хотите просмотреть другие шаблоны, нажмите «Вернуться к шаблонам» в левом углу. Когда вы будете довольны выбранным шаблоном, нажмите «Применить» в правом верхнем углу.

Кнопка «Применить» перенаправит вас в редактор Website Maker, где вы сможете отредактировать и полностью настроить шаблон. Итак, давайте посмотрим, как это делается.

Каждый элемент шаблона можно настроить. Это то, что делает его таким гибким в работе. Во-первых, давайте начнем с настройки заголовка.

С левой стороны есть возможность прикрепить свой логотип. Справа вы можете изменить цвет фона. Если вы хотите заменить весь заголовок чем-то другим, нажмите «Заменить» рядом с цветом фона.

Как только вы нажмете на нее, вам будет представлено множество других вариантов для раздела заголовка. Когда вы найдете подходящий, нажмите кнопку «Заменить».

Теперь, когда вы решили, как будет выглядеть заголовок, вы можете приступить к составлению меню навигации. Удалите ненужные пункты меню или добавьте новые, нажав «Добавить ссылку».

Чтобы прикрепить свою ссылку к пунктам меню, нажмите на значок гиперссылки.

Откроется новое окно, в котором вы можете отредактировать название пункта меню и вставить внешнюю ссылку или ссылку для перехода к определенному разделу на вашей странице.

Наконец, вы заметите кнопку «Компонент». Он позволяет добавлять любые другие текстовые или визуальные компоненты на ваш сайт.

Вы найдете любой компонент, о котором только можете подумать, начиная от CTA и ценообразования и заканчивая часто задаваемыми вопросами и ссылками на социальные сети.

Как только раздел заголовка будет завершен, двигайтесь дальше вниз и продолжайте настраивать другие разделы таким же образом. Вы можете изменить, заменить, удалить или добавить любой блок, который вы видите на странице.

Чтобы отредактировать текст в шаблоне, все, что вам нужно сделать, это нажать на него и начать печатать.

Чтобы изменить значки, нажмите кнопку редактирования, и появится новое окно.

Здесь вы можете использовать строку поиска, чтобы найти то, что вам нужно. Выберите свой значок и нажмите «Сохранить», чтобы заменить его.

В этом шаблоне есть отдельный раздел, посвященный фотографиям ваших работ и дизайнов. Выберите, сколько изображений вы хотите отобразить, и щелкните значок изображения, чтобы добавить свое изображение.

Вы можете загрузить свой файл, вставить URL-адрес изображения, выбрать фотографию из нашей медиатеки или просмотреть стоковые изображения.

В самом низу страницы есть возможность прикрепить ссылки на социальные сети. Выберите значки, затем вставьте свои социальные ссылки, чтобы поделиться своими учетными записями с вашими посетителями.

Двигаясь дальше, вы, возможно, заметили боковое меню в левой части страницы. Боковая панель предоставляет вам дополнительные инструменты редактирования для вашего дизайнерского портфолио. Давайте кратко рассмотрим инструменты и их функциональные возможности.

Первый инструмент позволяет настроить шрифт и размер текста. Поэкспериментируйте со шрифтами, пока не найдете идеальный, соответствующий вашему стилю.

Прямо под ним вы увидите инструмент «Стили», который управляет формой кнопок и элементов на вашей странице. У вас есть три варианта: закругленные, с углами и с острыми краями.

Далее у нас есть инструмент «Цвет». Довольно понятно; это позволяет вам выбирать цвета. Вы можете либо попробовать цветовые палитры, предложенные нашей командой дизайнеров, либо добавить фирменные цвета.

Наш следующий инструмент называется «Страницы». Если вы хотите добавить новую страницу, вы делаете это с помощью этого инструмента. Нажмите «Добавить новую», затем введите название своей страницы, чтобы создать ее. После этого вы можете продолжить и настроить его.

С помощью инструмента «Виджеты» вы можете добавлять в свое портфолио дополнительные инструменты и функции. На данный момент единственный доступный виджет — это чат. Вы найдете несколько поставщиков услуг чата. Выберите один из них, затем перейдите по предоставленной ссылке, чтобы узнать, как его настроить.

И последнее, но не менее важное: у нас есть инструмент «Настройки». При этом вы можете настроить дополнительные технические параметры своей страницы. Есть три категории настроек: общие, страница и домен. Общие настройки отвечают за отображение панели cookie, редактирование фавикона, выбор изображения в социальных сетях и так далее.

Настройки «Страницы» помогут вам настроить заголовок страницы, метаописание и ключевые слова. Наконец, «Домен» касается доменного имени вашего веб-сайта. Вы можете выбрать свой собственный домен или бесплатный поддомен Renderforest.

После того, как вы настроили окончательные настройки, вы почти закончили создание своего портфолио. Поздравляю! Но прежде чем мы закончим этот урок, давайте кратко поговорим о верхней панели.

Здесь вы найдете две крошечные стрелки, которые позволяют отменять и повторять изменения. Если вы случайно сделаете неверный ход, не волнуйтесь, вы всегда можете исправить ущерб.

Затем у вас есть возможность поделиться ссылкой на редактирование вашего портфолио с участником, который может дополнительно просмотреть, вычитать и отредактировать ваш проект. Вы сами решаете, как долго ссылка для редактирования остается активной.

Кнопка «Предварительный просмотр» позволяет вам увидеть, как выглядит ваша страница, прежде чем опубликовать ее. Опять же, вы можете просмотреть свое портфолио на компьютере, планшете и телефоне.

Наконец, как только вы убедились, что все идеально и ваше портфолио выглядит потрясающе, вы можете нажать долгожданную кнопку «Опубликовать»! Ваш проект будет автоматически сохранен в разделе «Мои сайты». Вы можете получить к нему доступ и отредактировать его в любое время.

Похоже, вы успешно создали свой проект. А теперь вперед и покоряйте мир своим выдающимся портфолио веб-дизайна!

Нажмите кнопку ниже и создайте свой собственный веб-сайт сегодня.

Создать сейчас