Aledarbo

Este tutorial es para crear una web desde cero y con cero conocimientos acerca del tema. Si ya sabes un poco de esto no te hace falta leerlo. Esta web funcionaría con un gestor de contenidos (CMS) gratuito y de software libre que te permite subir contenidos fácilmente desde cualquier ordenador.Yo he elegido Wordpress porque es muy versátil y aunque en principio parece diseñado para blogs se puede convertir en una web con muchísimas funciones y sencilla de manejar. Si lo único que quieres es escribir un post de vez en cuando, quizás con una herramienta como blogger te sea suficiente. Pero, si quieres tener tu propia web con tu propio nombre y capacidad para modificarla libremente, entonces este tutorial te puede ayudar.El espacio en internet.Bien, dos términos con los que tienes que familiarizarte son los siguientes: hosting y dominio. El primero es el alojamiento en internet de tu web y lo segundo es el nombre por el que se accederá a ese espacio:- Hosting: Las webs están alojadas servidores (para explicarlo sencillo: ordenadores conectados permanentemente a la red), los espacios en esos servidores se alquilan para alojar contenidos. Eso es el hosting.- Dominio: Para que la gente pueda acceder cómodamente a esos espacios necesitamos un nombre, ese nombre será tu dominio (por ejemplo: www.taringa.net)Dónde, cómo y cuanto nos cuesta conseguir ambas cosasBueno, aquí hay miles de empresas de todo el mundo que ofrecen de todo y con miles de tarifas diferentes. Yo para este tutorial he elegido una empresa por tres razones:- Hablan español por lo tanto ante cualquier problema podrás consultar fácilmente (y os garantizo que a veces consultar algo sobre estos temas es difícil hasta el propio idioma)- Tienen un servicio de soporte bastante rápido, educado y eficiente. Hay veces que he tenido alguna duda y me han contestado en minutos.- Los precios son asequibles para los planes de hosting que ofrecen bases de datos (un servico imprescindible para trabajar con gestores de contenido)Esta empresa se llama Hostsuar (http://app.hostsuar.com/aff.php?aff=619)Esta es una opción que a mí me ha ido muy bien y por eso elijo para este tutorial. De cualquier forma, ya digo que hay miles de empresas. Sólo tenéis que ver que tengan bases de datos (mysql) y soporte en español. Dentro de eso, comparar precios. Cómo contratar hosting y dominio- Seleccionáis el plan INICIA (el más barato). Una cosa buena de este plan es que podéis hacer dos webs en el mismo plan, por lo que se podría pagar entre dos personas y salir así más barato.aquí están algunas de sus especificacionesY el precio (se paga anualmente). - Allí mismo puedes contratar también el dominio (nombre que le quieras poner a tu web) Tendrás que elegir alguno que no esté en uso y una extension (.com,.net,.eu,.es...) - Una vez pagado (se puede pagar en al banco mediante transferencia bancaria) te enviarán un correo con unas claves de acceso a tu espacio web, guarda bien ese correo o imprímelo, lo vas a necesitar.- (Este plan INICIA lleva en su panel de control un servicio que hace automáticamente todo lo que te voy a explicar a partir de ahora (se llama FANTASTICO), cosa que está genial… sólo con un par de clicks tendrás instalada tu web, pero tus posibilidades de aprender a manejarla estarán más limitadas.) FTPUna vez que tenemos hosting y dominio activos ya podemos familiarizarnos con una cuenta FTP.Esta cuanta la puedes usar para subir archivos y documentos a tu web, o si quieres como disco duro en internet.Para ello recomiendo un programa gratuito llamado FILEZILLA- FILEZILLA lo podéis descargar desde http://filezilla-project.org/- Una vez instalado deberéis crear la cuenta con los datos que os ha proporcionado el hosting (en el correo que os ha enviado viene un apartado que se llama cuenta FTP, ahí viene todo). Para ello, dentro de Filezilla vais a archivo/gestor de sitios(parte superior izquierda)… y allí pulsáis “nuevo sitio”- En la parte derecha de esta ventana que se abre es donde debéis rellenar los datos que os proporcionan en el correo: servidor (el nombre de vuestro dominio), puerto (21), protocolo y cifrado no hace falta tocarlo para este tutorial, modo de acesso (elegís normal), usuario (el que os proporciona el correo), contraseña (la que os proporciona el correo)…….. aceptáis y ya desde ahí podéis conectaros a vuestro hostingEn Filezilla, la ventana de abajo a la izquierda es tu ordenador, la ventana de la derecha es tu espacio hosting en internet. Todo lo que arrastres de izquierda a derecha subirá a tu hosting. Todo lo que arrastres de derecha a izquierda lo bajarás de tu hosting a tu PCSi no ves alguna de estas ventanas pulsa la pestaña “ver” y activa las que te falten (sobre todo árbol de directorio local y árbol de directorio remoto) Crear la base de datos necesariaAccede al panel de control de tu hosting (área de clientes de Hostsuar/hosting/activos/ opciones/acceder a cpanel)En el apartado “ bases de datos” elige “asistente de mysql” y rellena los apartados que te solicita (te recomiendo anotar todo en un papel y tenerlo a mano). Los datos son nombre de la base de datos, usuario, contraseña, nivel de permisos (elige 777,todos los permisos, para este tutorial)Si te das cuenta siempre hay un prefijo acompañado de un guión bajo, cuando te soliciten estos datos no olvides el prefijo.Descargar y editar wordpressComo ejemplo en este tutorial vamos a usar wordpress que es un CMS bastante sencillo, aunque podríais instalar cualquiera.- Accede a la web de wordpress: http://es.wordpress.org/ y descárgate la última versión en español (todo esto es gratuito)- Allí vienen las instrucciones, aunque las detallaremos más todavía- El archivo que deberéis editar (paso numero 2 de esas instrucciones) esta en la carpeta que descomprimes, se llama wp-config-sample.php y para editarlo pulsáis sobre el con el botón derecho/abrir con/ block de notas- Se abre el archivo con el block de notas y si lees un un poco lo que está escrito allí, hay una parte donde dice:// ** Ajustes de MySQL. Solicita estos datos a tu proveedor de alojamiento web. ** //- Allí deberás escribir con cuidado (y sin espacios) los datos de la base de datos que creaste, ejemplo:/** El nombre de tu base de datos de WordPress */define('DB_NAME', 'base_nombrequelepuse');Fíjate que sólo escribo entre esas comillas sin dejar espacios y uso el prefijo con guión bajo que me proporcionó el panel de control (y que te dije que anotases en un papel y tuvieses a mano)- Cuando hayas puesto los datos (nombre base de datos, usuario, contraseña…por ahora no necesitas más que eso) pulsa archivo/guardar como/ llámalo wp-config.php (sin el sample)/ y lo guardas exactamente donde estabaSubir wordpress a tu hostingEsto debería ser sencillo. Abres el programa que instalaste (FILEZILLA), pulsas sobre gestor de sitios, eliges el tuyo, te conectas:- En el árbol directorio local (ventana de abajo a la izquierda) busca donde está la carpeta wordpress- En el árbol directorio remoto (ventana superior de la derecha) navega hasta entrar en public_html- Selecciona todos los archivos de la carpeta wordpress (TODOS) y arrastralos a public_html (A LA VENTANA DE ABAJO A LA DERECHA)- Si tienes activada la cola de transferencia (ver/cola de transgerencia) verás subir los archivos como locos hacia tu web Activar wordpress Activar el wordpress es más sencillo aún, basta con ir a tu navegador web (explorer, mozilla, Chrome…) y escribir en la barra de direcciones: http://tudominio.com/wp-admin/install.php Lógicamente sustituye “tudominio” por el nombre de tu dominio Verás que las instrucciones que te da son muy, muy sencillas. Un consejo más, anota bien la clave que te generará wordpress (tambien te la envía al correo que te solicita) y, nada más acceder, cámbiala por una que te acuerdes mejor. A partir de este punto ya tienes tu Wordpress en internet. Ya lo que queda es personalizarlo (que eso sería para otro tutorial) aunque hay miles de plantillas (o themes) que puedes instalar fácilmente desde el apartado “Temas” Te dejo algunos enlaces para que veas algunas plantillas que tu podrías instalar con sólo un click desde el mismo wordpress: http://www.1stwebdesigner.com/wordpress/free-portfolio-photo-gallery-wordpress-themes http://wplift.com/20-high-quality-free-wordpress-portfolio-themes Si tienes cualquier duda escribe un comentario y si puedo ayudarte te contesto.Espero sea de utilidad a alguien, para muchos serán cosas obvias que ya sabían, pero siempre hay que empezar por algún punto.Un saludo

Este es un tutorial para convertir una imagen de una textura en un fondo uniforme (pattern o patrón) muy útil para diseño gráfico o diseño web.Para este tutorial me he bajado de internet una imagen de una textura (http://rezalutions.com/awesome-collection-of-60-high-quality-free-textures/) aunque podéis hacerlo con cualquier foto de textura que tengáis.Esta es la imagenComo podéis observar, en principio no nos sirve como patrón o módulo ya que al unir varias veces esta misma imagen nos encontramos un problema: se notan mucho las uniones Para evitarlo vamos a convertir esa textura en un módulo que podamos aplicar como fondo uniforme.1. Abrimos la foto original con Photoshop2. El primer paso va a ser editar un poco la textura: con la herramienta sobreexponer (a un 19% opacidad) iluminamos los bordes de la imagen para que no existan grandes diferencias de contrasteAsí quedaría después de sobrexponer los bordes:3. Bien ahora vamos a desplazar la imagen un poco hacia la izquierda (si no pudieses desplazarla porque la capa está bloqueada, dale doble click sobre ella en el panel de capas):4. Duplica la capa arrastrándola hacia el icono de nueva capa:5. Arrastra hacia la derecha la nueva capa que has creado hasta su borde izquierdo se una con el borde derecho de la capa anterior (no la desplaces verticalmente, sólo horizontalmente):Ahí se observa claramente el salto que hay en la unión entre ambas capas (salto que vamos a hacer desaparecer con los siguientes pasos:6. Fusionamos ambas capas, para ello en el panel de capas las seleccionamos (click sobre ambas manteniendo pulsada la tecla Shift) y control+E para fusionar7. Usamos el tampón de clonar para evitar el salto entre ambas imágenes, con un tamaño de pincel bajo vamos trabajando esa diferencia hasta disminuirla(a la hora de clonar centrate en ese salto y no alteres los bordes extremos de la imagen)Debería quedarte algo así:8. Vale, los laterales ya funcionan como módulo, ahora sólo hay que repetir los mismos pasos en los bordes superior e inferior. Guarda la imagen como .jpeg y vamos a cambiar los extremos superior e inferior. Como antes, desplazamos unos pixeles la imagen pero esta vez hacia arriba:9. duplicamos la capa como antes, pero esta vez desplazamos la nueva capa hacia abajo, hasta que su borde superior se una con el borde inferior de la capa anterior.10. Fusionamos ambas capas y nuevamente con el tampón de clonar corregimos el salto entre una capa y otra. Guardamos y así obtenemos el resultado final:Ahora esta imagen esta convertida en un módulo (patrón, pattern) Al repetirse no se notan los altos entre sus uniones y puede servirte como fondo (background) para diferentes diseños gráficos o fondos web.Mira, vamos a probarla uniéndola varias veces:Puedes probar este mismo tutorial con diferentes texturas. Espero que sea de utilidadUn saludo