Plantilla de página HTML en blanco. Tema de WordPress en blanco: plantillas limpias para el desarrollo. Snow: plantilla de página de destino gratuita que utiliza HTML5 y CSS3

Traducción: Vlad Merzhevich

Sin entrar en una discusión sobre por qué HTML5 está disponible hoy y no en 2022, este artículo le brindará un conjunto de plantillas HTML5 que puede usar en sus proyectos ahora mismo.

HTML5 en 5 segundos

Es fácil obtener un marcado definido como HTML5; simplemente cambie su DOCTYPE del existente a este:

¡Eso es todo! No se requiere nada más.

Google ya lo ha hecho. Echa un vistazo a su página de inicio, donde todo está escrito en una sola línea:

HTML5 - Búsqueda de Google...

Lo curioso es que la propia página de Google y los resultados de la búsqueda no pasan la validación porque contiene una serie de errores, pero esto es normal. Todavía se benefician (por ejemplo, no hay ningún atributo de tipo en el elemento) debido al DOCTYPE correcto.

Minificación HTML5

Si le gustan los prototipos o experimentos rápidos que no requieren escribir código largo, entonces puede que le interese este documento HTML5 en miniatura:

Pequeño HTML5

Hola Mundo

Hubo cierta controversia con respecto a la validación de esta plantilla al eliminar el archivo . El navegador DOM de Hixie dice que todo está bien, al igual que el validador W3C, cuando ingresa el marcado manualmente. Pero el validador de Henri Sivonen informa un error sin el archivo . El validador del W3C también informa un error al especificar una URL. Espero que esto se solucione pronto.

Nota carril Lo descubrimos. Ahora un elemento requerido.

HTML5 completo y compatible

El último patrón, el más completo, también especifica la codificación del texto. Sin esto, algunos caracteres no se mostrarán correctamente (¡pasé demasiado tiempo tratando de descubrir por qué!).

Finalmente, agregaremos algunas reglas CSS para garantizar que los nuevos elementos del bloque se muestren correctamente, ya que algunos navegadores no los conocen inicialmente.

Aquí está: una plantilla de documento HTML5 válida y completa.

Artículo HTML5, aparte, detalles, figcaption, figura, pie de página, encabezado, hgroup, menú, navegación, sección (display: block;)

Hola Mundo

Si desea experimentar con HTML5, JS Bin proporciona una plantilla HTML5 predeterminada para jugar.

En el mundo moderno, a veces tener tu propio sitio web es tan importante como, por ejemplo, tener un número de teléfono o una dirección de correo electrónico. Desafortunadamente, no todo el mundo puede crear un bonito sitio web profesional por sí solo y, a veces, ni siquiera funciona. Realizar pedidos a programadores tampoco es una solución ideal, ya que no todo el mundo puede permitírselo.

Las plantillas de sitios web HTML gratuitas le ayudarán a salir de esta situación. Una plantilla de sitio web HTML es un conjunto de páginas estáticas listas para usar para un sitio web sobre un tema específico. Con esta plantilla, puede crear un sitio web sencillo en sólo un par de horas, siempre que tenga conocimientos básicos de marcado HTML. En la sección HTML, obtendrás este conocimiento si dedicas un par de horas más a estudiar, y si te tomas el tiempo para estudiar la sección CSS, podrás controlar completamente el diseño de las plantillas de sitios web HTML y personalizarlas completamente para adaptarlas. tus necesidades.

Otra ventaja innegable de las plantillas de sitios web es que en la mayoría de los casos están escritas por profesionales. Una plantilla de sitio web profesional significa no sólo un diseño hermoso y moderno, sino también la forma en que está escrito el código. Los motores de búsqueda miran cómo está escrito tu sitio web, si el código está optimizado para SEO o no, y en base a esto bajan o aumentan tu posición en los resultados de búsqueda. Por lo tanto, un buen sitio web no sólo debe ser bonito y moderno, lo cual es importante, sino también estar escrito correctamente en términos de código.

Descargue plantillas de sitios web HTML gratuitas y cree sus proyectos en poco tiempo.

La mayoría de los buenos programadores hacen su trabajo no porque esperen pago o reconocimiento, sino porque disfrutan programando.

