Изменение веб-сайтов во времени

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

Вчера...

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

Capture du premier site de Zuckerberg

Счетчик посещений

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

Пример справа - скриншот первого сайта основателя Facebook Марка Цукерберга с его неизбежным счетчиком посещений. Он все еще на Angelfire.com.

Счетчик в PHP всегда доступен на этом сайте.

Золотая книга

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

Анимированные GIF

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

Страница ввода

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

Кнопка моего сайта

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

Они иногда требовались в обмен на услуги сайта, что заставляло видеть домашние страницы с большим количеством кнопок, что занимало больше времени загрузки, чем содержание страницы !

Цветовая габегия

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

Заголовок крупным шрифтом
Меню кнопок
 
Нижний колонтитул со ссылками

Компоновка: таблица и набор рамок

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

Куча связей внизу

Сноска сайтов предыдущего десятилетия была такой...

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

Сегодня

А потом перешли на Web 2.0: социальную сеть, базы данных MySql, менеджеры контента, динамические сайты с Ajax и mashup .

Социальные батоны

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

Изображения и видео

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

Компоновка в CSS

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

Шаблон заменяет фреймы

Шаблон в PHP может использоваться для статического узла или CMS. Фактически можно повторно использовать шаблон для Wordpress под лицензией GPL на статическом сайте.
Шаблон PHP выглядит следующим образом:

<?php $title="";
include("header.php");
include("sidebar.php");
?>
<div> 
// contenu
</div>
<?php include("footer.php"); ?>

Просто измените файлы header.php, sidebar.php или footer.php, чтобы обновить весь сайт.

Современный футболист

Брусчатку заменяют кнопки Twitter, Stumbleupon и другие социальные сайты. Пользователя просят помочь обнародовать страницу, роли изменились!

Завтра...

Эволюция дизайна сайтов такова, как описывает Web 2.0: это уже не документы, размещенные в сети, это динамические страницы, сделанные специально для пользователей Интернета и использующие все разработанные средства проектирования.

Затем идут CSS 3 и HTML 5. Первый облегчает спецэффекты, адаптацию сайта к материалу, одна страница отличается на мобильном и настольном компьютере.
Второй предназначен для веб-приложений, с более полными формами и Canvas, который интегрирует векторную графику в содержание.
WebGL, использует аппаратные 3D-ресурсы для 3D-приложений.

Чего можно ожидать от еще более далекого будущего?

Читайте также: Как не реализовать интерфейс сайта .