СЛОЖНО ЛИ НАУЧИТЬСЯ СОЗДАВАТЬ САЙТЫ?


HTML5 & CSS3 уроки ktomolodec.ru

Понимание языков HTML и СSS полезно всем, чья работа связана со Всемирной паутиной: дизайнеры смогут создавать более привлекательные и удобные в использовании сайты, редакторы – наполнять сайты более качественным контентом, специалисты по маркетингу – более эффективно общаться с целевой аудиторией и, наконец, менеджеры разного уровня будут более четко формулировать требования при создании сайтов и получать лучшие результаты от своих сотрудников.

При написании статьи мы сконцентрировали внимание на коде, который вы будете использовать в 90% случаев, и опустили те его фрагменты, с которыми вам вряд ли доведется иметь дело, даже если создание сайтов – ваша основная работа. Однако, прочитав книгу до конца, вы будете знать, — если  в реальной жизни столкнетесь с кодом, попадающим в эти 10%, — как найти нужную информацию с помощью поисковых систем.

Кроме того, в данную книгу мы также включили дополнительные материалы о подготовке изображений, а также аудио- и видеофайлов для использования во Всемирной паутине, о достижении поставленных задач по дизайну и верстке веб-страниц сайта, об улучшении его показателей в результатах выдачи поисковых систем (то, что называется «поисковой оптимизацией, или SEO*) и о том, как использовать сервис Google Analytics, чтобы получить сведения о посетителях вашего сайта.

СТРУКТУРА КНИГИ.

Чтобы научить вас создавать веб-страницы, данная книга была разделена на три части.

HTML – на протяжении всей первой главы мы будем рассказывать, как можно использовать язык HTML для создания веб-страниц. Вы увидите, что для начала вам потребуется ввести текст, который вы хотите отобразить на создаваемой странице. После этого вам надо будет добавить к словам теги, или элементы, позволяющие браузеру понять, что из текста является заголовком, где начинается и заканчивается абзац и т.д.

Оставшаяся часть раздела посвящена описанию этих тегов, используемых для верстки страниц. Все теги, находящиеся в вашем распоряжении, разделены по группам: текст, списки, ссылки, изображения, таблицы, формы, аудио – /видео- и Flash – и объекты и пр. Мы также должны вас предупредить, что примеры, приводимые в первых девяти главах, вряд ли можно назвать интересными, но тем не менее это – основа любой веб-страницы. В последующих главах, посвященных CSS, мы покажем вам, как изменить внешний вид ваших веб-страниц, чтобы улучшить впечатление, которое создается от их просмотра и у пользователей.

CSS – мы начнем этот раздел с объяснения того, как используются правила CSS, чтобы предоставить вам возможность управлять стилями и макетом создаваемых веб-страниц. Далее мы продолжим изучение CSS и рассмотрим большое количество свойств, которые вы можете использовать при создании собственных правил. Обычно все имеющиеся свойства принято разделять на две следующие категории.

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

Макет: эти свойства используются для позиционирования на экране различных элементов страниц. Также вы изучите несколько профессиональных приемов, позволяющих делать создаваемые страницы более привлекательными.

ПРАКТИКУМ – мы завершим эту книгу полезной информацией, которая поможет вам создавать сайты, выглядящие профессионально. Мы рассмотрим несколько новых тегов, которые появятся в HTML5, они позволяют упростить описание структуры страницы.

HTML5  – это новейшая версия языка гипертекстовой разметки (на момент написания книги она еще находилась в процессе разработки). Однако чтобы изучать эти новые элементы, вы уже должны быть хорошо знакомы с тем, как пользоваться средствами CSS для управления дизайном веб-страниц.

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

КАК ЛЮДИ ПОЛУЧАЮТ ДОСТУП К ВСЕМИРНОЙ ПАУТИНЕ.

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

БРАУЗЕРЫ – для доступа к сайтам пользователи используют специальные программы называемые веб-браузерами. Среди наиболее популярных браузеров можно назвать  Firefox. Internet Explorer. Safari. Chrome и Opera. Чтобы просмотреть какую-либо страницу, пользователи могут ввести  ее адрес в специальное поле браузера, перейти по ссылке, размещенном на другом сайте, либо воспользоваться закладкой в разделе «Избранное». Производители программного обеспечения регулярно выпускают свежие версии браузеров с новыми функциями и поддержкой новых  языковых дополнений. Однако важно помнить, что очень многие пользователи не обновляют версии браузеров. Поэтому нельзя полагаться на то, что абсолютно все посетители вашего сайта смогут воспользоваться  новейшими функциями, реализованными только в последних версиях программ. В главе 19 вы узнаете, как определить, с помощью какого браузера посетитель зашел на ваш сайт.

