Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > Вёрстка веб-сайтов > Оптимизация кода


Автор: ТипТопыч 2.1.2007, 21:30
Помогите пожалуйста оптимизировать код страницы, страница должна выглядеть примерно так http://ereality.nm.ru/map/map.html

В общем необходимо уменьшить вес страницы и сделать чтобы в эксплорере при наложении картинок друг на друга (например подъемник на карту шахты) верхняя картинка не закрывала нижнюю- чтоб то что дожно быть прозрачным было прозрачным. smile И чтоб при наведении курсора на картинку работала подсказка..

Автор: Arahnoid 5.1.2007, 14:32
ТипТопыч,  ну это ты точно не ручками верстал а надо именно ручками smile 
признавайся в чем верстал smile 

я думаю легче будет просто переверстать это все 

Автор: ТипТопыч 5.1.2007, 23:41
Ручками эт как? smile Честно говоря в хтмл я совсем не разбираюсь, так что написал программку, генерирующую страницу... smile 

Теперь вот думаю как бы это получше сделать.. smile 

Автор: Arahnoid 6.1.2007, 16:27
ТипТопыч, с начала возми свою карту и в фотошопе при помощи направляющих раздели ее на сетку(таблицу) а потом сохрани эти кусочки в формате gif
для удобства советую называть их 2-мя цыфрами, первая номер ряда а вторая столбца

вот для таблицы на 3 ряда и 4 колонки
1_1   1_2   1_3   1_4

2_1   2_2   2_3   2_4

3_1   3_2   3_3   3_4

а потом йто все загоняеш в таблицу
Код


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>

<!--Здесь делаем фон для страницы -->
<style type="text/css">
/*сылка реальная там я сохранил повторяющейся кусочек фона
http://m.foto.radikal.ru/0701/81eb5791c16f.jpg*/
body{background-image: url(http://m.foto.radikal.ru/0701/81eb5791c16f.jpg);
    color:#FFFF00;}

</style>
</head>
hello

<body>
<table align="center">

<!--первый ряд-->
<tr>
       <td>1_1.gif</td>
       <td>1_2.gif</td>
       <td>1_3.gif</td>
       <td>1_4.gif</td>
</tr>

<!--второй ряд-->
<tr>
       <td>2_1.gif</td>
       <td>2_2.gif</td>
       <td>2_3.gif</td>
       <td>2_4.gif</td>
</tr>

<!--третий ряд-->
<tr>
       <td>3_1.gif</td>
       <td>3_2.gif</td>
       <td>3_3.gif</td>
       <td>3_4.gif</td>
</tr>
<table>
</body>
</html>



ну а дальше уже какнибудь сам smile 

Автор: Str!pe 6.1.2007, 20:52
ТипТопыч, 

У тебя там повторяющихся элементов море! Разреж. Найди такие кусочки мозаики которые повторяются и просто на этом месте каждый раз вставляй картинку одну и ту же! Так вместо допустим 10 рисунков вставишь всего 1. Это что касается шахты. Что касается "земли"... это еще проще... подбери такой же один элемент и вообща запихай его фоновым рисунком.

Совсем забыл.. перед тем что я написал выполни то что написал тебе Arahnoid. Удачи  smile 

Автор: ТипТопыч 6.1.2007, 21:54
Проблема в том что картинка не статична и ее периодически приходится редактировать.. И делать это удобнее по секторам, если делать прямоугольниками то слишком замороченно получается...

Автор: Str!pe 6.1.2007, 21:59
ТипТопыч, 
Так по секторам и разбей на отдельные картинки... или перенарезай каждый раз... а по другому ты не оптимизируешь... у тебя всего одна картинка в коде... весь вес она на себя берет.

Добавлено @ 22:02 
Я как понимаю это игра? Значит это с сервера берется! Могу конечно сойти за психа... но как вариант, скрипт который будет нарезать на картинки. а редактировать цельную картинку. smile 

Автор: ТипТопыч 9.1.2007, 00:37
Мдя.. Единственное разумное решение, пришедшее в голову- написать "подчишающюю" програмку, которая удаляет все строки с фоновой картинкой, получается вполне сносно smile 

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)