M.org

Если хочешь получать нормальные деньги - то уровень бога. Сейчас переизбыток "мега-верстальщиков" которые за 5 баксов готовы браться.

На главной yomoto.ru старый дизайн, его не будет.

Новый дизайн тут - yomoto.ru/beta

Спасибо! по поводу "уже было" - если во всем преследовать цели только уникальности, представьте себе если каждая машина будет содержать руль с педалями в новом месте Над аккуратностью поработаю еще.

У #content div.photo убери фиксированную ширину, пускай тянется сам блок, а картинка остается по центру.

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

Если кому интересно - тут готовый сайт.

По поводу разрешений - простая статистика. Надеюсь вопросов "зачем" больше нет? Вспомните еще про нетбуки, которые в большинстве своем 1024*600.

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

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

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

У вас что-то с монитором Ховер зеленый, а "пустота" - в правой части. По центру специально не стал делать - много задал через position:absolute (чем зато добился почти идеального соответсввия между браузерами) Ховер попробую еще сделать инвертированным (белые буквы синий фон), не первый человек который к нему цепляется

Ссылку ещё побольше сделать физически не получилось, да? Что за неуважение?

Мог бы - сделал больше. Неуважение к кому? Мне вот не прикольно выискивать в черном тексте черные ссылки (да-да, это не ссылка) - вот это неуважение.

З.Ы. оффтопик: удивляет, то что тому 90% г**на что здесь выкладывают оставляют комментарии "Нормально, пойдет", "мне нравится", а тут тотальная неприязнь.

Это ужасно! Синий фон вообще не в тему, шапка вышибает слезу. Что за бардак внизу кода страницы?

Делаю третью версию своего сайта. Интересуют замечания по верстке (то что она не валидна - знаю, это "спасибо" скрипту движка. Обязательно поработаю над этим), дизайну, юзабилити, в общем - все.

ссылка

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

З.Ы. Вот макет предыдущей версии дизайна, к сожалению воплотить его в таком виде не хватило времени, оцените дизайн плиз:

кнопка войти ИМХО как раз неудачная. Она оригинальная, это да, красивая - но теряется.

А, еще в pspad встроен ftp, так что теперь я шаблоны прямо на сервере правлю

Набрел на PSPad.

Freeware, подсветка кода, валидация, встроенный Tiny, оптимизатор css и html (включая возможность окрасивить код ), русифицированный, и много-много плюшек.

Эм, мне нужна программа с возможностью форматировать html в удобочитаемую разметку, и не dreamweaver.

А просто для подсветки у меня есть уже программа

Начинал с блокнота, первый раз dreamweaver (версия 3.0 была, сейчас уже 9ая по счету идет) попробовал 9 лет назад, и долгое время потом его использовал. Сейчас делаю все в akelpad с подсветкой, вернулся к истокам, так сказать

А тэги надо самому не забывать закрывать ИМХО в коде лучше разбираешься, когда его сам делаешь от а до я.

З.Ы. код переформатировал, вспомнил где эта опция

<p> убрал, это лишний выскочил

Мне что, ставить дрим только ради того чтобы он мне код исправил? Ладно, Portable версию слил, как его заставить мне код прошерстить?

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

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

Новая проблемка. Есть заголовок через h1, сразу за ним следует div с датой. Заголовок подлезает под div. Есть выход заключить заголовок в отдельный див с фиксированной шириной, но некрасиво.

CSS дива с датой

.date {
BACKGROUND-IMAGE:url(images/date.png);
WIDTH:64px;
HEIGHT:65px;
TEXT-ALIGN:center;
PADDING-TOP:7px;
FLOAT:right;
MARGIN-TOP:-75px;
OVERFLOW:hidden;
LEFT:100px
}.date span {
COLOR:#6b3668;
FONT:22pt Tahoma;
LEFT:10px
}

.date div {
COLOR:#6b3668;
FONT:14px Tahoma;
MARGIN-TOP:-2px;
LETTER-SPACING:-1px
}

Кусок html с заголовком и датой.

<div class="content"><h1><a href="#">Handy Weather — погодный информер</a></h1>
<div class="date"><span>10</span><div>февраля</div></div>

Кстати, невалидное решение, подскажите как сделать это валидно?

Спасибо, почитаю.

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

Мне вот это помогло:

.content:after
{
	content:'';
	display:block;
	clear:both;
}

Но и ваш вариант подошел. По поводу матчасти: мне тупо непонятно, почему картинка вылезла ЗА пределы блока.

Косяк:

Код страницы:

<!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=windows-1251" />
  <title>yomoto:.beta</title>
  <link rel="stylesheet" type="text/css" href="mainstyle.css" />
 <link rel="shortcut icon" href="images/favicon.ico" />
 </head>
 <body>
<div id="header"><img src="images/logo.png" class="logo" alt="yomoto.ru:. ты и твой телефон"/></div>
<div id="main"><div class="content"><h1>Motorola ROKR E8</h1><p><img src="test.jpg" alt="" /><p>Свои цифровые компакты компания Samsung вполне логично делит на группы по позиционированию. И если вспоминать наиболее продвинутые в плане технических возможностей модели, то на ум, конечно же, приходит линейка «NV». Широкий угол, система стабилизации, интересная оптика — все это можно найти в моделях, принадлежащих этой линейке. В этом обзоре речь пойдет о новом цифровом компакте — NV100 HD.</p>
</p></div><div class="content"><h1>Motorola ROKR E8</h1><p><img src="test.jpg" alt="" /><p>Свои цифровые компакты компания Samsung вполне логично делит на группы по позиционированию. И если вспоминать наиболее продвинутые в плане технических возможностей модели, то на ум, конечно же, приходит линейка «NV». Широкий угол, система стабилизации, интересная оптика — все это можно найти в моделях, принадлежащих этой линейке. В этом обзоре речь пойдет о новом цифровом компакте — NV100 HD.</p>
</p></div>
</div>
<div id="navi"><div class="model">
<ul>
<li><h2>ROKR E8</h2><ul>
<li>прошивка</li>
<li>игры</li>
<li>приложения</li>
<li>видео</li>
<li>картинки</li>
<li>скины</li></ul></li></ul>
</div>
</div>
 </body>
</html>

CSS:

body {
background:#191919;
background-image:url('images/bg.png'); 
margin:30px 30px 0;height: 100%;}
html {height: 100%;}

#header {
height:100px; 
width:943px; 
background:#342033; 
background-image:url('images/header_bg.png'); 
background-repeat:repeat-x;}

#main {width:944px;
background:#fff;padding-top:20px;}
.content {padding-top:16px;margin-left:33px;font:10.5pt Tahoma; color: #5a5a5a;float:none;width:600px;border:1px solid;}

.content Img {margin-left:10px;margin:0 10px 10px 0;padding:0px;float:right;}

.content H1 {
font: 26pt Tahoma;
padding-top:0;
margin-bottom:10px;
margin-top:0; 
color:#000}

.content P {margin-top:0; margin-bottom:15px;text-indent: 30px;text-align:left;}

.logo {
margin-left:15px; 
margin-top:18px;}

#navi {min-height: 100%;height : 100%;
width:291px; 
background:#f6f7fb;
position: absolute;
left: 681px; 
top: 130px;}

.model {
padding-top:10px; 
width:130px;
float:left;
text-align:right; 
font:10.5pt Tahoma; 
color:#5a5a5a;
padding-right:15px; list-style-type: none;}

.model UL,LI {list-style-type: none; margin-left: 0; padding-left: 0; margin-top:0px; padding-top:0px;}

.model h2 {
font: 18pt Tahoma;
padding-top:0;
margin-bottom:-5px;
margin-top:0; 
color:#000}

Проблема в том, что если картинка в блоке контента выше него самого, то она накладывается на следующий блок. Если блок контента сделать таблицей, то проблем 0, но не хотелось бы. Если убрать параметр float:right; у картинки, все приходит в норму, но обтекание то нужно! А если задать обтекание через align косяк остается.

Что делать?

Dimitry Wolotko, ага, +1.

Vlad, чем Smarty отличается от других движков