ВЕБ-СЕРВЕРЫ –когда вы отдаете команду браузеру открыть тот или иной сайт, тот с помощью Интернета посылает запрос специальному компьютеру, называемому  веб-сервером, на котором расположены файлы нужного вам сайта. Веб-серверы – это специальные компьютеры, постоянно подключенные к Интернету, работа которых оптимизирована для отправки веб-страниц запрашивающим их людям. Некоторые крупные компании используют собственные веб-серверы, но гораздо чаще владельцы сайтов пользуются услугами  хостинговых компаний, которые берут определенную (чаще ежегодную) плату за возможность размещения сайта у них на сервере.

УСТРОЙСТВА – разновидностей устройств, с помощью которых люди посещают сайты  — настольных компьютеров, ноутбуков, планшетов, мобильных телефонов, — становится все больше и больше. Важно помнить, что разные устройства имеют различные размеры экрана и что скорость подключения к Интернету одних выше, чем у других.

ПРОГРАММЫ ЭКРАННОГО ДОСТУПА  — это специальное ПО, которое читает вслух текст с экрана компьютера. Обычно они используются людьми с нарушением зрения. Аналогично существующим во многих странах законам, обязывающим общественные заведения быть доступными для инвалидов, в настоящее время принимаются акты, предписывающие создавать сайты, удобные для использования в том числе и людьми с ограничениями.

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

КАК СОЗДАЮТСЯ САЙТЫ.

Языки HTML и CSS используются для создания любых сайтов, однако системы  управления контентом и платформы для блогов и электронной коммерции зачастую добавляют в этот коктейль еще некоторые технологии.

Что вы видите – когда вы просматриваете веб-страницу, ваш браузер, скорее всего, получает HTML — и CSS – код с сервера, на котором расположен данный сайт. Чтобы создать страницу, пригодную для просмотра, браузер интерпретирует код.

В большинстве веб-страниц  обычно бывает включен дополнительный контент, например изображения, аудио – и видеоролики или анимация, и эти статьи научат вас подготавливать подобные материалы для использования во Всемирной паутине, а также добавлять их на страницы. Некоторые страницы также посылают вашему браузеру код   JavaScript и Flash – и вы также узнаете, как добавлять подобные интерактивные объекты на свой сайт.  JavaScript и Flash – это более сложные темы, за изучение которых вы при желании можете взяться после того, как освоите верстку страниц с помощью HTML и  CSS.

КАК СОЗДАЮТСЯ САЙТЫ – небольшие сайты обычно верстаются только на  HTML и CSS. Более крупные сайты, в частности те, что подвергаются регулярному обновлению и используют системы управления контентом, а также платформы для блогов и электронной коммерции, зачастую создаются с применением более сложных технологий, функционирующих на стороне веб-сервера.

Однако на самом деле все эти технологии используются для создания необходимого HTML – и CSS – кода, впоследствии посылаемого браузеру. Потому, если имеющийся у вас сайт использует эти технологии, вы сможете применить новые знания по HTML и CSS, чтобы получить куда больший контроль над его оформлением.

При создании более крупных, сложных сайтов  часто используются базы данных для хранения информации и различные языки программирования, такие как РНР, АSР.Net. Java  или Rubу, работающие на сервере, но, чтобы управлять внешним видом вашего сайта, вам не потребуется знание этих технологий. Навыков, полученных вами по прочтении данных статей, должно хватить, чтобы помочь вам разобраться в создании сайтов.

HTML 5 И CSS 3 –с момента создания Всемирной паутины последовательно разрабатывалось несколько версий HTML и CSS, и целью каждой было внести очередные усовершенствования в технологию. На момент написания данной книги спецификации HTML5 и CSS 3 все еще находились в стадии разработки.

Однако не смотря на то, что еще не было выпущено финальных версий обеих технологий, многие браузеры уже поддерживают некоторые из новых функций и многие создатели сайтов уже применяют новейшие элементы кода на своих страницах. Поэтому мы решили обучить вас использованию именно их. По причине того, что HTML 5 и CSS 3 были созданы на основе предыдущих версий, вы, изучив их, сможете понимать любой HTML – и CSS-код. Мы также добавили пояснения, где именно используемый нами код является новым и где он с большой вероятностью не сработает в устаревших версиях браузеров.

Следующий урок>


Автор книги : Джон Дакетт 

Блог «Кто Молодец?»

Добавить комментарий

5 × 4 =