SaaS / SaaS: 2.3 - HTML and CSS

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

(анонимно) 25.02.12 в 13:42

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

(анонимно) 25.02.12 в 13:44

главные моменты.

(анонимно) 25.02.12 в 13:45

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

galiyashka 28.02.12 в 13:29

верхнем уровне клиент-сервера, HTTP и т.д., и сейчас мы спустимся на

galiyashka 28.02.12 в 13:30

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

galiyashka 28.02.12 в 13:31

Итак, очень просто, язык разметки, или вариант как отформатировать какой-то контент, и получить

galiyashka 28.02.12 в 13:32

разницу между чем-то таким и таким, который будет размечен так, чтобы

galiyashka 28.02.12 в 13:38

это все выглядело так. Ну вот и все ваше обучение [смех]. Я

galiyashka 28.02.12 в 13:34

шучу. Я шучу. Итак, многие из вас скорее всего уже неформально знакомы с

galiyashka 28.02.12 в 13:34

HTML. Он на самом деле наследник языка, который IBM разработала

galiyashka 28.02.12 в 13:35

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

galiyashka 28.02.12 в 13:36

информацией в компактном виде. И версия IBM стала по сути

galiyashka 28.02.12 в 13:39

открытым стандартом в 80ые.

galiyashka 28.02.12 в 13:39

элементов, заголовков, таблиц, и штук вроде этих. Штуки могут быть

Igorrr 28.02.12 в 13:45

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

Igorrr 28.02.12 в 13:46

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

Igorrr 28.02.12 в 13:47

имеют атрибуты и могут быть вложены друг в друга. Теперь, я могу говорить всё это

Igorrr 28.02.12 в 13:49

или мы посмотрим на пример и это будет намного более понятней. Давайте переключимся на

Igorrr 28.02.12 в 13:51

Файерфокс. Хеллоу ворлд это не очень интересный пример, но

Igorrr 28.02.12 в 13:52

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

Igorrr 28.02.12 в 13:53

Я собираюсь посмотреть исходный код из Файерфокса и кстати,

Igorrr 28.02.12 в 13:54

отклоняясь от темы, очень полезная вещь в Файерфоксе это

Igorrr 28.02.12 в 13:54

панель веб-разработчика. Если вы разрабатываете что-то нетривиальное в вебе, то

Igorrr 28.02.12 в 13:57

она вам здорово пригодится. Вот внутренний HTML-код этой страницы и,

Igorrr 28.02.12 в 13:57

вы знаете, очень просто выделить элементы взглядом, так ведь?

Igorrr 28.02.12 в 14:00

Вот элемент который называется «title» — это заголовок окна, который должен быть:

Igorrr 28.02.12 в 14:02

«Факультет компьютерных наук». Вот. Таблица с кучей строк, в которой находятся

Igorrr 28.02.12 в 14:04

все эти пункты меню, и так далее. Но знаете, что тут важно, так это то,

Igorrr 28.02.12 в 14:06

что элементы сделаны так, чтобы их было легче читать

Igorrr 28.02.12 в 14:07

хотя выравнивание и не является частью HTML. Но вы видите, что для каждого

Igorrr 28.02.12 в 14:08

открывающего тега, вот например открывающий TR, где-то там есть

Igorrr 28.02.12 в 14:09

закрывающий TR, который совпадает с ним, и это бу, бу, бу, бу, бу.

Igorrr 28.02.12 в 14:11

Ага, вот он. Всё, что внутри тега вместе это содержимое элемента.

Igorrr 28.02.12 в 14:12

Некоторые элементы. Например, эта ссылка содержат что-то.

Igorrr 28.02.12 в 14:13

Ну, то есть эта ссылка имеет атрибут «attrib», который говорит куда она ведёт.

Igorrr 28.02.12 в 14:30

Но настоящее содержимое это то, что отображается на экране.

Igorrr 28.02.12 в 14:31

форматирование к странице. Давайте кратко обсудим принцип, по которому это работает. И

valeriya_z 27.02.12 в 16:23

что касается Вложенных Таблиц Стилей (CSS). Идея CSS такова, что вы разграничиваете

valeriya_z 27.02.12 в 16:25

визуальное представление страницы и ее логическую структуру. Вы помещаете

valeriya_z 27.02.12 в 16:25

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

valeriya_z 27.02.12 в 16:26

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

valeriya_z 27.02.12 в 16:28

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

valeriya_z 27.02.12 в 16:31

структуры и наполнения страницы лишенными всяческих украшений или

valeriya_z 27.02.12 в 16:33

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

valeriya_z 27.02.12 в 16:36

логические элементы страницы. Позиционирование бренда. Возможно, вы

valeriya_z 27.02.12 в 16:40