Представление данных в табличном виде / Веб-Самоделкин. Как самому создать сайт быстро и профессионально / Библиотека (книги, учебники и журналы) / В помощь Веб-Мастеру

Обложка
Аннотация

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

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

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

Алексей Гладкий i

Книги автора: Кадровое делопроизводство и управление персоналом на компьютере Компьютер для индивидуального предпринимателя. Как вести учет быстро, легко и безошибочно Складской учет на компьютере. Лучшие программы, включая 1С 8.2 1С: Управление торговлей 8.2. Настройка, конфигурирование и администрирование Как защитить компьютер от ошибок, вирусов, хакеров Бизнес-планирование и анализ инвестиционных проектов на компьютере Компьютер от «А» до «Я»: Windows, Интернет, графика, музыка, видео и многое другое Excel. Трюки и эффекты Электронная почта (e-mail). Легкий старт Халява в Интернете Безопасность и анонимность работы в Интернете. Как защитить компьютер от любых посягательств извне Компьютер для бухгалтера Как быстро восстановить потерянные компьютерные данные. Подробное руководство по спасению информации Самоучитель работы на компьютере: быстро, легко, эффективно Веб-Самоделкин. Как самому создать сайт быстро и профессионально

/ Олег Власов i

Книги автора: Как привлечь туристов и стать туристическим брендом в России Блокчейн от А до Я. Все о технологии десятилетия Основы технического анализа финансовых активов Интернет вещей. Новая технологическая революция Криминальный Runet. Темные стороны Интернета ART-коучинг. Техники пРОСТых решений Автоворонки для инфобизнеса Опыт конкуренции в России: причины успехов и неудач 100 советов по информационной безопасности малого бизнеса и предпринимателя лично Физиология ажиотажа. Маркетинговые приемы привлечения потребителей к торговой марке Время – деньги Управление инновационным развитием высокотехнологичных корпораций России Информационные системы и технологии в маркетинге. Монография 27 книг успешного руководителя Транслитерация и визуализация меню на предприятиях сервиса Хакеры с барсетками. Пошаговая инструкция по созданию очереди клиентов из интернета Этикет делового письма Феномен Инстаграма. Как раскрутить свой аккаунт и заработать Закон стартапа Кадровое делопроизводство и управление персоналом на компьютере Компьютер для индивидуального предпринимателя. Как вести учет быстро, легко и безошибочно Интернет: Заметки научного сотрудника Розничные торговые сети: стратегии, экономика, управление Складской учет на компьютере. Лучшие программы, включая 1С 8.2 1С: Управление торговлей 8.2. Настройка, конфигурирование и администрирование Экстремальное программирование. Разработка через тестирование Как защитить компьютер от ошибок, вирусов, хакеров Ментальные карты для бизнеса И радость творчества, и полный кошелек Как запустить бизнес на Амазоне. Пошаговая инструкция: как запустить онлайн-бизнес интернет-магазина мирового масштаба Как внедрить CRM-систему за 50 дней Самоучитель по PR для спортсменов Компьютер от «А» до «Я»: Windows, Интернет, графика, музыка, видео и многое другое Электронная почта (e-mail). Легкий старт Сетевой Маркетинг. Система рекрутирования в Интернете Мерчандайзинг. Курс управления ассортиментом в рознице Халява в Интернете Безопасность и анонимность работы в Интернете. Как защитить компьютер от любых посягательств извне Категорийный менеджмент. Курс управления ассортиментом в рознице Ноутбук для ваших любимых родителей Стив Джобс. Человек-легенда Общение на результат. Как убеждать, продавать и договариваться Бизнес для ржавых чайников. Достойная жизнь на пенсии Дефрагментация мозга. Софтостроение изнутри Библия продаж. Незаменимая книга для России! Продажи невидимого. Продавать услуги легко, если знать как Инновационный продукт. Инструменты маркетинга Яндекс.Директ. Как получать прибыль, а не играть в лотерею Аакер о брендинге. 20 принципов достижения успеха Партизанский маркетинг в социальных сетях. Инструкция по эксплуатации SMM-менеджера Сам себе сисадмин. Победа над «домашним» компьютером Гибкое управление проектами и продуктами E-mail-маркетинг. Как привлечь и удержать клиентов Как организовать дистанционный бизнес? Инфобизнес с нуля. 100 шагов к созданию своей денежной империи Бизнес-тренер на миллион. Личный PR для бизнес-тренеров, ораторов, коучей Контент-технология. Как, где и о чем говорить с клиентами Прицельный маркетинг. Новые правила привлечения и удержания клиентов Запуск! Быстрый старт для вашего бизнеса Успешная короткая презентация Безопасность информационных систем. Учебное пособие Разумный маркетинг. Как продавать больше при меньших затратах Секреты приложений Google Компьютер для тех, кому за… Компьютер для бабушек и дедушек 99 инструментов продаж. Эффективные методы получения прибыли Выжми из бизнеса всё! 200 способов повысить продажи и прибыль Продающие тексты. Как превратить читателя в покупателя Анонимность и безопасность в Интернете. От «чайника» к пользователю Генератор новых клиентов. 99 способов массового привлечения покупателей Если покупатель говорит «нет». Работа с возражениями Копирайтинг: секреты составления рекламных и PR-текстов Маркетинг 3.0: от продуктов к потребителям и далее – к человеческой душе Интернет для тех, кому за… Продвижение бизнеса в ВКонтакте. Быстро и с минимальными затратами Как заработать в Интернете. 35 самых быстрых способов Домены. Все, что нужно знать о ключевом элементе Интернета Прибыльный блог: создай, раскрути и заработай Инфобизнес на полную мощность. Удвоение продаж Интернет-маркетинг: лучшие бесплатные инструменты Инфобизнес за один день Монетизация сайта. Секреты больших денег в Интернете Деловая e-mail переписка. Пять правил успеха Быстрые деньги в Интернете. 50 способов заработать, сидя дома у компьютера Добавьте в корзину. Ключевые принципы повышения конверсии веб-сайтов Веб-Самоделкин. Как самому создать сайт быстро и профессионально Как спроектировать современный сайт

