Archivo de la etiqueta: web

Creative Tim – Dale un look profesional a tu web

Buscando inspiración y recursos para el desarrollo de nuevos proyectos di con la web de Creative Tim y sus diseños y plantillas para web son muy buenos. Dentro de los temas que nos ofrecen destacaria el Paper Kit, Get Shit Done Kit y Awesome Landing Page.
Estos Kits son gratuitos para uso personal, y en el caso que seas desarrollador tiene un coste de 19€ cada uno.
Yo os recomendaria descargar las versiones gratuitas primero y enredar con ellas. Tengo que decir que la documentación y los ejemplos que hay en las descargas dan mucha ayuda a la hora de realizar tus desarrollos. Decir que todos los temas estan basados en Bootstrap 3, y si tienes un poco de experiencia con el, no vas a tener problemas a la hora de integrarlos.

Para poder descargarlos hay que registrarse en la web, y uno de los primeros correos que te envian, por lo menos en mi caso, es un codigo de descuento para comprar uno de sus temas.

Anuncios

Temas gratuitos Bootstrap

BootstrapBootstrap, como muchos de vosotros ya conocéis, es uno de los frameworks para diseño de paginas web mas usado hoy en día. Esto hace que los recursos que podemos encontrar para personalizarlo a nuestro gusto son numerosos. En la entrada de Bootswhatch ya veíamos unos cuantos temas para usar gratuitamente tanto en la versión 2 como en 3 de Bootstrap, en la pagina de Black Tie podemos encontrar una gran colección de temas, destinados para la versión 3 para poder aplicar según la temática de nuestra web.

Como eliminar las extensiones .php, .html y htm de nuestra pagina web con .htaccess

Apache Web Server

A la hora de presentar nuestra pagina web, a veces nos puede interesar, que el usuario no sepa como esta hecha la pagina web, o simplemente queremos simplificar el enlace para que se pueda acceder de una manera sencilla.

He encontrado esta pagina web, la cual merece ser visitada, ya que esta muy bien hecha, en la cual nos explican de una manera muy sencilla, aunque en inglés, de como configurar, si usamos Apache, con .htaccess, para ocultar las extensiones.

http://alexcican.com/post/how-to-remove-php-html-htm-extensions-with-htaccess/

Convertidor de RGB a Hexadecimal

Seguramente en algún momento mientras estamos desarrollando hemos necesitado convertir un color de RGB a Hexadecimal, por ejemplo, en los nuevos diseños de paginas web, se esta empezando a usar cada vez mas el RGB o RGBA a la hora de establecer los colores, y puede que necesitemos trasladar ese color a hexadecimal, para ello podemos usar la siguiente pagina web para que nos convierta el color http://www.javascripter.net/faq/rgbtohex.htm

Como se mueven nuestros ojos cuando vemos una pagina web

Para los que nos dedicamos al desarrollo/diseño de paginas web, es bastante conocido el principio de como hay que ubicar los elementos  para que el usuario vea primero lo que queremos que vea primero. La siguiente imagen nos muestra como ubicar y distribuir los elementos para que nuestra distribución sea efectiva.

Articulo original en ingles: http://www.getelastic.com/eye-tracking-infographic/

eye-tracking-2

100 consejos SEO para poner tu blog en lo mas alto de Google – SEO Tips

Hace años con la explosión de internet se impuso una máxima que era “Si no estas en internet no existes”, hoy en día esa frase sigue vigente pero se completa con esta otra ” y si no apareces en la primera pagina de los buscadores es como si no existieras”. Desde la primera parte de la frase hasta la actual el trabajo a la hora de desarrollar un sitio web ha cambiado, y lo que podía considerarse como una tarea propia del desarrollador se ha convertido en una tarea especifica de un especialista y dedicar mas tiempo que el que mucha gente se cree. El siguiente articulo nos puede ayudar a la hora de posicionar nuestra/as paginas en lo mas alto de internet.
https://exploreb2b.com/articles/100-seo-tips-turn-your-blog-into-the-top-of-google

Enhanced by Zemanta

Input autocompletable sin Javascript – HTML Tips

El elemento datalist

Otro de los nuevos elementos que trae el HTML5 es el elemento datalist.  La documentación acerca de este elemento nos dice lo siguiente:

The datalist element represents a set of option elements that represent predefined options for other controls. In the rendering, the datalist element represents nothing and it, along with its children, should be hidden.
 

Es decir, el elemento datalist representa un conjunto de opciones que nos muestran opciones predefinidas para otros controles. En la visualización el elemento y sus hijos están ocultos.

¿Como podemos utilizarlo?

A la hora de incluirlo dentro de nuestro código definimos el elemento y su conjunto de opciones, este elemento lo vincularemos por ejemplo con un campo input


<label>Airport: <input type="text" list="airports" name="to" />
<datalist id="<span class=&quot;hiddenSpellError&quot; pre=&quot;&quot;>airports</span>"></datalist>
value='ATL' label="Atlanta">
value='MEM' label="Memphis">
value='LHR' label="London Heathrow">
value='LAX' label="Los Angeles">
value='FRA' label="Frankfurt">
 </datalist>

Al pulsar la tecla L se muestra los aeropuertos que empiezan con L
Al pulsar la tecla L se muestra los aeropuertos que empiezan con L

Como se ve en la imagen, nos aparece el value en negrita y  el valor de label un poco mas claro, y una vez seleccionado el valor, en el campo de texto se queda el valor del value.

Estos elementos pueden ser reutilizados dentro de una pagina web, por ejemplo si quisiéramos poner una lista de aeropuertos de origen y destino, nos podría valer con el mismo datalist.

Este elemento esta soportado por todos los navegadores a excepción de Safari.

Mas información:

http://www.w3.org/TR/html5/forms.html#the-datalist-element

http://www.w3schools.com/tags/tag_datalist.asp

Enhanced by Zemanta