Jump to content
  • 0

Где совсем новичку брать шаблоны сайтов для анализа?

Serg55

Asked by Serg55,

 Share

Question

Serg55 Explorer

Serg55

Posted
Posted (edited)

Добрый день.

Где новичку брать макеты сайтов для их анализа?

Вроде бы HTML и CSS немного изучил, пару книжек прочёл, в основы погрузился. А что дальше?

Вот хотел бы анализировать чужие сайты. Но реальные, в интернете - чудовищно сложны с моим уровнем знаний, и притом, там же кроме HTML и CSS ещё и скрипты, которых я пока вообще не касался, и PHP.

Пробовал анализировать шаблоны с сайта http://ru.anvisionwebtemplates.com/ - тоже сложновато ещё. Реально сложно, громоздко, неудобно, непонятно.

А с другой стороны, шаблоны со странички http://htmlbook.ru/layout уже все проштудировал и полностью, как мне кажется, разобрал. А с http://ru.anvisionwebtemplates.com/ - ещё сложно.

Только не советуйте - пробуй писать сам. Я лентяй. Мне больше подойдёт метод вначале анализа чужого, а уж потом, по мере усиления интереса, написание своего.

Спасибо за внимание.

Edited by Serg55
Link to comment
Share on other sites

9 answers to this question

Recommended Posts

  • 0
Vlad Explorer

Vlad

Posted
Posted

Попробуйте поискать бесплатные шаблоны под какие-нибудь CMS. Они как правило типовые и несколько проще по сравнению с другими макетами. Поищите по ключевым словам "бесплатные шаблоны wordpress", "бесплатные шаблоны drupal". Только вам не тема нужна, а шаблон, а то там ещё PHP содержится. Хотя довольно сложно бывает отделить их.

Вот здесь ещё посмотрите, сплошные прямоугольники, на первый взгляд простые.

http://www.joomlaos.de/index.php?set_albumName=album03&option=com_gallery&Itemid=37&include=view_album.php

Link to comment
Share on other sites
  • 0
cyklop77 Explorer

cyklop77

Posted
Posted (edited)

Но реальные, в интернете - чудовищно сложны с моим уровнем знаний, и притом, там же кроме HTML и CSS ещё и скрипты, которых я пока вообще не касался, и PHP.

ну PHP там вряд ли тебе покажут :)

Edited by cyklop77
Link to comment
Share on other sites
  • 0
Serg55 Explorer

Serg55

Posted
  • Author
Posted

Serg55,

А тут для себя макетов не находишь - http://forum.htmlbook.ru/index.php?showforum=31

Вроде есть достаточно простые.

А что такое макет? В тутошнем понимании. Мне нужен HTML-код несложной веб-странички для анализа.

А в том разделе, куда Вы указываете, там же какие-то рисунки, скриншоты сайтов. Так там же кода нет.

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

Link to comment
Share on other sites
  • 0
Non Stop Explorer

Non Stop

Posted
Posted

Макет это просто изображение. Чаще всего макеты идут в формате psd(открывается с помощью photoshop), где весь макет разбивается на слои. И если вы ищете макеты, то на это и наткнетесь.

А шаблон это уже готовая html страница(набор страниц) со стилями и рисунками. Ищите шаблоны, если хотите порыться в коде.

Link to comment
Share on other sites
  • 0
manhunt Explorer

manhunt

Posted
Posted (edited)

Я сам начинающий.После прочтения пары книг взялся за практику и сверстал макет вот из этой темы http://forum.htmlbook.ru/index.php?showtopic=16763 плюс там ещё есть пример верстки этого макета от psywalkerа можно изредка заглядывать. Мне кажется это будет более полезным, чем смотреть на код в чужих шаблонах!!

Edited by manhunt
Link to comment
Share on other sites
  • 0
Non Stop Explorer

Non Stop

Posted
Posted

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

Посоветую начать с верстки простых элементов своими силами :blush:

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to question listing

  • Обсуждения

    • Nikker
      Дизайн сайтов, landing page, логотипов, баннеров, шапок | Высокое качество, по хорошей цене

      By Nikker · Posted

      Актуальные контакты: Telegram: @Nikker_web E-Mail:   tarasevich.email@gmail.com Портфолио https://www.behance.net/d4d4186e Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ    
    • Nikker
      Брендовый дизайн в социальных сетях

      By Nikker · Posted

      Актуальные контакты: Telegram: @Nikker_web E-Mail:   tarasevich.email@gmail.com   Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ   Портфолио https://www.behance.net/d4d4186e
    • Mondeus
      Вёрстка футера на движке Xenforo

      By Mondeus · Posted

      Доброго всем времени суток. Прошу помощи. Научите принципу изменения футера. Движок Xenforo. Версия 2.2.10. Стиль дефолтный. Что именно нужно в итоге на фото примере. Мой шаблон app.footer less имеет следующее значение.  .p-footer { .xf-publicFooter(); a { .xf-publicFooterLink(); } } .p-footer-inner { .m-pageWidth(); .m-pageInset(); padding-top: @xf-paddingMedium; padding-bottom: @xf-paddingLarge; } .p-footer-row { .m-clearFix(); margin-bottom: -@xf-paddingLarge; } .p-footer-row-main { float: left; margin-bottom: @xf-paddingLarge; } .p-footer-row-opposite { float: right; margin-bottom: @xf-paddingLarge; } .p-footer-linkList { .m-listPlain(); .m-clearFix(); > li { float: left; margin-right: .5em; &:last-child { margin-right: 0; } a { padding: 2px 4px; border-radius: @xf-borderRadiusSmall; &:hover { text-decoration: none; background-color: fade(@xf-publicFooterLink--color, 10%); } } } } .p-footer-rssLink { > span { position: relative; top: -1px; display: inline-block; width: 1.44em; height: 1.44em; line-height: 1.44em; text-align: center; font-size: .8em; background-color: #4682B4; border-radius: 2px; } .fa-rss { color: white; } } .p-footer-copyright { margin-top: @xf-elementSpacer; text-align: center; font-size: @xf-fontSizeSmallest; } .p-footer-debug { margin-top: @xf-paddingLarge; text-align: right; font-size: @xf-fontSizeSmallest; .pairs > dt { color: inherit; } } @media (max-width: @xf-responsiveMedium) { .p-footer-row-main, .p-footer-row-opposite { float: none; } .p-footer-copyright { text-align: left; padding: 0 4px; // aligns with other links } }  
    • torsar
      Примеры верстки

      By torsar · Posted

      Нужны сайты с примерами верстки, типа https://css-tricks.com/. Типовые приемы и нестандартные на все случаи жизни. Накидайте ссылок.
    • Katerina23
      Какой тег использовать, чтобы увеличивать число кнопками вверх-вниз?

      By Katerina23 · Posted

      Да, подходит. Спасибо.
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept