DIKARKA

Корпоративные сайты. Создаем. Оптимизируем. И т.д.

274 сообщения в этой теме

ID: 141   Опубликовано: (изменено)

QUOTE(Морвен @ Aug 21 2009, 22:19)
можете кинуть посмотреть?


Вот можете тут посмотреть, и выбрать, что вам понравится больше bigwink.gif Я, в основном, сбрасываю margin и padding, ну и еще кое-что по мелочи. Изменено пользователем Shillien

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
QUOTE(Shillien @ Aug 6 2009, 10:01)
QUOTE(Anna-M @ Aug 4 2009, 16:41)
А мне покритикуйте? Пожалуйста smile.gif Я тааак много хочу в нем изменить... Но хороших программистов ТАК мало sad.gif

ОХРАНА
www.ohrana-samara.ru

Буду признательна smile.gif


Некоторый опыт в верстке есть, поэтому, прокомментирую:
Бегущую строку убрать — без вариантов. Как прием, устарело еще лет 10 назад, + красный жирный ужасно раздражает и сам по себе, а в движении — еще больше.
Подчеркнутые слова красным — у вас на сайте подчеркнуты ссылки, поэтому кажется, что красные слова тоже ссылки, а на деле — нет. Лучше подчеркивание убрать, а то сбивает с толку.
Кнопочки в главном меню не реагируют на hover — зря, сделайте небольшую подсветку, что ли, чтобы было ясно, что это кнопочки и их можно нажимать. (ИМХО, правило хорошего тона)
Жирный + курсив — убрать!
Слова, набранные ТОЛЬКО ВЕРХНИМ РЕГИСТРОМ — убрать, без вариантов! У вас даже в шапке все капсом набрано no.gif
Все "латинские" кавычки заменить на "русские" — ХТМЛ-выражение « и » Так же, при наборе текстов используйте неразрывные пробелы   и длинные/средние тире, например, — а не дефис -.
Кнопочку подробнее — убрать, вместо нее сделать ссылкой весь краткий текст.
Карандаш, рисующий что-то непонятное рядом с заголовком СПЕЦПРЕДЛОЖЕНИЯ — нигде нет иконок, значит и тут уберите, тем более анимированная. Анимированные иконки в прошлом, и давно, а у вас они кое-где встречаются.
4 На мониторе 1024х768 слова в шапке "446430, Кинель ул. Маяковского, 57
(84663) 6-53-94" съехали на машину и поэтому эта информация не читаема
согласна
8 Ну и очень распространенная ошибка это "копирайт-копирайт" в футере. У вас Copyright © а надо либо Copyright либо ©

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



а это что такое? нас в универе не учили biggrin2.gif cry.gif

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
QUOTE(Shillien @ Aug 21 2009, 19:25)
QUOTE(Морвен @ Aug 21 2009, 22:19)
можете кинуть посмотреть?


Вот можете тут посмотреть, и выбрать, что вам понравится больше bigwink.gif Я, в основном, сбрасываю margin и padding, ну и еще кое-что по мелочи.



ой, спасибо flowers1.gif А нет часом какой-нибудь ссылки по организации структуры сайта чтобы ничто никуда не съезжало? Нас учили в универе, учили, но толком ничему и не научили. Я скоро планирую для учебы делать человеку сайт (за бесплатно), поэтому оч надо angel_innocent.gif

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

ID: 144   Опубликовано: (изменено)

QUOTE(Морвен @ Aug 21 2009, 22:32)
QUOTE(Shillien @ Aug 6 2009, 10:01)

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



а это что такое? нас в универе не учили biggrin2.gif cry.gif


http://validator.w3.org/ там все написано, правда, на английском whistling.gif Если коротко, соответствие верстки заявленному стандарту, отсутствие ошибок. Вот кстати, самая первая строка практически любого сайта (эта — прямо отсюда, с форума):
CODE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Результаты для HTML forum.cosmo.ru: Result: 92 Errors, 32 warning(s)
Что бы не уезжало, верстайте таблицами smile.gif Если вас учат против таблиц, то не верьте — на 99% это просто холивар, как линух против винды biggrin2.gif Изменено пользователем Shillien

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
QUOTE(Shillien @ Aug 21 2009, 19:39)
QUOTE(Морвен @ Aug 21 2009, 22:32)
QUOTE(Shillien @ Aug 6 2009, 10:01)

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



а это что такое? нас в универе не учили biggrin2.gif cry.gif


http://validator.w3.org/ там все написано, правда, на английском whistling.gif Если коротко, соответствие верстки заявленному стандарту, отсутствие ошибок. Вот кстати, самая первая строка практически любого сайта (эта — прямо отсюда, с форума):
CODE
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Что бы не уезжало, верстайте таблицами smile.gif Если вас учат против таблиц, то не верьте — на 99% это просто холивар, как линух против винды biggrin2.gif



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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
А по поводу верстки: я верстала на работе журнал, пока заменяла сотрудницу, в принципе мысль верстки печатного издания поняла. Есть еще верстка веб-страниц, она отдельно идет?

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
QUOTE(Морвен @ Aug 21 2009, 22:43)
у нас тройки за сайты ставили если он табличный аль не дай  боже фиксированный.... А вообще я часто встречаю отличное решение данной проблемы - делается центральный блок с фиксированный со всеми навигациями, содержимым, а он уже плавает в гибком блоке, который зависит от размера окна.


Сочувствую, ваш препод — типичных холиворщик. Я бы не поленилась погуглить на тему "таблицы против дивов", и принести ему пару сотен страниц распечаток fegh.gif Я верстаю фиксированно или резиново, в зависимости от необходимости. Нет такого правила — что резиновая верстка правильна, а фиксированная ошибочна, и для таблиц/дивов то же самое. Например, при ширине окна браузера в 1918 пикселей (как у меня) резиновая верстка это зло, потому что читать абсолютно невозможно текст, размазанный по такой ширине. В зеленом скине космо как раз резиновая верстка, из-за этого не могу им пользоваться. Так что, для препода делайте, как он хочет, а для себя запоминайте — любой вариант имеет право на существование, если он без ошибок, компактен и оптимизирован. Насчет
А по поводу верстки: я верстала на работе журнал, пока заменяла сотрудницу, в принципе мысль верстки печатного издания поняла. Есть еще верстка веб-страниц, она отдельно идет?

ничего конкретного сказать не могу. Я до всего доходила методом тыка. Открывайте исходники любой страницы и смотрите, учитесь на чужих работах. Ищите сильные и слабые стороны, удачные приемы, и станете профи smile.gif

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
QUOTE(Shillien @ Aug 21 2009, 19:25)
QUOTE(Морвен @ Aug 21 2009, 22:19)
можете кинуть посмотреть?


Вот можете тут посмотреть, и выбрать, что вам понравится больше bigwink.gif Я, в основном, сбрасываю margin и padding, ну и еще кое-что по мелочи.



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

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
QUOTE(Shillien @ Aug 21 2009, 19:52)
QUOTE(Морвен @ Aug 21 2009, 22:43)
у нас тройки за сайты ставили если он табличный аль не дай  боже фиксированный.... А вообще я часто встречаю отличное решение данной проблемы - делается центральный блок с фиксированный со всеми навигациями, содержимым, а он уже плавает в гибком блоке, который зависит от размера окна.


Сочувствую, ваш препод — типичных холиворщик. Я бы не поленилась погуглить на тему "таблицы против дивов", и принести ему пару сотен страниц распечаток fegh.gif Я верстаю фиксированно или резиново, в зависимости от необходимости. Нет такого правила — что резиновая верстка правильна, а фиксированная ошибочна, и для таблиц/дивов то же самое. Например, при ширине окна браузера в 1918 пикселей (как у меня) резиновая верстка это зло, потому что читать абсолютно невозможно текст, размазанный по такой ширине. В зеленом скине космо как раз резиновая верстка, из-за этого не могу им пользоваться. Так что, для препода делайте, как он хочет, а для себя запоминайте — любой вариант имеет право на существование, если он без ошибок, компактен и оптимизирован. Насчет
А по поводу верстки: я верстала на работе журнал, пока заменяла сотрудницу, в принципе мысль верстки печатного издания поняла. Есть еще верстка веб-страниц, она отдельно идет?

ничего конкретного сказать не могу. Я до всего доходила методом тыка. Открывайте исходники любой страницы и смотрите, учитесь на чужих работах. Ищите сильные и слабые стороны, удачные приемы, и станете профи smile.gif



1918 пикселей - это скоко? biggrin2.gif как вообще эту систему исчисления прикидывать на глаз?

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
В общем беру я понравившийся мне по оформлению сайт, открываю и смотрю как они что там сделали))) Попробую так определиться в оформлении будущего своего сайта)

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
QUOTE(Морвен @ Aug 21 2009, 22:58)
1918 пикселей - это скоко?  biggrin2.gif  как вообще эту систему исчисления прикидывать на глаз?


Зачем на глаз, это точная система мер... blink.gif У вас какое разрешение монитора ?
ЗЫ: мб в ЛС или в аську, а то как бы нас не того... за флуд whistling.gif

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
QUOTE(Shillien @ Aug 21 2009, 20:06)
QUOTE(Морвен @ Aug 21 2009, 22:58)
1918 пикселей - это скоко?  biggrin2.gif  как вообще эту систему исчисления прикидывать на глаз?


Зачем на глаз, это точная система мер... blink.gif У вас какое разрешение монитора ?
ЗЫ: мб в ЛС или в аську, а то как бы нас не того... за флуд whistling.gif



я думала предложить biggrin2.gif

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
QUOTE(Морвен @ Aug 21 2009, 19:44)
а как это исправляется? Вообще мне на диплом сайт делать, нас учили что лучше гибкий дизайн, но.. . я сколько не мучилась с курсовой - гибкий сноситься. Т.е сжимаешь окно справа и в какой-то момент блок инфы в этом стороне перепрыгивает вниз... Получается кошмар. Как вообще организуется структура страниц, чтобы избежать такой грубой ошибки?




Гибкий (тоесть резиновый) делается не фиксированной шириной таблиц(если таблицами верстка), а указанием ширины процентами, там уже подбирается нужная ширина каждой ячеки yes.gif

Структура организуется исходя из контета...Даже не знаю как понятно объяснить...Ну предположим у вас есть шапка сайта, после нее три колонки в которых контент(например меню слева, тест посередине и справа какой-то контент) и низ (подвал)

Тогда структура будет такая
<html>
<head>
тут всякие мета-теги, тайтл
</head>
<body>
<table width="100%">
<tr>
<td>тут шапка сайта, исходя из контент ячеек может быть больше</td>
</tr>
<tr>
<td valign="top">тут левая колонка</td><td valign="top">тут середина </td><td valign="top">тут правая колонка
</td>
</tr>
<tr>
<td width="100%">Подвал</td>
</tr>
</table>
</body>
</html>

Вот вам самая элементарная структура, для того, чтоб блоки не съезжали вниз, я поставила вертикальное выравнивание по верхнему краю (valign="top")
Ну естественно можно выставить в процентном соотношении ширину каждой ячеки, исходя из объема контента, так же можно выровнять левую колонку по левому краю, а правую по правому, но это уже ньюансы.

Короче структура разрабатывается исходя из объема вашего контента.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
QUOTE(Shillien @ Aug 21 2009, 20:08)
В программах нет ничего плохого, если ими правильно пользоваться. Я пользуюсь дримвивером для верстки, потому что мне неохота вручную каждый раз прописывать кучу мелочи. А вот css дримвиверу не доверяю, пишу всегда вручную, а то он действительно невероятно много строчек плодит, когда можно обойтись и одной  ranting_w.gif Лучше всего сделать основу в дримвивере, затем побыстрому подчистить и подправить все в блокноте smile.gif Ну, это что касается HTML+CSS. JS и PHP я полностью в блокноте пишу, пользуюсь Notepad++ thumbsup.gif


Мда, хуже дримвивера можэет быть только фронт пейдж (имхо brows.gif ) Зачем вручную прописывать, в нотепад ++ есть автоподстановка тегов...Просто не понимаю, зачем пользоваться дримвивером, он неудобный, там не все сразу понятно и тп...

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
QUOTE(Ангел_А @ Aug 22 2009, 14:27)
QUOTE(Морвен @ Aug 21 2009, 19:44)
а как это исправляется? Вообще мне на диплом сайт делать, нас учили что лучше гибкий дизайн, но.. . я сколько не мучилась с курсовой - гибкий сноситься. Т.е сжимаешь окно справа и в какой-то момент блок инфы в этом стороне перепрыгивает вниз... Получается кошмар. Как вообще организуется структура страниц, чтобы избежать такой грубой ошибки?




Гибкий (тоесть резиновый) делается не фиксированной шириной таблиц(если таблицами верстка), а указанием ширины процентами, там уже подбирается нужная ширина каждой ячеки yes.gif

Структура организуется исходя из контета...Даже не знаю как понятно объяснить...Ну предположим у вас есть шапка сайта, после нее три колонки в которых контент(например меню слева, тест посередине и справа какой-то контент) и низ (подвал)

Тогда структура будет такая
<html>
<head>
тут всякие мета-теги, тайтл
</head>
<body>
<table width="100%">
<tr>
<td>тут шапка сайта, исходя из контент ячеек может быть больше</td>
</tr>
<tr>
<td valign="top">тут левая колонка</td><td valign="top">тут середина </td><td valign="top">тут правая колонка
</td>
</tr>
<tr>
<td width="100%">Подвал</td>
</tr>
</table>
</body>
</html>

Вот вам самая элементарная структура, для того, чтоб блоки не съезжали вниз, я поставила вертикальное выравнивание по верхнему краю (valign="top")
Ну естественно можно выставить в процентном соотношении ширину каждой ячеки, исходя из объема контента, так же можно выровнять левую колонку по левому краю, а правую по правому, но это уже ньюансы.

Короче структура разрабатывается исходя из объема вашего контента.



мы делали шапку, под ней центральный блок, справа и слева от него были еще меньшие по размеру блоки. В итоге при определенном сжатии браузера у меня самый правый блок скидывался вниз.... Г полное получалось. Могу кинуть исходник. в примере у вас идет таблица, мы же через div делали. Может поэтому и слетало?

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
QUOTE(Морвен @ Aug 22 2009, 17:18)
мы делали шапку, под ней центральный блок, справа и слева от него были еще меньшие по размеру блоки. В итоге при определенном сжатии браузера у меня самый правый блок скидывался вниз.... Г полное получалось. Могу кинуть исходник. в примере у вас идет таблица, мы же через div делали. Может поэтому и слетало?


ну киньте исходник...только сразу могу сказать, сделайте таблицами, как я описала, как раз у вас тоже самое, что я выше написала только без подвала. А до какого состояния сжимали браузер?? И вообще зачем вы его сжимали? biggrin.gif biggrin2.gif Разрешение монитора надо смотреть и на разных разрешениях пробовать, а не браузер сжимать.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
QUOTE(Shillien @ Aug 21 2009, 18:10)
лучше 1 раз заплатить, и получить качественный, и, что важно, красивый и удобный сайт, чем заплатить мало, и иметь не "интернет-лицо"  фирмы, а, извините, совсем другую часть тела...


Это меня и пугает... А то получится, как наш основной сайт (я его выкладывала на 5 странице). Руководство сложно переубедить, что он плохой... И как уговорить выделить средства на сайт, я просто ума не приложу...

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
QUOTE(Anna-M @ Aug 22 2009, 20:17)
QUOTE(Shillien @ Aug 21 2009, 18:10)
лучше 1 раз заплатить, и получить качественный, и, что важно, красивый и удобный сайт, чем заплатить мало, и иметь не "интернет-лицо"  фирмы, а, извините, совсем другую часть тела...


Это меня и пугает... А то получится, как наш основной сайт (я его выкладывала на 5 странице). Руководство сложно переубедить, что он плохой... И как уговорить выделить средства на сайт, я просто ума не приложу...


А вы и не переубедите, это нужно просто понимать cool.gif

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
QUOTE(Ангел_А @ Aug 22 2009, 18:45)
QUOTE(Морвен @ Aug 22 2009, 17:18)
мы делали шапку, под ней центральный блок, справа и слева от него были еще меньшие по размеру блоки. В итоге при определенном сжатии браузера у меня самый правый блок скидывался вниз.... Г полное получалось. Могу кинуть исходник. в примере у вас идет таблица, мы же через div делали. Может поэтому и слетало?


ну киньте исходник...только сразу могу сказать, сделайте таблицами, как я описала, как раз у вас тоже самое, что я выше написала только без подвала. А до какого состояния сжимали браузер?? И вообще зачем вы его сжимали? biggrin.gif biggrin2.gif Разрешение монитора надо смотреть и на разных разрешениях пробовать, а не браузер сжимать.



Что б сносилось я не нашла, видать удалила эту версию. Но есть косяк интереснее - шаблон, сделанный в дримере внизу страницы мне добавил кучу пустого места. С чего - не знаю. Заодно если можно, подскажите - делается ли по такому принципу структура гибкого сайта? У нас там куча дивов друг в друге, дабы ничего не съезжало. По поводу сжимания - преподавательница так нас проверяет..... blink.gif

Одна проблема: не прикрепляется рар архив, пишет нет прав для такой загрузки huh.gif

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
QUOTE(Морвен @ Aug 23 2009, 13:19)

Что б сносилось я не нашла, видать удалила эту версию. Но есть косяк интереснее - шаблон, сделанный в дримере внизу страницы мне добавил кучу пустого места. С чего - не знаю. Заодно если можно, подскажите - делается ли по такому принципу структура гибкого сайта? У нас там куча дивов друг в друге, дабы ничего не съезжало. По поводу сжимания - преподавательница так нас проверяет..... blink.gif

Одна проблема:  не прикрепляется рар архив, пишет нет прав для такой загрузки huh.gif


В рар и не прикрепится, скопируйте в блокнот и попробуйте так shuffle.gif дримвивер вообще кучу ненужного кода делает wacko.gif shutup.gif
Как я написала, гибкий сайт отоличается от негибкого указанием ширины не в пикселях а в процентах, образно говоря. Тоесть, если у вас размер всей таблички будет 800 px, то он ни сжаться не расширится не сможет, а если ширина будет равна 100%, то cодержимое будет выравниваться на всю ширину монитора yes.gif

Я думаю у вас это из-за кол-ва дивов, где-то косяк есть видимо, может дивов кучу наставили...А вам надо именно дивами делать? Просто, имхо, с табличкой проще в вашем случае будет добится того, чтоб нигде ничего не съезжало yes.gif

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Создайте аккаунт или войдите для комментирования

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

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!


Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.


Войти сейчас
Войдите, чтобы подписаться  
Подписчики 0