El trabajo de los programadores debe evaluarse no por su ingenio y lógica, sino por la integridad del análisis de cada situación.

Es fácil manejar el error: intente arreglar el programa. Un lanzamiento exitoso también es fácil de manejar: resolviste el problema equivocado. Intente corregir este error también.

Escribe siempre código como si estuviera acompañado por un psicópata violento que sabe dónde vives.

El primer mandamiento de un programador: si no sabes qué hacer, haz algo.

La charla no cuesta nada. Muéstrame el código.

Creamos Yandex con la simple intención de mostrar nuestras tecnologías revolucionarias.

Un ingeniero, como un médico, se comunica con el cuerpo, un programador, como un sacerdote, se comunica con el alma de la computadora y un administrador de sistemas, como una enfermera, mantiene un estado estable.

Los tontos ignoran la complejidad. Los pragmáticos lo toleran. Algunos pueden evitarlo. Los genios lo eliminan.

Si ahuyentas una mosca del monitor con un oso, entonces es hora de que te vayas a casa.

Un programador inteligente siempre puede mantener una computadora ocupada con un mal trabajo.

La programación no es una profesión. Es una forma de pensar.

Mi tierra natal es donde está mi computadora.

Cada programa es parte de otro programa y rara vez se corresponde con él.

Los webmasters no deberían construir sus vidas en torno al tráfico de Yandex. No debería ser una cuestión de vida o muerte para el sitio.

La gente cree que la programación es la ciencia de la élite, pero en realidad es al revés: muchas personas crean programas que utilizan los programas de otras personas, como si estuvieran construyendo un muro con pequeños ladrillos.

Piense en cuánta energía mental se gasta buscando la diferencia fundamental entre un "algoritmo" y un "programa".

La programación estructurada confirma la ley del tercero excluido.

Hay dos formas de crear un diseño de programa. Una es hacerlo tan simple que obviamente no tenga defectos. Otra forma es hacerlo tan complejo que no tenga defectos obvios.

La computadora te permite resolver todos aquellos problemas que no existían antes de la llegada de la computadora.

No puedes aprender a programar con una calculadora manual, pero puedes olvidarte de la aritmética.

No tengas buenas ideas si no quieres ser responsable de ellas.

Infancia difícil... Juguetes de kilobytes.

Todo debe diseñarse de arriba hacia abajo, excepto los cimientos desde los que empezar.

HTML es genial, pero sospecho que has elegido este libro para aprender PHP.

Una vez que comprenda cómo escribir un programa, pida a otra persona que lo haga.

El peor virus siempre está frente a la computadora.

En un buen diseño, agregar algo cuesta menos que el objeto en sí.

Depurar código es dos veces más difícil que escribirlo. Entonces, si escribe código de la manera más inteligente posible, entonces, por definición, no es lo suficientemente inteligente como para depurarlo.

Si tus pensamientos no caben en tu cabeza, archívalos.

Si su procedimiento tiene 10 parámetros, probablemente falten algunos.

Es fácil hacer algo variable. El truco consiste en medir la duración de la persistencia.

Mi raza de perro favorita es @

Los programas sin errores se pueden escribir de dos formas, pero la tercera funciona.

PHP es un pequeño mal creado por novatos incompetentes, mientras que Perl es un mal grande e insidioso creado por profesionales hábiles pero retorcidos.

Si está creando una plantilla desde cero, entonces debe comenzar desde algo. Teniendo en cuenta que el estándar HTML5 está "ampliamente extendido por todo el país", en este artículo daré un ejemplo de una plantilla HTML5 en blanco.

El nuevo estándar se ha simplificado mucho y ahora la parte básica queda así:

...

Nuevas etiquetas HTML5

En HTML5 se han introducido varias etiquetas nuevas para la estructura del código: , , , , , que en algunos casos reemplazan a las habituales. Esto se hizo para que los robots de búsqueda puedan reconocer mejor el código de la página y separar el contenido principal de los elementos auxiliares.

Usando las nuevas etiquetas, una plantilla HTML5 en blanco podría verse así:

Título de la página Menú de navegación Barra lateral Barra lateral Contenido: el contenido principal de la página. Pie de página del sitio