Книга: Веб-Самоделкин. Как самому создать сайт быстро и профессионально

Представление данных в табличном виде

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

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

Листинг 1.6.]]> Представление данных в табличном виде

<html>

<head>

<title>Компания "Торговый мир"</title>

</head>

<body>

<h1>Добро пожаловать!</h1>

<i>Мы рады приветствовать вас на сайте нашей компании ООО «Мир торговли»</i>. Уже более <u>пяти лет</u> мы занимается продажей товаров и оказанием услуг. <b>Ниже представлены списки основных позиций, которые мы рады предложить</b>.<br>

<table>

<tr>

<td>Товары</td>

<td>Услуги</td>

</tr>

<tr>

<td>промтовары</td>

<td>грузоперевозки</td>

</tr>

<tr>

<td>стройматериалы</td>

<td>ответственное хранение</td>

</tr>

<tr>

<td>одежда, обувь</td>

<td>консультирование</td>

</tr>

<tr>

<td>детские игрушки</td>

<td>кредитование</td>

</tr>

</table>

Более подробно об ассортименте товаров и услуг вы можете узнать в нашем отделе сбыта.

</body>

</html>

Теперь сохраним выполненные изменения с помощью команды главного меню либо нажатием комбинации клавиш , и откроем веб-страницу в окне Интернет-обозревателя. Результат выполненных действий представлен на рис. 2.20.

Рис. 2.20.]]> Представление данных в табличном виде

Как видно на рисунке, информация, которая ранее была оформлена в виде маркированного и нумерованного списков, теперь представлена в табличном виде. Перечень товаров содержится в столбце , а перечень услуг – в столбце .

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

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

Для этого нам необходимо отредактировать программный код веб-страницы так, как показано в листинге 1.7.

Листинг 1.7.]]> Форматирование таблицы

<html>

<head>

<title>Компания "Торговый мир"</title>

</head>

<body>

<h1>Добро пожаловать!</h1>

<tr>

<td bgcolor="yellow"><b>Товары</b></td>

<td bgcolor="yellow"><b>Услуги</b></td>

</tr>

<tr>

<td>промтовары</td>

<td>грузоперевозки</td>

</tr>

<tr>

<td>стройматериалы</td>

<td>ответственное хранение</td>

</tr>

<tr>

<td>одежда, обувь</td>

<td>консультирование</td>

</tr>

<tr>

<td>детские игрушки</td>

<td>кредитование</td>

</tr>

</table>

Более подробно об ассортименте товаров и услуг вы можете узнать в нашем отделе сбыта.

</body>

</html>

Рис. 2.21.]]> Форматирование таблицы

Ширина рамки таблицы задается соответствующим значением атрибута . В нашем примере ему присвоено значение , поэтому толщина рамки таблицы составляет 2 пикселя.

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

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

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

Листинг 1.8.]]> Центрирование таблицы и ячеек

<html>

<head>

<title>Компания "Торговый мир"</title>

</head>

<body>

<h1>Добро пожаловать!</h1>

<tr>

<td bgcolor="yellow" align="center"><b>Товары</b></td>

<td bgcolor="yellow" align="center"><b>Услуги</b></td>

</tr>

<tr>

<td align="center">промтовары</td>

<td align="center">грузоперевозки</td>

</tr>

<tr>

<td align="center">стройматериалы</td>

<td align="center">ответственное хранение</td>

</tr>

<tr>

<td align="center">одежда, обувь</td>

<td align="center">консультирование</td>

</tr>

<tr>

<td align="center">детские игрушки</td>

<td align="center">кредитование</td>

</tr>

</table>

Более подробно об ассортименте товаров и услуг вы можете узнать в нашем отделе сбыта.

</body>

</html>

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

Рис. 2.22.]]> Центрирование таблицы и содержимого ячеек

Далее вставим в наш документ изображение. Об этом читайте в следующем разделе.

Оглавление книги

Оглавление статьи/книги

Похожие страницы