Que opinan de mi html5

hackjose · #1 (**permalink**) 27/07/2015, 13:07

Buenas tardes

Me podrian decir que opinan de mi HTML5

http://josevega.zz.mu/

Código HTML:

Ver original<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Curriculum Vitae Jose Vega</title>
    <link href='http://fonts.googleapis.com/css?family=Orbitron' rel='stylesheet' type='text/css' />
    <link rel="stylesheet" href="style.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script src="script.js"></script>
</head>
<body>
    <header>
        <h1 class="sitetitle">
            <span class="part1">CU</span><span class="part2">RR</span><span class="part3">IC</span><span class="part4">UL</span><span class="part5">UM</span><span class="part6"> V</span><span class="part7">IT</span><span class="part8">AE</span>
        </h1>
    </header>
    <main>
        <section class="personaldata">
            <div class="middle">
                <h1>
                    <span class="pd1">DA</span><span class="pd2">TO</span><span class="pd3">S </span><span class="pd4">PE</span><span class="pd5">RS</span><span class="pd6">ON</span><span class="pd7">AL</span><span class="pd8">ES</span>
                </h1>
 
                <p>
                    <span class="pd11">No</span><span class="pd10">mb</span><span class="pd9">re</span>
                </p>
 
                <p>
                    <span class="pd12">Jo</span><span class="pd13">se</span><span class="pd14"> d</span><span class="pd15">e </span><span class="pd16">Je</span><span class="pd17">su</span><span class="pd18">s </span><span class="pd19">Ve</span><span class="pd20">ga</span><span class="pd21"> H</span><span class="pd22">er</span><span class="pd23">na</span><span class="pd24">nd</span><span class="pd25">ez</span>
                </p>
 
                <p>
                    <span class="pd31">Fe</span><span class="pd32">cha </span><span class="pd31">de</span><span class="pd30"> N</span><span class="pd29">ac</span><span class="pd28">imie</span><span class="pd27">nt</span><span class="pd26">o</span>
                </p>
 
                <p>
                    <span class="pd30">3</span><span class="pd29">1 </span><span class="pd28">de</span><span class="pd27"> O</span><span class="pd26">ct</span><span class="pd25">ub</span><span class="pd24">re</span><span class="pd23"> d</span><span class="pd22">e </span><span class="pd21">19</span><span class="pd20">92</span>
                </p>
 
                <p>
                    <span class="pd11">Co</span><span class="pd12">rr</span><span class="pd13">eo</span><span class="pd14"> E</span><span class="pd15">le</span><span class="pd16">ct</span><span class="pd17">ro</span><span class="pd18">ni</span><span class="pd19">co</span>
                </p>
 
                <p>
                    <span class="pd10">k-</span><span class="pd9">jo</span><span class="pd8">se</span><span class="pd7">-k</span><span class="pd6">@h</span><span class="pd5">ot</span><span class="pd4">ma</span><span class="pd3">il</span><span class="pd2">.c</span><span class="pd1">om</span>
                </p>
            </div>
        </section>
        <section class="academic">
            <div class="middle">
                <h1>FORMACION ACADEMICA</h1>
                <p>Universidad Autonoma Metropolitana</p>
                <p>CARRERA</p>
                <p>LICENCIATURA EN MATEMATICAS</p>
                <p>AVANCE</p>
                <p>37%</p>
            </div>
        </section>
        <section class="experience">
            <div class="middle">
                <h1>EXPERIENCIA</h1>
                <div class="experienceone">
                    <div class="middle">
                        <p class="companyone">EMPRESA</p>
                        <p class="companynameone">AQUAINTERACTIVE</p>
                        <p class="companyurlone">www.aquainteractive.com.mx</p>
                        <p class="companypositionone">PUESTO</p>
                        <p class="companypositionnameone">PHP JR</p>
                        <p class="durationone">DURACION</p>
                        <p class="dateone">15/10/2012 - 03/01/2013</p>
                    </div>
                </div>
                <div class="experiencetwo">
                    <div class="middle">
                        <p class="companytwo">EMPRESA</p>
                        <p class="companynametwo">LIBRERIA LEO</p>
                        <p class="companyurltwo">www.laleo.com</p>
                        <p class="companypositiontwo">PUESTO</p>
                        <p class="companypositionnametwo">PHP Jr</p>
                        <p class="durationtwo">DURACION</p>
                        <p class="datetwo">24/02/2014 - 03/06/2014</p>
                    </div>
                </div>
            </div>
        </section>
        <section class="skills">
            <div class="middle">
                <h1>CONOCIMIENTOS</h1>
                <p>Nivel Medio</p>
                <p><span class="php">PHP</span><span class="js"> JavaScript</span><span class="css3"> CSS3</span><span class="html5"> HTML5</span><span class="jquery"> Jquery</span></p>
                <p>Nivel Basico</p>
                <p><span class="mysql">MySQL</span><span class="wp"> WordPress</span></p>
                <p></p>
            </div>
        </section>
        <div class="loading">
            <span class="loading-content">Cargando <span class="loading-number">0</span>%</span>
            <img id="galaxy" src="2012-03-23_NGC4886_in_Coma_Galaxy_Cluster.jpg" alt="" />
            <img id="earth" src="terra.png" alt="" />
            <img id="spaceship" src="herogeneric.gps-satellite-tracking.725x495.png" alt="" />
            <img id="astronaut" src="astronauta.png" alt="" />
            <img id="supernova" src="supernova.png" alt="">
        </div>
    </main>
</body>
</html>

En cuanto al elemento main pienso que esta bn utilizado

por una parte solo utilizo uno

No lo utilizo para areas principales de subsecciones

Su contenido es unico

Su contenido esta directamente relacionado con el tema principal(mi CV)

pzin · #2 (**permalink**) 27/07/2015, 13:48

Vaya, yo estaba seguro que se habían cargado main. Pero no.

La única objeción que yo le veo así por encima es lo de poner mayúsculas. Creo que de eso tendría que ocuparse CSS (text-transform: uppercase) ¿no?

Si no fuera porque eres tú te diría algo del diseño.

Rafael · #3 (**permalink**) 27/07/2015, 13:54

No pude leer casi nada.

Un efecto sin historia, no tiene sentido. Entendí que sabes mover objetos con el scroll, pero no tienen razón de ser o lugar a donde ir... Sólo se mueven.

hackjose · #4 (**permalink**) 27/07/2015, 15:19

Muchas gracias por sus comentarios me sirven para mejorar

pzin no entendi esto

Vaya, yo estaba seguro que se habían cargado main. Pero no.

Saludos

pzin · #5 (**permalink**) 27/07/2015, 15:24

Cita:

Iniciado por hackjose

pzin no entendi esto

Nada. Que me pareció que en su día lo habían sacado de la especificación (cuando era un borrador). Pero o bien eso nunca fue así o lo volvieron a meter.

LazyProgrammer · #6 (**permalink**) 29/07/2015, 11:42

Muy buenas,

Yo me quedé mirando la Tierra esperando una animación y clickando por todos los paises hasta que me dí cuenta que hay que desplazarse hacia abajo.

La idea está muy bien, es un curriculum del que te puedes acordar y no un papel más encima de la mesa. Lo que si que he visto es que las animaciones con el scroll son un poco bruscas, personalmente me gusta un movimiento más suavizado. El color del texto en contraste con el fondo negro no me resulta agradable a la lectura. Opiniones personales :)

Saludos!