Simplificando la redacción de DOCTYPE

Recordemos cómo era antes, en HTML4 la etiqueta DOCTYPE se veía así:

Ahora la grabación es mínima, probablemente no podría ser más sencillo:

Se han producido simplificaciones similares con otras etiquetas, por lo que la transición al estándar HTML5 simplifica enormemente la escritura.

Etiquetas opcionales en HTML5

El nuevo estándar supuso un gran alivio para los maquetadores. En particular, ya no es necesario el uso de los elementos HTML, HEAD y BODY para el marcado HTML5. Si no existen, el navegador todavía cree que existen. De hecho, lo único que se requiere en HTML5 es .

Interpretación del ruso como idioma principal de un documento HTML.

La etiqueta define el idioma del documento. Regularmente surgen debates en Internet sobre su ortografía correcta, en particular sobre la ortografía correcta de “ru-RU”. Me inclino a creer que "-RU" es redundante, ya que el idioma ruso no tiene dialectos ni ortografía como el inglés (británico y americano). El sufijo RU especifica dónde se habla ruso. Es decir, si en-US significa “inglés hablado en Estados Unidos”, entonces ru-RU significa “ruso hablado en Rusia”, lo cual es redundante.

Una plantilla limpia para el desarrollo de sitios web en WordPress es un tema en blanco con un diseño mínimo y una disposición básica de elementos. ¿Quién y por qué podría necesitar utilizar un tema de este tipo al crear un sitio web y dónde puedo encontrar una plantilla vacía?

Tema de WordPress en blanco para el desarrollo

Los diseñadores y desarrolladores web utilizan un tema limpio como base para crear un sitio web con elementos totalmente personalizables. Esta plantilla es un esqueleto con contenido mínimo, que generalmente incluye código para mostrar publicaciones, páginas de archivo y comentarios. En este caso, el estilo de diseño está completamente ausente o se presenta al mínimo.

¿Quién querría utilizar un tema de WordPress en blanco? Las plantillas totalmente diseñadas son fáciles de usar "tal cual". Si no es un desarrollador, sino un cliente, entonces es más fácil y económico comprar un tema premium con varios tipos de páginas, bloques temáticos y opciones de diseño de contenido.

Si sólo necesita un sitio web estándar, una plantilla premium lista para usar rara vez cuesta más de $60, mientras que el desarrollo desde cero puede costar varios cientos o miles.

Una plantilla de WordPress en blanco servirá como punto de partida para desarrollar su propio tema personalizado. Estos temas vienen con código PHP, CSS y HTML básico y archivos precargados. Usar una plantilla para tus propias necesidades te permitirá aprovechar todas las funciones al máximo, ya que un tema puro proporcionará:

• código limpio, sin formato y sin basura;
• personalización CSS individual sin estilos de diseño impuestos;
• falta de complejidad innecesaria en la gestión de elementos de la página.

Los temas en blanco de WordPress aceleran su flujo de trabajo al reducir la cantidad de código que necesita escribir. Tener una base esquelética significa que no tienes que repetir el mismo proceso cada vez que creas una nueva plantilla. El uso de un tema en blanco reduce la posibilidad de que olvide archivos o códigos importantes necesarios para que su sitio de WordPress funcione correctamente.

¿Dónde puedo descargar una plantilla en blanco para WordPress?

Puede encontrar un tema vacío para desarrollar un sitio web en WordPress en el catálogo del sitio web oficial (1). Escriba "en blanco" (2) en la barra de búsqueda, el repositorio contiene 2 plantillas vacías para crear un tema personalizado (3).

También se pueden encontrar temas limpios en los sitios de famosos desarrolladores de plantillas y complementos.

Por ejemplo, en: https://livecomposerplugin.com/downloads/blank-theme/. Algunos temas de WordPress en blanco vienen con funciones integradas útiles, como diseños responsivos o páginas de muestra, para ayudarlo a probar su sitio.

Con un tema limpio, puede crear una plantilla para un sitio web que contenga mucha información de texto, por ejemplo, varias bases de datos o directorios en línea. No se recomienda descargar temas vacíos de blogs de webmasters desconocidos, ya que se pueden agregar enlaces extraños a dicho código.