Содержание
Что нужно для сайта?
Когда вы создаете свой первый веб-сайт, вам предстоит многое сделать! Помимо написания кода HTML и CSS, вам необходимо протестировать свой веб-сайт, купить домен и хостинг, загрузить файлы и многое другое. Есть также необязательные вещи, такие как SEO, аналитика и проверка. Чтобы помочь в этом процессе, вы можете изучить службы, которые могут помочь вам в создании вашего веб-сайта. Вы можете создать здесь веб-сайт с учебными пособиями Youtube или провести собственное исследование в зависимости от того, как вы хотите действовать.
Узнайте, как настроить все это правильно и с минимальными усилиями. Давайте создадим ваш сайт!
HTML и CSS
HTML и CSS являются основными языками веб-сайтов, и для создания хорошего веб-сайта необходимы оба языка. HTML без какого-либо CSS будет не только выглядеть уродливо, но и создать впечатление серьезной проблемы с вашим сайтом.
HTML и CSS очень просты в изучении по сравнению с другими языками программирования. Чтобы изучить HTML и CSS, просмотрите эти рекомендации по обучению HTML и CSS.
Вам также понадобится текстовый редактор для написания кода HTML и CSS. Текстовый редактор — это специальная программа, предназначенная для написания кода, а не текстовый процессор, такой как Microsoft Word. Узнайте больше о текстовых редакторах…
Создание сценариев для веб-сайтов
Каждому веб-сайту необходимы HTML и CSS. Однако, в зависимости от типа веб-сайта, который вы создаете, вам также может понадобиться скрипт веб-сайта. Скрипты веб-сайтов — это то, что превращает статический веб-сайт в динамический веб-сайт. Весьма вероятно, что вашему веб-сайту понадобятся сценарии или, по крайней мере, они принесут пользу. Вот несколько примеров сценариев веб-сайтов:
- контактные формы
- интерактивные кнопки и элементы управления
- базы данных веб-сайтов
- общий контент между веб-страницами
Если вы считаете, что вашему веб-сайту потребуется что-либо из вышеперечисленного, вам необходимо изучить язык программирования, такой как JavaScript, PHP, Ruby on Rails или ASP. NET.
Веб-браузеры
Каждый веб-браузер отображает HTML и CSS по-своему, поэтому вам также необходимо убедиться, что ваш веб-сайт отображается и работает правильно в каждом из них. Пять самых популярных веб-браузеров в порядке от наиболее популярных к наименее популярным:
- Гугл Хром
- Windows Internet Explorer
- Мозилла Фаерфокс
- Apple Сафари
- Опера
Internet Explorer особенно известен своей медленной поддержкой новых возможностей HTML и CSS, и большинству веб-дизайнеров сложно оптимизировать свои веб-сайты для IE. Просто предупредите об этом.
Домен и хостинг
Веб-хостинг — это услуга, которая размещает файлы вашего веб-сайта (HTML, CSS, изображения, сценарии и т. д.) на сервере, чтобы любой мог получить доступ к вашему сайту. Доменное имя — это адрес вашего сайта (например, codeconquest.com).
В Интернете существует множество различных компаний, которые продают домены и хостинг. Вы захотите изучить некоторые из популярных вариантов, таких как GoDaddy, Media Temple, NameCheap, HostGator, Bluehost и Dreamhost, и это лишь некоторые из них.
Важно: Если вы собираетесь использовать скрипты на своем веб-сайте, вам может понадобиться специальный хостинг-провайдер. Если вы используете JavaScript и/или PHP и MySQL, вам не о чем беспокоиться. Однако такие технологии, как Ruby on Rails, Python и ASP.NET, обычно не поддерживаются стандартным веб-хостингом. Если вы используете какой-либо из менее распространенных языков кодирования или фреймворков, обратитесь к документации по этому языку или фреймворку, чтобы узнать, как разместить свой сайт.
Протокол передачи файлов
Чтобы передать файлы вашего веб-сайта с вашего компьютера на сервер, на котором будет размещен ваш веб-сайт, вам необходимо использовать протокол передачи файлов или FTP. Это просто означает загрузку файлов в Интернет.
Когда вы входите в свою учетную запись хостинга, обычно есть служба, позволяющая загружать файлы через веб-интерфейс. Кроме того, вы можете использовать такую программу, как FileZilla, для загрузки файлов без входа в свою учетную запись хостинга.
Необязательно: программное обеспечение для аналитики
Программное обеспечение для аналитики является дополнительным. Но если вы хотите отслеживать, как посетители взаимодействуют с вашим сайтом, это очень полезно. Аналитическое программное обеспечение позволяет вам увидеть:
- сколько людей посещают ваш сайт
- какие страницы они просматривают
- как долго они находятся на сайте
- сайтов, на которых они были до посещения вашего.
Google предоставляет 100% бесплатный инструмент, чтобы сделать все это возможным, под названием Google Analytics. Есть и другие поставщики аналитики, но Google Analytics — самый популярный и, скорее всего, единственный, который вам понадобится.
Дополнительно: Поисковая оптимизация
Поисковая оптимизация — это использование определенных внутренних и внешних стратегий для увеличения трафика поисковых систем на ваш сайт. Если вы хотите преуспеть в SEO, вам нужно многому научиться, поэтому мы не будем вдаваться в подробности.
Если вы действительно хотите оптимизировать свой сайт, вот хорошее место для начала. Определите ключевые фразы поисковых систем, связанные с вашим веб-сайтом, и включите эти ключевые фразы на свой сайт в определенных местах, таких как
HTML-тег и
HTML-тег.
Необязательно: Проверка
Последнее, о чем стоит упомянуть, — это проверка. Валидация позволяет проверить, соответствует ли код вашего веб-сайта стандартам W3C. Если этого не произойдет, ничего страшного не произойдет, но в этом нет ничего плохого. Проверка вашего кода проста — W3C предоставляет бесплатные инструменты, с помощью которых вы можете запустить свой код HTML и CSS для обнаружения любых ошибок. Вот ссылки:
- HTML Validator
- Валидатор CSS
На следующей странице вы получите возможность начать создание своего первого веб-сайта с помощью бесплатного HTML-шаблона.
Раскрытие существенной связи : Некоторые ссылки в посте выше являются «партнерскими ссылками». Это означает, что если вы нажмете на ссылку и купите товар, я получу партнерскую комиссию. Несмотря на это, я рекомендую только те продукты или услуги, которыми пользуюсь лично и считаю, что они принесут пользу моим читателям.
10 вещей, которые следует учитывать при планировании дизайна (или редизайна) веб-сайта
Этот пост был обновлен в мае 2023 года.
Я занимаюсь разработкой веб-сайтов чуть более 25 лет, в основном для некоммерческих организаций. Некоммерческие организации часто спрашивают меня: «Что мы должны учитывать при планировании нового веб-сайта (или веб-сайта с измененным дизайном)?» Вот список ответов, которые я даю чаще всего:
Как и заявление о миссии, цель веб-сайта указывает основную причину его существования в мире. Будь то образование, защита интересов, предоставление услуг, организация сообщества и т. д., основная цель сайта в конечном итоге будет определять решения по дизайну и содержанию.
Я часто спрашиваю некоммерческие организации: «Кто ваша целевая аудитория?» и они ответят: «Все». Хотя я понимаю логику этого ответа, это простой факт, что вы не можете проектировать , имея в виду «всех» (вот почему существует так много разных видов автомобилей, одежды, вычислительных устройств и т. д.). Если вы определите и создадите дизайн для двух основных аудиторий, сайт с большей вероятностью достигнет целей вашей организации.
Как и цели в стратегическом плане вашей организации (а если у вас нет ни одной из них, у вас есть более серьезные проблемы, чем ваш веб-сайт!), цели вашего веб-сайта определяют основные цели сайта. Мне нравится просить моих некоммерческих клиентов ответить на эти вопросы в течение каждая целевая аудитория: Какие действия будет выполнять эта аудитория при посещении вашего веб-сайта? Какие действия ваша организация хочет, чтобы эта аудитория выполняла при посещении вашего веб-сайта? Обязательно пересмотрите свои цели в процессе проектирования и создания контента, чтобы убедиться, что они выполняются.
Адаптивный дизайн означает, что дизайн веб-сайта автоматически изменяется в соответствии с размером экрана, на котором он просматривается. К сожалению, может быть сложно модифицировать существующий сайт, придав ему отзывчивость; и, как правило, более рентабельно полностью перепроектировать. Дни двух отдельных веб-сайтов — одного для просмотра на мониторе и другого для просмотра на мобильном устройстве — прошли.
Представьте, если бы музеи никогда не меняли свои экспонаты. Зачем вам возвращаться после вашего первого визита? Мы снова и снова возвращаемся в музеи из-за новых экспонатов и программ — новых вещей, которые стоит увидеть. Мы возвращаемся к веб-сайтам, если знаем, что их содержимое изменится, и мы сможем увидеть что-то новое. Работайте над контентной стратегией для вашего сайта, которая будет гарантировать, что люди будут возвращаться.
Документально подтверждено, что люди читают только 20-28% текста на веб-странице. Отсюда переход к более коротким блокам текста, большому количеству фотографий и использованию мультимедиа на веб-сайтах. Самое замечательное в нетекстовом контенте в наши дни заключается в том, что все, что вам действительно нужно, — это приличный смартфон, и вы можете быстро создавать свой собственный фото- и видеоконтент.
Функции — это элементы, которые делают сайт динамичным и интересным, такие как кнопки для пожертвований, онлайн-формы, встроенное видео или подкасты, онлайн-викторины, кнопки/интеграция социальных сетей и всевозможные гаджеты и виджеты. Важно продумать как можно больше из них заранее, чтобы дизайн был более последовательным. (В отличие от того, чтобы потом выяснить, что вам действительно нужны кнопки социальных сетей, и теперь у вас нет подходящего места, чтобы разместить их, не удаляя или не сдавливая другие элементы.)
68% пользователей Интернета начинают свой опыт работы в Интернете с поисковой системы. Это означает, что вы должны убедиться, что ваш сайт оптимизирован для поиска. Хотя есть компании, которые занимаются SEO и ничем другим, их услуги, как правило, выходят за рамки бюджета большинства некоммерческих организаций. К счастью, есть довольно много SEO-задач, которые вы (или ваш веб-разработчик) можете выполнить своими руками.
Существуют две основные статьи расходов, связанных с дизайн-проектом веб-сайта: стоимость дизайна и разработки сайта и текущие расходы на обслуживание сайта. Дизайн сайта, как правило, является единовременной стоимостью. Обслуживание сайта может сильно различаться, в зависимости от разработчика. Раньше я делал веб-сайты с помощью Dreamweaver, и клиенты либо изучали это сложное программное обеспечение, либо платили мне за обновления. Я перешел на систему управления контентом с открытым исходным кодом WordPress около семи лет назад, чтобы изменить эту модель. Теперь мои некоммерческие клиенты делают свои собственные обновления, и после запуска сайта я им редко нужен. Еще одна проблема, связанная с обслуживанием сайта, о которой следует подумать заранее: кто из сотрудников будет отвечать за поддержку вашего сайта после запуска? Будет ли этот человек нести ответственность за загрузку контента, созданного другими, или он будет делать все это сам?
Под этим я подразумеваю соответствие веб-сайта некоммерческой организации Разделу 508 Закона об американцах-инвалидах (ADA). Хотя я думаю, что важно, чтобы все веб-сайты были доступны, я чувствую, что некоммерческий сектор несет особую моральную ответственность за это. Инклюзивность и социальная справедливость заложены в ДНК нашего сектора, что должно быть отражено в дизайне наших веб-сайтов.
Если вы дочитали до этого момента, я надеюсь, что этот список пригодится вам в вашем следующем проекте веб-сайта!
Пять распространенных ошибок при запросе предложений веб-сайта
Agile и каскадный дизайн веб-сайта: почему гибридный подход является лучшим
Преимущества безголовой системы управления контентом
Что такое менеджер веб-контента?
Синди Леонард
Они/Они или Она/Она
Генеральный директор Cindy Leonard Consulting LLC
Синди Леонард посвятила более 20 лет работе в некоммерческих организациях и с ними, а также работала в различных советах и комитетах на различных волонтерских должностях , а также в качестве консультанта, тренера, исполнительного директора, руководителя программы и ИТ-директора. Консультационные услуги Синди обширны и охватывают множество областей знаний, полученных за более чем 2 десятилетия работы в некоммерческом секторе и в колледже. . Синди удобно работать на высоте 50 000 футов или 10 футов, и она может легко переключаться между общей картиной и мелкими деталями. Опытный оратор и тренер с очень увлекательным интерактивным стилем, Синди успешно работала с группами от 10 до больших. как 200 по широкому кругу тем. Синди выступала и обучалась на более чем 100 конференциях и занятиях, в том числе на конференциях Пенсильванской ассоциации некоммерческих организаций, Некоммерческой технологической сети, Некоммерческих организаций LEAD, Альянса управления некоммерческими организациями, Ассоциации профессионалов по сбору средств Западной Пенсильвании и Библиотечной ассоциации Пенсильвании. Синди имеет степень бакалавра. Науки в области компьютерных наук, магистр делового администрирования и магистр образования в области учебного дизайна, все из Университета Сетон-Хилл.