Первый сайт на HTML5 для компьютерной лаборатории университета


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

Некоторые вещи я должен поделиться:

  • Это не очень хорошо работает в Internet Explorer 6 и мне плевать!
  • Он использует Реми html5shiv и условных стилей отображения:блокИнг Все элементы HTML5 для Internet Explorer версии 7/8 и Firefox 3.
  • Включенный JavaScript-файл, вероятно, появятся пустые глаза смотрели на него в современных браузерах. Я в курсе впустую запроса HTTP.
  • CSS-файл включает в себя @импорт (БГАРФ), что я не могу контролировать; это часть нашего университета требуется заголовка.

URL сайта: http://ulabs.illinoisstate.edu/

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="description" content="University Computer Labs at Illinois State University" />
<meta name="keywords" content="university labs ulabs u-labs illinois state computer" />
<title>University Labs - Illinois State University</title>
<link rel="stylesheet" href="/templates/style.1309283866.php" />
<link rel="shortcut icon" href="http://illinoisstate.edu/favicon.ico" />
<script src="/templates/js.1309283871.php"></script>
</head>
<body>
<div id="iguide-container">
    <a id="skip-iguide" href="#skipiguide" title="Skip the iGuide"></a>
    <script src="http://iguides.illinoisstate.edu/?red"></script>
    <noscript>
        <div id="iguide">
            <span id="iguide-isu"><a href="http://illinoisstate.edu"></a></span>
            <span id="iguide-admissions"><a href="http://admissions.illinoisstate.edu"></a></span>
            <span id="iguide-academics"><a href="http://illinoisstate.edu/home/academics"></a></span>
            <span id="iguide-events"><a href="http://events.illinoisstate.edu"></a></span>
            <span id="iguide-map"><a href="http://maps.illinoisstate.edu"></a></span>
            <span id="iguide-AtoZ"><a href="http://illinoisstate.edu/home/find"></a></span>
            <span id="iguide-access"><a href="http://illinoisstate.edu/home/accessibility"></a></span>
        </div>
    </noscript>
</div>
<a id="skipiguide"></a>
<div id="container">
    <header>
        <h1><a href="/"><span>University Labs</span></a></h1>
    </header>
    <nav>
        <a id="home" href="/" title="Home"></a>
        <a id="hd" href="http://helpdesk.illinoisstate.edu/" title="Help Desk"></a>
        <a id="emp" href="/employees/" title="Employees"></a>
    </nav>
    <div id="contentarea">
        <section id="welcome">
            <header>
                <h2>What is uLabs?</h2>
            </header>
            <p>uLabs at Illinois State is comprised of six computer labs containing a total of over 400 seats around campus open to Illinois State University students. These labs are located in Milner Library, Schroeder Hall, Stevenson Hall, Vrooman Center, Watterson Towers, and Whitten Hall.</p>
            <p>Supported by <a href="http://ctsg.illinoisstate.edu/ciss/">Computer Infrastructure Support Services</a>, the labs are equipped with state-of-the-art computers and printers. Each computer lab is equipped with basic software, such as Microsoft Office. Some uLabs also have specialized software and equipment.</p>
            <p>For information on each uLab, including hours, location, equipment, and software available, visit the links below.</p>
        </section>
        <aside>
            <header>
                <h2><span>uPrint</span></h2>
            </header>
            <p>Each uLab, with the exception of Milner, is fitted with a uPrint station. Milner Library's uPrint station is located behind the General Reference Desk.</p>
            <p>With uPrint, you can print from any computer on campus, including your own computer in your residence hall! For more information on uPrint and how to use it, follow the links below.</p>
            <ul>
                <li><a href="http://helpdesk.illinoisstate.edu/kb/1134/">Overview of uPrint Mobile Printing</a></li>
                <li><a href="http://helpdesk.illinoisstate.edu/downloads/1028/">Download uPrint Client for Windows</a></li>
                <li><a href="http://helpdesk.illinoisstate.edu/downloads/1028/">Download uPrint Client for Mac OSX</a></li>
            </ul>
        </aside>
        <section id="locations">
            <header>
                <h3>uLab Locations</h3>
                <p>Click a location for more information</p>
            </header>
            <div id="buildings">
                <div id="mlb"><a href="/loc/milner/">Milner Library 213B</a></div>
                <div id="sch"><a href="/loc/schroeder/">Schroeder Hall 230</a></div>
                <div id="stv"><a href="/loc/stevenson/">Stevenson Hall 250</a></div>
                <div id="vro"><a href="/loc/vrooman/">Vrooman Center 4</a></div>
                <div id="wat"><a href="/loc/watterson/">Watterson Towers 110</a></div>
                <div id="wht"><a href="/loc/whitten/">Whitten Hall 6</a></div>
            </div>
        </section>
    </div>
    <footer>
        <section id="contact_methods">
            <p><a href="mailto:ulabs@illinoisstate.edu">ulabs@IllinoisState.edu</a></p>
            <p><a href="http://ctsg.illinoisstate.edu/ciss/">Computer Infrastructure Support</a><br/>Campus Box 3430<br/>Normal, IL 61790-3430<br/>Phone: (309) 438-8800</p>
        </section>
        <section id="legal_statements">
            <p>Copyright 2011 &#169; <a href="http://www.illinoisstate.edu/">Illinois State University</a> &bull; <a href="http://www.ilstu.edu/home/diversity/">An equal opportunity/affirmative action university encouraging diversity.</a> &bull; <a href="http://www.ilstu.edu/home/privacy/web_privacy_notice.pdf">Privacy Policy</a></p>
        </section>
        <section id="university_initiatives">
            <p><a href="http://illinoisstate.edu/"><img src="/templates/images/footerReggieGrey.png" width="40" height="46" alt="Illinois State University" /></a></p>
        </section>
    </footer>
</div>
<script src="http://analytics.illinoisstate.edu/"></script>
</body>
</html>


435
6
задан 7 июля 2011 в 06:07 Источник Поделиться
Комментарии
2 ответа

У меня есть только несколько маленьких точек:


  • Код CSS валидатор предупреждает о пропавших тип атрибута в таблице стилей ссылке. Я знаю, что это не действительно необходимо, но я хотел бы добавить она, тем не менее.

  • Некоторые люди говорят, что

  • Я хотел бы использовать больше ИД- ов. Некоторые из них излишне короткое, таких как высокой четкости, ЭМП и зданий.

4
ответ дан 8 июля 2011 в 12:07 Источник Поделиться

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

Это, как говорится, я обнаружил, что основная закономерность

<header>
<section>
<footer>

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

может быть лучше определил как
ы (конкретно
). Просто мысли.

Вы используете

    чтобы содержать службу поддержки одной, но
    чтобы содержать дом одной. Какой-либо причине вы ушли с
    для ИД="зданий"?

    Я также чувствую, что

    В целом - хорошая разметка.

    1
    ответ дан 11 июля 2011 в 06:07 Источник Поделиться