Как выводить маленькую картинку в предосмотре статьи, а полную в самой статье? - Галереи

Уже долгое время бьюсь над одним вопросом, как реализовать такое:
Нужно что бы в вводном тексте выводилась маленькая картинка, например, размер 100х100,
а при просмотре статьи что бы показывалась картинка уже с оригинальными размера.

И чтобы это работало не так что картинка просто выводиться меньшего размера, а нужно что бы она реально и весила меньше.
Т.е. как работает в магазине virtuemart. Там когда добавляешь картинку в товар, то автоматом создается уменьшенное изображение указанного размера.

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

Пока сделал по тупому через css:
table.blog img {
height:100px;
width:100px;
}

Пример у меня на сайте: http://zdorovja.com.ua

Но фактически картинки по занимаемому обьему не уменьшились и поэтому грузятся большие изображения.

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

Хотел бы узнать есть ли какое-то решение этой задачи?

меня тоже интересует такой вопрос, так как же так сделать?