Как правильно сверстать

R:man

Постоялец
Заблокирован
Регистрация
26 Фев 2012
Сообщения
136
Реакции
94
  • Автор темы
  • Заблокирован
  • #1
Верстаю свой рисованный шаблон в Adobe Dreamweaver CS5, далее его будут встраивать в скрипт, интересует:
1. Для просмотра ссылки Войди или Зарегистрируйся (примерно такой же шаблон) нужно ли верстать верхний слайдер и форму поиска или оставить как картинку,если да то подскажите как.
2.Выпадающее горизонтальное меню лучше верстать с помощью js?
3.Как быть с кучей файлов css (их лучше соединить в один или оставить разделенными),чтоб не зависала главная страница.(я новичок в этом)
4.Может еще пару советов.
 
1. Слайдер очень похож на стандартный. Я думаю внедрить такой будет не проблема даже при полном незнании javascript.
Очень интересно, что ты имел в виду под "форму поиска оставить как картинку"? Она вполне себе верстается обычными тегами.
2. Выпадающее меню можно сверстать средствами CSS, при некоторых изысках, можно включить немного JS. Но обязательно, чтобы теги ссылок существовали на странице HTML прямыми <a href="/раздел/страница"> (то есть не формировались JSом) - иначе их не найдут и не проиндексируют поисковики.
3. Когда будешь вводить свой шаблон/сайт в production, можно все ccs и js собрать в два файла. Можно также минимизировать их. Для этого есть проверенная временем десктопная тулза Для просмотра ссылки Войди или Зарегистрируйся. И ее Для просмотра ссылки Войди или Зарегистрируйся вариант.
4. По формам и верстке посоветую посмотреть такую чтуку как Для просмотра ссылки Войди или Зарегистрируйся(специально для новичков), облегчает процесс верстки блоками, верстку форм, слайдеров и много всего другого. Просто находишь на страницах бутстрапа то, что тебе понравилось и копируешь код рядом с этим местом к себе на страничку. :)
 
  • Автор темы
  • Заблокирован
  • #3
1.То есть получается,что нужно верстать слайдер и подключать его к JS ? ,чтобы он переключался;так же как я понял и с формой поиска.Но вопрос зачем мне с этим париться,если потом я шаблон отдам автору скрипта, и он уже будет его внедрять в скрипт...или я чего то недопонимаю(может быть ему тогда придется доверстывать ?).
2.С менюшкой буду пытаться..
3.Про production не понял.Прошу прощения, но верстаю первый раз.
 
Production - это стадия проекта после внедрения его в работу. Соответственно, если будешь отдавать кому-то шаблон, то не заморачивайся с объединением и сжатием файлов.
Ну со слайдером погуглил, нашел самое похожее:
Для просмотра ссылки Войди или Зарегистрируйся
Кроме того, здесь можно найти много других:
Для просмотра ссылки Войди или Зарегистрируйся


Чтобы работал тот слайдер, на который дал ссылку нужно:
1) подключить jQuery
Код:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></src>
2) подключить слайдер
Код:
 <script src="http://bxslider.com/sites/default/files/jquery.bxSlider.min.js" type="text/javascript"></script>
3) HTML-код элементов слайдера
Код:
<div id="slider1">
  <div>Slide one content</div>
  <div>Slide two content</div>
  <div>Slide three content</div>
  <div>And so on...</div>
</div>
4) Скрипт для включения слайдера
Код:
<script type="text/javascript">
$(function(){
  $('#slider1').bxSlider({
    displaySlideQty: 3,
    moveSlideQty: 1
  });
});
</script>

Как видишь, все вроде просто как белый день. То есть, особо не нужно быть программистом, чтобы все внедрить в страничку.

С формами все также просто:
Уже с подключенным jQuery, скачиваешь и подключаешь bootstrap
Код:
<script src="/js/bootstrap.js"></script>
<link href="/css/bootstrap.css" rel="stylesheet">
<link href="/css/bootstrap-responsive.css" rel="stylesheet">

Далее HTML-код формы:
Код:
<form class="form-horizontal">
  <fieldset>
    <legend>Legend text</legend>
    <div class="control-group">
      <label class="control-label" for="input01">Text input</label>
      <div class="controls">
        <input type="text" class="input-xlarge" id="input01">
        <p class="help-block">Supporting help text</p>
      </div>
    </div>
  </fieldset>
</form>
Для просмотра ссылки Войди или Зарегистрируйся
Если ты только начинаешь, то тебе это надо научиться делать обязательно. HTML, JS, CSS приходят только с опытом, пока минимум пять раз не сделаешь - не получится.
 
Назад
Сверху