Desde esta página agruparemos parte de los artículos publicados en el blog para que la lectura pueda ayudar a los recien llegados al mucho del diseño web.
1. Introducción
- Primero pasos para crear una página web: yo pregunto, ¿porque quiero tener una web?, ¿por donde empizo?, ….
- Diseño web: usuarios, contenidos y experiencias:piensa en los visitantes de tu web cuando estás trabajando en ella, ¿que buscan en tu web? ¿volverán?, …
- Accesibilidad en la web: creamos web para todos, hay gente que puede tener problemas de vista, ellos tambien quieren ver nuestra web.
2. Empezar a escribir HTML
- Introducción al leguaje HTML: crearemos laprimera página, un sencillo ejemplo para explicar que es HTML.
- Elementos y etiquetas HTML: conocer el funcionamiento del HMTL es muy importante, no se trata de memorizar todas las etiquetas, sino de conocer como funcionan y la importancia que pueden llegar a tener.
- Formatos básicos para textos: párrafos y encabezados.
- Color, tamaño y tipo de letra: modificamos el color, tamaño y tipo de fuente que necesitemos, pero siempre teniendo en cuenta que no todas las combianciones son buenas.
- Ejemplo: veremos un ejemplo de lo aprendido hasta aquí.
- Los colores en HTML: conocer como funcionan los colores en HTML es muy importante para saber hasta donde podemos llegar con los diseños.
- Los colores en la web: un poquito mas de información sobre los colores, psicología del color.
- Listas en HTML: podmeos crear listas ordenadas, listas desordenadas, …, anidar listas en html.
- ¿Que son los enlaces o links en una página web?.
- El arte de enlazar.
- Los encabezados en HTML: volvemos para ver la importancia que tienen los encabezados y cuales son los motivos que nos llevarán a utilizarlos.
- Tablas en HMTL: actualmente se utilizan menos que hace unos años, pero siguen siendo muy útiles en algunos casos.
- Ejemplos con tablas
- Definición de un documento HTML, DTD: DOCTYPE
- ¿Qué es Unicode UTF-8?
- Comprueba que has aprendido completando el test
3. Hojas de estilo, CSS
- ¿Que es CSS?.
- Fundamento básico de CSS.
- Cómo incluir hojas de estilo en una página web.
- Optimizar hojas de estilo
- Resetear hojas de estilo
- Chuleta CSS: descarga los ficheros en pdf de las chuletas más interesantes de CSS.
- Errores más comunes al utilizar CSS.
- Limpiar floats
- Bordes con CSS
- Ejemplos con div: para prácticar
- Centrar un div Horizontalmente con Dreamweaver: video tutorial
- Centrar vertical y horizontalmente un div con Dreamweaver.
- Efecto cebrado en tablas y listas
- Textos con sombras, contornos…
- Notas Adhesivas con CSS3
- Como crear un limón con CSS
- Crear formas geométricas con CSS. Primera Parte
- Menús con CSS y listas: vertical, horizontal
- Framework 960 Grid System
- Framework 978 Grid System: utilizado en este blog
- Degradados lineales con CSS. Gradiente Lineales con CSS3
- Comprueba tus conocimientos de CSS y Dreamweaver
- Comprueba tus conocimientos de CSS
4. Diseño web
- Ayudas para el diseñador web: veremos que herramientas son útiles para el diseño de nuestra web.
- Navegadores web: cuando creamos una web, tenemos que crear para práticamente todos los navegadores, instala los principales navegadores en tu ordenador y visualiza la web con cada uno de ellos. Tienes que conseguir que tu web sea compatible con todos los navegadores.
- Consejos para crear un sitio web creible
- Profundidad de color: desde un pixel al color verdadero.
- Landing-page: que son las Landing-page
- Ejemplos de landing-page: ejemplo 1, ejemplo 2
5. Ejemplos prácticos
- Enviar un email con php: enviaremos un email desde un formalario
- Creando una web paso a paso con CSS: primera parte
- Creando una web paso a paso con CSS: segunda parte
- Creando una web paso a paso con CSS: tercera parte
- Creando una web paso a paso con CSS: cuarta parte
- Creando una web paso a paso con CSS: quinta y última parte
- Ejemplo, www.tucartadigital.com
- Tablero de ajedrez en HTML con tablas
- Notas Adhesivas con CSS3
- Cómo crear un limón con CSS
- Landing-page: Tu Carta Digital, versión 1, versión 2
- Landing-page: Promoción tienda ONO
- Curriculum Vitae
- Diseño al estilo Pinterest con CSS
- Ejemplo web con CMS WP: www.ledneonflex.es
6. Promoción y Posicionamiento web, SEO, SEM, Redes Sociales, …
Aquí realmente no es necesario seguir el orden que indico, puedes leer como quieras, se trata de artículos independientes pero muy recomendable leer todos ellos.
- Landing page
- Herramientos SEO hechas por Google
- Guía SEO de Google para principiantes
- Herramientas del webmaster
- Google Analytics
- Bing: … porque hay vida más allá de google
- Robotx.txt: cuando no quiereo que indexen
7. WordPress
El mundo del blog nos invade, todos sabemos que es un blog y los utlizamos a diario cuando navegamos. Vermemos como instalar y configurar WordPress, uno de los CMS de blog más utilizados.
- Introducción a WordPress
- XAMPP: instalación
- Configuración XAMPP
- Instalación local de WordPress: veremos como instalar wordpress en tu ordenador. En este punto ya hemos instalado un servidor web con todo los necesario, XAMPP
- Vinculación de WordPress y Dreamweaver CS5
- La famosa instalación en 5 minutos. Instalación de WordPress en tu servidor, en tu hosting
- Tipos de usuarios en Wordpres, Rol usuarios en WordPress: suscriptor, colaborador, autor, editor, administrador.
- Personalizando la administración de WordPress: Pantalla de Login
- Personalizando la administración de WordPress: Escritorio