Просто! Создать! Веб-сайт!

Ведущим подкаста ShopTalk Крису Койер (Chris Coyier) и Дейву Руперт (Dave Rupert) часто задают вопрос, как научиться веб-разработке. Их мантра – «просто создавайте веб-сайты».

Что делать, если вы не знаете, какой именно сайт «просто создать»? Ниже приведён список различных идей для проектов, который даст вам нужную практику веб-дизайна и веб-разработки.

Идеи для веб-дизайна и веб-проектов

  1. Помогите новому бизнесу / хобби / резюме / свадьбе ваших друзей.
  2. Создайте фан-сайт или форум «старой школы» того, что вы любите.
  3. Создайте галерею фотографий с вашего отпуска.
  4. Попробуйте воссоздать страницу любимого сайта, не заглядывая в её код.
  5. Создайте сайт некоммерческой организации вашего региона.
  6. Найдите локальную проблему, которая важна для вас, и сделайте брошюру, в которой вы высказываете свою позицию.
  7. Сделайте эту брошюру с использованием системы управления контентом (CMS) или языком программирования, который вы хотите изучить.
  8. Создайте игру с использованием веб-технологий.
  9. Попробуйте воссоздать эффект из реального мира на чистом CSS.
  10. Выберите потребность вашей повседневной жизни и сделайте веб-приложение, которое будет её удовлетворять.
  11. Создайте веб-сайт вымышленного персонажа.
  12. Исследуйте все веб-возможности на сервисе Can I Use и создайте сайт с теми возможностями, о которых вы никогда не слышали или не использовали ранее.
  13. Создайте сайт-витрину вашей коллекции или коллекции ваших друзей.
  14. Исследуйте ваше генеалогическое древо.
  15. Возьмите старый сайт и адаптируйте его для людей с ограниченными возможностями.
  16. Создайте несколько бесплатных тем для популярного сервиса блогов.
  17. Опубликуйте ваши стихи.
  18. Изобретите велосипед: разработайте калькулятор, приложение для личных финансов, приложение для отслеживания времени в пути и так далее…
  19. Произведите рефакторинг кода для существующего сайта.
  20. Стилизуйте сайт с использованием трёх различных подходов к архитектуре CSS и определите, какая вам больше подходит.
  21. Создайте сайт с использованием нескольких фреймворков и определите, какой вам больше подходит.
  22. Сделайте фан-сайт вашего родного города.
  23. Придумайте 25 способов изменить / оформить изображения.
  24. Создайте веб-чат для ваших друзей.
  25. Создайте коллекцию повторно используемых компонентов, функций и т.п.
  26. Сделайте удобное приложение с доступом по регистрации для ваших друзей, где они могли бы найти инструкции для ухода за домом / отдыха / ухода за растениями.
  27. Создайте путеводитель по вашему городу с различными фильтрами (уровень расходов, цель поездки, где что купить и т.д.).
  28. Сделайте дизайн сайта, которых будет использоваться на устройствах с разрешением 100px.
  29. Создайте список сайтов с причудливым дизайном.
  30. Создайте сайт-справочник о какой-то новинке, которую вы хорошо знаете.
  31. Соберите любимые цитаты и изречения в одном месте.
  32. Создайте каталог вещей в шкафу / растений в саду / специй на кухне. Сайт должен запоминать набор фильтров пользователя.
  33. Сделайте интерактивный сайт для вашего ребёнка, который научит его определять цвета, цифры, буквы и фигуры.
  34. Выберите книгу, которая находится в свободном доступе, и сделайте сайт, где пользователь мог бы её прочитать, сделать заметки и т.д.
  35. Создайте красивый дизайн сайта на основе двух цветов – белого и чёрного.

(Перевод статьи Just! Build! Websites! (в ред. автора)

  • Создание Сайтов

    Статья мне понравилась. Да, действительно, практика многое решает. Теория без практики мертва.

    Есть такая категория правильных фрилансеров, которые считают, что если писать тексты, делать сайты, группы в сетях и др. — надо делать строго по спецификации. И вот, сидят такие заносчики на форумах и, умняки мочат. А сами, по сути, умеют только кости мыть тем, кто чем-то занят.

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

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

    Так, что, налетай на хорошие идеи и поднимай свое мастерство.

    • Да, согласна с вами, идеи отличные, поэтому не смогла удержаться и сделала перевод статьи.

      • VIZAVI

        Елена, а у меня наоборот, есть идея и желание создания своего профессионального, рекламно-информационно-представительского, динамичного, адаптивного, многостраничного простого сайта на CMS WordPress с самым обычным простым и спокойным дизайном, но с максимальным юзабилити для;
        1) постоянного персонального профессионального рекламно-информационного представительства в Интернете;
        2) предложения основных классических профессиональных услуг;
        3) размещения актуальной (новой) профессиональной разъясняющей информации и основанной на ней возможности посетителей сайта как бесплатного самостоятельного получения нужной себе специализированной информации, так и online-заказа на сайте и получения по доступным ценам новой платной услуги с дополнительной привлекательной опцией;
        4) оказания бесплатных и платных профессиональных консультаций;
        5) обратной связи с посетителями сайта.
        Но не имею никакого опыта сайтостроения и не знаю языков программирования.
        Или для создания сайта на WordPress c cамым простым дизайном знания и навыки программирования не нужны?

        • Для начала нужно составить список ключевых запросов, по которым вы будете продвигать свой сайт (в этом вам поможет анализ конкурентов, которые недавно создали похожий проект и уже вышли в ТОП). И вообще, анализ конкурентов — это то, с чего стоит начинать. Если не вдаваться в подробности, то в общем ответы на ваши пункты такие:
          1) Для решения этой задачи вам нужно подобрать-купить доменное имя, выбрать хостинг, оплатить его услуги и разместить на нем ваш домен, подобрать/установить SSL-сертификат, создать базу данных, установить Вордпресс, установить шаблон темы;
          2) Это всего лишь вопрос наполнения текстом в админке, обязательно оптимизированным;
          3) Снова наполнение + ?онлайн-заказ подразумевает оплату через сайт? Если так, то для новичка это будет сложно;
          4) Живосайт (или аналог)? По телефону? В офисе?
          5) Обратный звонок? Звонок с сайта?
          Так что, в принципе, языки программирования вам не нужны, это больше вопрос маркетинга, СЕО и установка нужных приложений/плагинов. На хостингах есть техподдержка, какие-то вопросы можете задавать на форуме.

          • VIZAVI

            Елена, спасибо за ответ!
            Конкурентов практически нет. Доменные имена купил. Хостинг подобрал с полным бесплатным администрированием, бесплатными панелями управления ISPmanager или cPanel, предлагающий автоматическое обновление бесплатного доверенного SSL-сертификата Let’s Encrypt.
            Меня волнует и беспокоит, возможно ли самостоятельно без знаний веб-программирования вносить и редактировать контент в CMS WordPress?

          • Пожалуйста.
            Вам стоит посмотреть какое-нибудь видео, как работать с админкой в Вордпресс. Максимум, что вам может понадобиться — заключить текст в тег, например, чтобы сделать ссылку или список, или выделить текст жирным шрифтом. Кнопки для добавления этих элементов есть над окном редактора. Разметку страницы создавать вам не потребуется.

          • VIZAVI

            Есть ещё сложность понимания работы с темой, потому что мне не нужен крутой дизайн, главное — чтобы было удобно работать с контентом!

          • Почитайте статью https://texterra.ru/blog/kak-sozdat-sayt-na-wordpress-polnoe-rukovodstvo-dlya-novichkov.html, чтобы было понимание, что и как.