March 5, 2015 in PSD to HTML

HTML5 Template

HTML5 Template to use when starting a new HTML page.

<!doctype html>
    <html lang="en">
        <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
 
        <title>Page Title</title>
        <meta name="description" content="">
 
        <link rel="icon" type="image/png" href="images/myicon.png">
 
        <link rel="stylesheet" href="css/main.css">
 
        <!-- HTML5 shim for IE (8 and below) support of HTML5 elements -->
        <!--[if lt IE 9]>
            <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
        <![endif]-->
    </head>
 
    <body>
        <!--[if lt IE 8]>
            <p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
        <![endif]-->

        <p>Hello world!</p>
 
        <!-- JavaScript -->
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
        <script>window.jQuery || document.write('<script src="js/vendor/jquery-1.11.2.min.js"></script>')</script>
        <script src="js/main.js"></script>

    </body>
</html>

About the author

Alok Jain

Alok designs digital experiences to help businesses achieve their goals. He is passionate about designing the right User Experience for their customers. For over 15 years, he has worked with small startups to mature product teams. Whether it is designing a WordPress product, a frontend experience, WooCommerce, or React.js, he follows the best product development practices for design and code, for desktop or mobile.

Leave a Reply

Your email address will not be published. Required fields are marked *