HTML5 нумерация страниц - PullRequest
Новая
       3

HTML5 нумерация страниц

0 голосов
/ 08 марта 2012

Я делал очень простую страницу блога, чтобы записать мой прогресс в изучении HTML5 и CSS3. Пока у меня есть 2 очень простых поста. То, что я хочу создать, - это ограничение в 10 постов на страницу, затем он создаст новую страницу с самым последним постом сверху, как некоторые блоги Tumblr, которые я видел. В нижней части страницы будут расположены кнопки «Старые сообщения» и «Новые сообщения», которые будут циклически возвращать или пересылать 10 сообщений в блоге. Каждый раз, когда я создаю новое сообщение, оно помещает 10-е сообщение на предыдущую страницу. Со временем я также создам Архив блогов, который будет сортировать мои сообщения по месяцам. Пользователь сможет просматривать все сообщения за месяц на 1 странице. Я очень плохо знаком с HTML5 и CSS3 и готов изучить javascript, php или что-то еще, что потребуется для этого. Любая помощь, даже ссылки будут оценены. Вот что у меня есть: 

<head>
    <meta charset="utf-8">
    <title>SmithSite:Blog</title>
    <link rel="stylesheet" type="text/css" href="mycss.css">
    <link href='http://fonts.googleapis.com/css?family=Share' rel='stylesheet' type='text/css'>
    <!–[if lte IE 9]>
    <script src=”http://html5shiv.googlecode.com/svn/trunk/html5.js”></script>
    <![endif]–>
</head>
<body>
  <header>
    <h1>SmithSite</h1>
  </header>
  <nav>
    <div id="menu">
    <ul id="menu">
      <li><a href="index.html" title="Home">Home</a></li>
      <li><a href="about.html" title="About">About</a></li>
      <li><a href="blog.html" title="Blog" class="active">Blog</a></li>
    </ul>
    </div>
  </nav>
    <article>
      <header><h2>Adventures in HTML5 (Mon Mar  5 23:02:05 EST 2012)</h2></header>
      <p>So far, I've learned a little bit about HTML5 and CSS3. I've been using emacs as my editor. It has some very strance, but efficient keyboard shortcuts. It takes a little while to get used to, but I'm sure I'll get the hang of it. So far, I've created 3 buttons as you'll notice above. Next time, I'll try working on how to get this blog to span over multiple pages, or try to work out how to archive it.</p>
    </article>
    <article>
      <header><h2>My First Entry (02.24.12)</h2></header>
    <p>This is the contents of the article element. I can't tell if this will extend past the end of the page or not, but I'll just keep on typing until I see the result. I guess this is my first blog entry. I'm messing around with a little HTML and some CSS. I hope I can make a kickass webpage soon. Hey look, it automatically sets borders based on the style tag above! HTML5 is so smart!</p>
    </article>
</body>

Ответы [ 2 ]

0 голосов
/ 08 марта 2012

Чистый HTML может делать то, что вы хотите, но вы будете делать много утомительных перемещений сообщений или генерировать html с помощью какого-то скрипта.

Движок блога - это то, что вы ищете здесь. Есть некоторые, которые генерируют кучу статических страниц из списка сообщений, или есть те, которые нуждаются в базе данных.

В первом случае вам нужно меньше беспокоиться о безопасности, поскольку все, что вы обслуживаете, - это статические страницы. Единственное, о чем вам нужно беспокоиться, это безопасность вашего основного веб-сервера.

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

Наиболее распространенным программным пакетом для ведения блога является, вероятно, Wordpress , который поддерживается базой данных, динамичен и написан на php. Многие из тем для этого, вероятно, html5 или имеют по крайней мере некоторые перспективные элементы. Я бы сказал, начать там и посмотреть, куда это приведет.

0 голосов
/ 08 марта 2012

Вот хороший пример разбиения на страницы в Javascript с использованием jQuery здесь:

Плагин jQuery Pagination

...