Верстку WEB станиц HTML+CSS - Webmasters.ru - RSS http://webmasters.ru/forum/showthread.php?t=64463 SEO форум вебмастеров - Поисковые системы, оптимизация, раскрутка сайта, оптимизация и продвижение сайта в поисковых системах 1743912462 Elesite CMS 60 http://webmasters.ru/forum/images/wm/misc/rss.png SEO форум вебмастеров Webmasters.ru http://webmasters.ru/forum Верстку WEB станиц HTML+CSS by aveugle http://webmasters.ru/forum/showpost.php?p=662854 Fri, 06 Feb 2015 15:54:02 GMT . Предлагаю услуги верстки. Вот пример верстки табличками. Можно потянуть за уголки формочек с красными рамками и посмотреть, как оно реагирует на переполнение. http://np2.com.ua/mo/screen.jpg Ссылка на страничку: http://np2.com.ua/mo/example.html Если нужно сделать так, чтобы страница всегда растягивалась на 100% по ширине, это делается изменением одного параметра в CSS. Сверстано на: HTML 4.01 и на CSS 3. Проверено на: 1. Chrome 39 2. Safari 5.0 3. Explorer 11 4. FireFox 32.0.3 5. Opera 26 HTML проверен на w3c.org - валидный ( http://goo.gl/bJz3iA ) . http://np2.com.ua/mo/validation.jpg Верстку WEB станиц HTML+CSS by lindroos http://webmasters.ru/forum/showpost.php?p=662866 Fri, 06 Feb 2015 17:05:22 GMT Вот пример верстки табличками. Сверстано на: HTML 4.01 я не верстальщик, но походу это щас не в тренде Верстку WEB станиц HTML+CSS by aveugle http://webmasters.ru/forum/showpost.php?p=662888 Fri, 06 Feb 2015 18:45:38 GMT Спор о методе верстки: табличками или дивчиками это как спор о том, с какого боку яйцо бить: с тупого или острого. Клиенту все равно, как там оно сверстано. HTML текст у меня лаконичный, и ни на какую скорость загрузки выбор метода верстки не повлияет. Более того, тот дизайн, что я выбрал для примера, очень трудно сверстать дивами с сохранением структуры страницы при растягивании. Я даже видел умников, которые делают дивчики с display в значении table-cell, зато типа на дивах. )))) Вот кусок кода этого форума: 16847 (Если посмотреть таблицы стилей, то увидим: "div.tablecell{display:table-cell;", то что я и говорил.) Спрашивается, зачем самих себя обманывать? Чтобы "в тренде" быть? :mocking: Про HTML 4.01: он сейчас актуален. Разница только в том, что можно не ставить некоторые закрывающие теги (это разрешает спецификация) и получается красивше текст. Если все закрыть, и поставить в конце неконтейнеров "/>", то будет валидный HTML5. Дело в том, что пятерка базиуруется на философии xml и там все теги должны иметь закрывающих собратьев. А четвертка на sgml и там таких строгих требований нет. Я специально не стремился к популизму, ищу хорошего умного заказчика, который все это понимает. Но скоро выброшу пример верстки и на дивах (причем, настоящих дивах, без обмана) , ибо есть дизайны, которые требуют именно такого стиля. ", то будет валидный HTML5. Дело в том, что пятерка базиуруется на философии xml и там все теги должны иметь закрывающих собратьев. А четвертка на sgml и там таких строгих требований нет. Я специально не стремился к популизму, ищу хорошего умного заказчика, который все это понимает. Но скоро выброшу пример верстки и на дивах (причем, настоящих дивах, без обмана) , ибо есть дизайны, которые требуют именно такого стиля.]]> Верстку WEB станиц HTML+CSS by Qurai http://webmasters.ru/forum/showpost.php?p=662993 Sat, 07 Feb 2015 07:33:57 GMT Если нужно сделать так, чтобы страница всегда растягивалась на 100% по ширине, это делается изменением одного параметра в CSS. А сколько нужно изменить параметров чтобы при расширении текстареа в шапке расширялся блок с контентом, а не с сайдбаром? Только не говорите что из за табличной верстки придется переписать всю структуру. И да, 2015 год (https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fnp2.com.ua%2Fmo%2Fexample.html) Верстку WEB станиц HTML+CSS by DOleg http://webmasters.ru/forum/showpost.php?p=663005 Sat, 07 Feb 2015 08:40:38 GMT Вот кусок кода этого форума Вы не сравнивайте код форума, которому не один год, с вашим кодом, которому пару дней. Про HTML 4.01: он сейчас актуален. Актуален сейчас HTML5, а вот 4-ый просто рабочий, но не актуальный. Спор о методе верстки: табличками или дивчиками это как спор о том, с какого боку яйцо бить: с тупого или острого. Клиенту все равно, как там оно сверстано. Как это клиенту всё-равно? Зачем потом перевёрстывать то, что можно сделать сразу? Таблицы нужны тогда, когда необходимо вывести таблицу, но не как не верстать сайт таблицами. Вы с таблицами и в Ворде работаете или Эксель используете? Но скоро выброшу пример верстки и на дивах (причем, настоящих дивах, без обмана) , ибо есть дизайны, которые требуют именно такого стиля. Тут даже сказать нечего :) Если вы не подстроитесь под реалии, то у вас не будет не только платных заказов, но и за бесплатной вёрсткой к вам обращаться не будут. дивчики Забудьте о таком слове и как оно пишется. :) Верстку WEB станиц HTML+CSS by aveugle http://webmasters.ru/forum/showpost.php?p=663118 Sat, 07 Feb 2015 23:19:59 GMT Актуален сейчас HTML5, а вот 4-ый просто рабочий, но не актуальный. Вы плохо понимаете слово актуальность. Забудьте о таком слове и как оно пишется. :) Чем меньше в вашей речи будет повелительного наклонения, особенно когда обращаетесь к незнакомому человеку, тем менее глупо будете выглядеть. Не стройте из себя великого специалиста. Тут даже сказать нечего :) Если вы не подстроитесь под реалии, то у вас не будет не только платных заказов, но и за бесплатной вёрсткой к вам обращаться не будут. У меня более 30 полоценных сайтов в портфолио, сделанных только когда уже работал самостоятельно. (Не по найму. То есть договоры были заключены со мной.) Все сайты отлично отображаются актуальными браузерами и клиентам все равно, на чем они сверстаны. Как это клиенту всё-равно? Зачем потом перевёрстывать то, что можно сделать сразу? Таблицы нужны тогда, когда необходимо вывести таблицу, но не как не верстать сайт таблицами. Вы с таблицами и в Ворде работаете или Эксель используете? Ему никогда не нужно будет ничего переделывать, этот код будет валиден и корректно отображаться еще десятки лет. Попробуйте сверстать этот дизайн дивами при условии такой же податливости к переполнению. Я готов спорить, что у вас не получится, если только вы не будете менять свойство display. Попробуйте не быть голословным. Я сделал пример. И я отвечаю за свои слова реальной работой. (Не нужно только рассказывать, что серьезные люди не ведутся "на слабо". Серьезные люди еще не ведут себя так по-детски заносчиво. ) Пока же вы в моих глазах самоуверенный герой Свифта, который с характерной только для молодежи безапелляционностью защищает "единственно верный" способ быть яйцо. И вообще, я сюда пришел не с детьми спорить. А искать заказчиков. Мне интересны новые заказы, хорошая совместная работа, а не холивары с подростками (во всяком случае по стилю поведения). Давайте еще поспорим, какой язык программирования лучше, или операционная система. ---------- Сообщение добавлено 03:19 ---------- Предыдущее 03:11 ---------- Кстати, если кому интересно, я могу взяться за работу по символической цене (заплатите, если понравится), связанную с версткой. Но только если дизайн будет интересен, чтобы на нем можно было продемонстрировать умения. Мне интересно сейчас показать блочную верстку. Верстку WEB станиц HTML+CSS by aveugle http://webmasters.ru/forum/showpost.php?p=663145 Sun, 08 Feb 2015 07:20:32 GMT А сколько нужно изменить параметров чтобы при расширении текстареа в шапке расширялся блок с контентом, а не с сайдбаром? Только не говорите что из за табличной верстки придется переписать всю структуру. Ну конечно, не придется. Для того чтобы сделать независимыми ширину блока меню в шапке и правого сайдбара, достаточно будет после 34 строки кода добавить: "" http://np2.com.ua/mo/example2.html По-поводу 2015 года: я так и не услышал ни одного рационального аргумента, требующего обязательного отказа от таблиц при верстке. Обычно это выглядит так: "что вы! кто сейчас так делает?!" и т.п. Не зря я вспомнил Свифта с его партиями тупо- и остро-конечников. А вы знаете какие холивары идут по-поводу фотоаппаратов Canon или Nikon? :crazy: Да я и спорить не буду, с удовольствием сверстаю на дивах, если хочет заказчик. Просто по мне так есть задачи, которые удобно решать одним инструментом и есть, которые - другим. Их можно сочетать по мере надобности. Этот дизайн просит таблички, как мне кажется. Кстати, дивами вы бы не смогли привязать ширины этих элементов друг к другу. То ест обратно, как на дивах я смог сделать с помощью таблиц, а вот с дивами получить, как с таблицами, нельзя. :pardon: (Если, конечно, не менять свойства display. Но это по-моему уже какой-то самообман. Зачем делать div с display:table-cell; если можно просто написать td?) Спасибо за то, что посмотрели пример. " http://np2.com.ua/mo/example2.html По-поводу 2015 года: я так и не услышал ни одного рационального аргумента, требующего обязательного отказа от таблиц при верстке. Обычно это выглядит так: "что вы! кто сейчас так делает?!" и т.п. Не зря я вспомнил Свифта с его партиями тупо- и остро-конечников. А вы знаете какие холивары идут по-поводу фотоаппаратов Canon или Nikon? :crazy: Да я и спорить не буду, с удовольствием сверстаю на дивах, если хочет заказчик. Просто по мне так есть задачи, которые удобно решать одним инструментом и есть, которые - другим. Их можно сочетать по мере надобности. Этот дизайн просит таблички, как мне кажется. Кстати, дивами вы бы не смогли привязать ширины этих элементов друг к другу. То ест обратно, как на дивах я смог сделать с помощью таблиц, а вот с дивами получить, как с таблицами, нельзя. :pardon: (Если, конечно, не менять свойства display. Но это по-моему уже какой-то самообман. Зачем делать div с display:table-cell; если можно просто написать td?) Спасибо за то, что посмотрели пример.]]> Верстку WEB станиц HTML+CSS by ArhStrAngeR http://webmasters.ru/forum/showpost.php?p=663148 Sun, 08 Feb 2015 07:37:03 GMT aveugle, Про div: у большинства элементов, не только div'ov есть значение width, которое может принимать не только значение в пикселях, но и в % отношении. Более того, можно сделать один блок фиксированного значения, например 300px, а остальной блок в 100% - 300px. Весьма полезное свойство, прочитайте про него. П.С. и теги input лучше оформлять в form (хотя бы для формы авторизации). Потому что конечному заказчику придется это потом самому делать. П.П.С. для изображений нужно указывать alt и title хотя бы с произвольными значениями, а не просто написать что у них есть alt title П.П.П.С. "Второй >>", "Малой >>", "В тот час >>" должны быть ссылкой а не текстом, чтобы можно было открыть полную новость. Это первые недочеты которые углядел >", "Малой >>", "В тот час >>" должны быть ссылкой а не текстом, чтобы можно было открыть полную новость. Это первые недочеты которые углядел]]> Верстку WEB станиц HTML+CSS by aveugle http://webmasters.ru/forum/showpost.php?p=663152 Sun, 08 Feb 2015 07:52:54 GMT ArhStrAngeR, Спасибо большое, что посмотрели мой пример. Про form и ссылки я, конечно, знаю. Это просто пример. Если бы я продавал шаблон, там бы это было все. По-поводу значений ширины в процентах. Спасибо, это очень интересно, но если бы вы посмотрели на мой CSS, то увидели бы, что там этот способ задания ширины используется. По-поводу значений title - документ валиден. Никакие произвольные значения title на элементы оформления писать не нужно. Зачем заполнять документ мусором? Это может быть полезно только для картинок, имеющих содержательную ценность, чтобы упростить работу поисковикам. Хотите я вам пришлю книжку, сам написал по результатам своего некоторого опыта верстки html? (Я потратил несколько лет на это занятие и решил ссистематизировать свои знания. ) Почитаете, покритикуете. Узнаете, что я думаю про width. Мы можем поговорить с вами о свойстве table-layout и интересных реакциях на разные его значения при переполнении и т.п. У меня там есть целый параграф, посвященный переполнениям и реакциям на них разных элементов. Верстку WEB станиц HTML+CSS by ArhStrAngeR http://webmasters.ru/forum/showpost.php?p=663161 Sun, 08 Feb 2015 08:52:31 GMT Хотите я вам пришлю книжку, сам написал по результатам своего некоторого опыта верстки html? (Я потратил несколько лет на это занятие и решил ссистематизировать свои знания. ) Почитаете, покритикуете. Узнаете, что я думаю про width. Мы можем поговорить с вами о свойстве table-layout и интересных реакциях на разные его значения при переполнении и т.п. У меня там есть целый параграф, посвященный переполнениям и реакциям на них разных элементов. Спасибо, но не нужно. Знания, которыми я обладаю позволяют решить 99% проблем, оставшийся процент подсказывает гугл. Возвращаясь к теме - укажите цену за работу(это все-таки есть в правилах форума, увы). Верстку WEB станиц HTML+CSS by Coder http://webmasters.ru/forum/showpost.php?p=663164 Sun, 08 Feb 2015 09:10:23 GMT aveugle, присоединяюсь и поддерживаю ваше мнение по поводу таблиц и дивов - кто в теме (то есть, занимается версткой), то знает, насколько все это действительно похоже на споры о тупом и остром конце яйца. Кроме того, современные браузеры уже не дожидаются полной загрузки таблицы для отображения, потому граница споров все больше стирается. Всех приглашаю вспомнить о "бритве Оккама" - архитекторы баз особенно поймут) - "не плодите лишних сущностей" - а в применении к верстке - не делайте то, что можно сделать проще, сложными способами. Не спорю ни с кем и в полемику включаться не буду - это сугубо мое мнение, которое и высказываю. С уважением ко всем. Верстку WEB станиц HTML+CSS by monstro404 http://webmasters.ru/forum/showpost.php?p=663166 Sun, 08 Feb 2015 09:21:59 GMT Я считаю верстать табличками это моветон, на дворе 2015 год. К тому же даже на фрилансе некоторые заказчики требуют дивную верстку. Таблицей должна быть представлена только табличная информация. Верстку WEB станиц HTML+CSS by Qurai http://webmasters.ru/forum/showpost.php?p=663187 Sun, 08 Feb 2015 12:37:23 GMT Зачем делать div с display:table-cell; если можно просто написать td?) Потому что семантика - списки в ul, параграфы в p, заголовки в h, курсив в em, таблицы в table. Блочные элементы в main, nav, article, header, footer, aside, section, div. И если настал тот случай, когда без свойств таблицы никак, то на сцену выходит display:table-cell. И это нормально - div это многофункциональный, универсальный кирпич, его нужно использовать по назначению. Табличная верстка была нужна 15 лет назад, до появления ксс2. Она неуклюжа, несемантична, неадаптивна, захламляет код, а ее простота это аргумент для учительниц информатики, но никак не для фронт-эндера. Верстку WEB станиц HTML+CSS by aveugle http://webmasters.ru/forum/showpost.php?p=663431 Mon, 09 Feb 2015 17:33:54 GMT озвращаясь к теме - укажите цену за работу(это все-таки есть в правилах форума, увы). Да не вопрос, путь это будет $50 за сверстанный по эскизу (photoshop с разделенными слоями) html. Если нужно, могу сверстать XSL шаблон. (Это дороже.) ---------- Сообщение добавлено 21:32 ---------- Предыдущее 21:17 ---------- И это нормально - div это многофункциональный, универсальный кирпич, Все верно, это группирующий элемент. http://www.w3.org/TR/html401/struct/global.html#h-7.5.4 Вот что пишет про него w3c: "offer a generic mechanism for adding structure to documents." Но, посмею возразить, что если вы будете делать div с display: table, потом в него вложите div c table-row, а там уже table-cell, то вы потеряете с в семантике столько же, сколько при использовании соответствующих тегов. Более того, о каком семантическом анализе может идти речь, когда мы занимаемся оформлением шапочек, рамочек, полосочек. Что нам до семантического анализа этой части кода? Вот уже блок, в котором можно наблюдать содержательную часть страницы, стоит верстать с учетом будущего ее анализа роботом. С тегами вида: aside, figure, summary, details, footer,time,mark и т.п. ---------- Сообщение добавлено 21:33 ---------- Предыдущее 21:32 ---------- К тому же даже на фрилансе некоторые заказчики требуют дивную верстку. Ну если заказчики позволят менять dsplay, то не вопрос. :yes: