[HTML5] Minecraft Website Template [HTML5]

BR4DLEY

Web Developer
Jan 2, 2012
328
23
Okay, So I have been practising HTML5 for quite some time now and I am ready to release my first design.
Please note I only did 50% of the code, So yeah:p

Here this the link:


Top of the page:


Middle of the page:


Bottom of the page:



HTML code:
HTML:
<!DOCTYPE HTML>
<!--
    Minecraft Template by BR4DLEY (Do not remove this)
    https://devbest.com/members/br4dley.10966/ | BR4DLEY
    Please note I do not take all the credit
-->
<html>
    <head>
        <title>Minecraft Server Name</title>
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <meta name="description" content="A Minecraft Server" />
        <meta name="keywords" content="Minecraft,Server,Version,Write,Your,Keywords,Here" />
        <!--[if lte IE 8]><script src="css/ie/html5shiv.js"></script><![endif]-->
        <script src="js/jquery.min.js"></script>
        <script src="js/jquery.dropotron.min.js"></script>
        <script src="js/skel.min.js"></script>
        <script src="js/skel-layers.min.js"></script>
        <script src="js/init.js"></script>
        <noscript>
            <link rel="stylesheet" href="css/skel.css" />
            <link rel="stylesheet" href="css/style.css" />
            <link rel="stylesheet" href="css/style-desktop.css" />
        </noscript>
        <!--[if lte IE 8]><link rel="stylesheet" href="css/ie/v8.css" /><![endif]-->
    </head>
    <body class="homepage">

        <!-- Header -->
            <div id="header-wrapper">
                <div id="header">
                   
                    <!-- Logo -->
                        <h1><a href="index.html">Minecraft Server</a></h1>
                   
                    <!-- Nav -->
                        <nav id="nav">
                            <ul>
                                <li class="current"><a href="index.html">Home</a></li>
                                <li><a href="#l">Forums</a></li>
                                <li><a href="#l">Donate</a></li>
                                <li><a href="#l">Staff</a></li>
                            </ul>
                        </nav>

                    <!-- Banner -->
                        <section id="banner">
                            <header>
                                <h2>Welcome to Server.</h2>
                                <p>A responsive template by BR4DLEY of Devbest</p>
                            </header>
                        </section>

                    <!-- Intro -->
                        <section id="intro" class="container">
                            <div class="row">
                                <div class="4u">
                                    <section class="first">
                                        <i class="icon featured fa-cog"></i>
                                        <header>
                                            <h2>Fully Configured</h2>
                                        </header>
                                        <p>This server has fully configured plugins and are always up-to-date!</p>
                                    </section>
                                </div>
                                <div class="4u">
                                    <section class="middle">
                                        <i class="icon featured alt fa-flash"></i>
                                        <header>
                                            <h2>(Ram_Amount)GB Ram</h2>
                                        </header>
                                        <p>The server is Running on max ram so the server can hold unlimited slots!</p>
                                    </section>
                                </div>
                                <div class="4u">
                                    <section class="last">
                                        <i class="icon featured alt2 fa-star"></i>
                                        <header>
                                            <h2>Quality Support</h2>
                                        </header>
                                        <p>Our staff are always online so feel free to ask them questions whenever you feel the need!</p>
                                    </section>
                                </div>
                            </div>
                            <footer>
                                <ul class="actions">
                                    <li><a href="#" class="button big">Visit our Forums</a></li>
                                </ul>
                            </footer>
                        </section>
       
                </div>
            </div>

        <!-- Main -->
                           
                        </div>
                    </div>
                </div>
            </div>

        <!-- Footer -->
            <div id="footer-wrapper">
                <section id="footer" class="container">
                    <div class="row">
                        <div class="8u">
                            <section>
                                <header>
                        <div class="4u">
                            </section>
                        </div>
                    </div>
                    <div class="row">
                        <div class="4u">
                            <section>
                                <header>
                                    <h2>Links</h2>
                                </header>
                                <ul class="divided">
                                    <li><a href="#">Link 1</a></li>
                                    <li><a href="#">Link 2</a></li>
                                </ul>
                            </section>
                        </div>
                        <div class="4u">
                            <section>
                                <header>
                                    <h2>Other</h2>
                                </header>
                                <ul class="divided">
                                    <li><a href="#">Link 1</a></li>
                                    <li><a href="#">Link 2</a></li>
                                </ul>
                            </section>
                        </div>
                    </div>
                    <div class="row">
                        <div class="12u">
                       
                            <!-- Copyright -->
                                <div id="copyright">
                                    <ul class="links">
                                        <li>&copy; server.com. All rights reserved.</li><li>Edit by: <a href="https://devbest.com/members/br4dley.10966/">BR4DLEY</a></li>
                                    </ul>
                                </div>

                        </div>
                    </div>
                </section>
            </div>

    </body>
</html>


Feedback would be nice.
 

Wassim

♕ The Awesomeness Within...
Sep 22, 2011
2,450
936
Top of the page:


Middle of the page:


Bottom of the page:
Put the images on the page. Its annoying.
 

Jxck

got that old thing back
Apr 5, 2014
135
34
It's very basic, the only Minecraft themed part is the banner, which suggests this theme would be better offered as a generic template.

It's simple and clean though and I like that, however maybe a little too basic.

7/10 not a bad effort


Sent from my iPhone using Tapatalk
 

BR4DLEY

Web Developer
Jan 2, 2012
328
23
It's very basic, the only Minecraft themed part is the banner, which suggests this theme would be better offered as a generic template.

It's simple and clean though and I like that, however maybe a little too basic.

7/10 not a bad effort


Sent from my iPhone using Tapatalk
Thanks for the feedback.

Looks really good actually! Thanks
Thanks.
 

AssLikeThat

Posting Freak
Jan 27, 2013
765
154
It looks really nice:) I wouldn't have thought it would have been for Minecraft though other than seeing the banner :p
 

Wickd

The first member of the Knights of the Pink Table
Jan 15, 2013
1,936
612
Looks really basic maybe try using material design, it's really popular right now.Anyways thanks for the share man.
 

Users who are viewing this thread

Top