Fuentes personalizadas en nuestras webs

Para agregar una fuente personalizada (que no tenga el usuario instalada en su sistema como pueden ser las tipicas como Arial) deberemos declararla en nuestros estilos; para ello:

@font-face {
    font-family: "Nombre de nuestra fuente";
    src: url(Ruta de nuestra fuente/Nombre del archivo.otf) format('opentype');
}

y despues declararla en nuestros estilos como si fuera cualquier otra:

font-family: "Nombre de nuestra fuente";
Los unicos tipos de fuente compatibles con todos los navegadores son: TTF y WOFF
Para usar un TTF tendremos que poner el formato como sigue:
format('TrueType');

Tambien es recomendable no cargar una fuente personalizada, ya sea por url desde Google Fonts u otro site, o desde nuestro propio servidor, si el usuario ya tiene la fuente en cuestion en su dispositivo, para ello deberemos llamarla del sigueinte modo:
src: local("Nombre de la Fuente")

Todo junto seria algo asi:

@font-face {
    font-family: "Nombre de nuestra fuente";
    src: local("Nombre de nuestra fuente"), url(Ruta de nuestra fuente/Nombre del archivo.otf) format('truetype');
}

Aqui os dejo un ejemplo:

body{
    font-family: "FiraOpenType";
}

@font-face {
    font-family: "FiraOpenType";
    src: url(FiraSansOT/FiraSansOT-Regular.otf) format('opentype');
}

Para esto mismo es muy interesante que veais Google Fonts

Lanzamiento de la nueva web para embarazadas

Hoy por fin hemos lanzado la web para embarazadas de ISDIN!!!
http://www.disfrutatuembarazo.com/

Ruul - una regla en tu ventana

Es la herramienta imprescindible para cualquier maquetador web.
Gracias a esta extensión de chrome podemos colocar una regla en nuestra ventana y ver tanto la medida en Px como en plocs, ademas de hacer todas las funciones de una regla, como comparar si están a la misma altura, este es su enlace:

https://chrome.google.com/webstore/detail/ruul-screen-ruler/mlbnpnlmfngmlcmkhjpbfokdphfehhjj/related?hl=en-US

Registrar tu web en google

Siempre que creo o ayudo a alguien ha crear por primera vez su pagina web, blog, o presencia en Internet en general, he de buscar como registrar o "avisar" a google que existe una nueva pagina web; muchos diréis, ese es trabajo de google, rastrear y encontrar las nuevas webs, y su contenido, y si; estamos de acuerdo, pero si le decimos donde debe hacerlo, no lo hará antes??

Todos queremos aparecer en dicho buscador lo antes posible así que, este es el método:

Tan solo ir a esta url https://www.google.com/webmasters/tools/submit-url pegar la url que queremos que indexe y resolver el captcha

Espero que os resulte de utilidad.

Dejar una capa siempre visible

En esta ocasión voy a explicar como dejar una capa o un div siempre visible en la web; es decir que al hacer scroll esa capa no se mueva esto puede hacerse para dejar siempre visible nuestro logo, o como en facebook, tuenti y muchas otras paginas, para dejar siempre visible el chat, en fin que los usos son tantos como limites tenga nuestra imaginación.

En la hoja de estilos tan solo deberemos escribir el siguiente código:

    position: fixed;
debiendo tanbién decirle donde queremos que aparezca claro esta, podemos teclear algo como lo siguiente

    left: 0px;
    top:0px;
para que aparezca en la esquina superior izquierda, podemos darle porcentajes, usar PT; al fin y al cabo es solo una etiqueta css mas.

Espero que os sea útil ;)

Establecer pagina por defecto

aveces cambiamos de hosting por la razón que sea y tenemos una aplicación, o una pagina web ya hecha y nos encontramos con el problema de que nuestras paginas por defecto (la que se muestra sin escribirla en la URL) se llama defaul.php o index.php suelen ser las mas típicas así como las correspondientes con la extensión .html

el problema esta en que cambiamos de hosting, migramos nuestra aplicación y va todo genial, excepto que si escribimos www.nuestroDominio.es nos muestra una pagina de apache y no la nuestra aunque entrando a www.nuestroDominio.es/defaul.php si nos muestra nuestra pagina.

Es debido a la configuración de apache para buscar las paginas por defecto algunos servidores pueden tener el index, otros el defaul. otros alguna otra configuración menos estandar, y los mas completos tienen todas o casi todas las configuraciones, si podemos entrar al apache y configurarlo genial, pero eso no es posible en los hosting compartidos, que es el caso de la mayoría de nosotros ya que tener un servidor dedicado es muy caro y si estamos empezando no nos lo podemos costear; pero no hay que desesperarse, mediante el .htaccess podemos configurarlo para que nos coja nuestra pagina, tan solo debemos colocar el siguiente código en el.

DirectoryIndex default.php

Sustituyendo el default.php por la pagina de inicio que tengamos

Espero os sirva de ayuda

Forzar redicionamiento de un alias al dominio principal

Bueno lo prometido es deuda, esta vez no me voy a extender mucho ya que lo que vamos a hacer esta explicado en los post anteriores con la única diferencia de que esta vez vamos a redireccionar desde un alias o dominio secundario, al principal; es decir tenemos nuestro dominio ya correctamente configurado para que nos entren las visitas por
dominioPrincipal.com o www.dominioPrincipal.com
nos dirija siempre a www.dominioPrincipal.com
y nos queda que si entran por dominioSecundario.com o por www.dominioSecundario.com nos dirija a www.dominioPrincipal.com

Esto se usa mucho para cuando cogemos un nombre en Internet, y compramos todos los dominios disponibles, es decir el .com, .es, .eu, etc.....
Podeis ver un ejemplo en los siguientes enlaces
www.monologo.eu
www.poque.es

Si pincháis sobre cualquiera de ellos vereis que entra en la url que habéis clickao pero cambia a www.poque.es lo mismo ocurre con las www de delante de cada dominio.
para ello tan solo deberemos copiar este código en nuestro .htaccess

RewriteEngine On

RewriteCond %{HTTP_HOST} ^dominioSecundario\.eu[NC]
    RewriteRule ^(.*)$ http://www.dominioPrincipal.es/$1 [R=301,L]

RewriteCond %{HTTP_HOST} ^(www\.)?dominioSecundario\.eu$
    RewriteRule ^(.*)$ http://www.dominioPrincipal.es/$1 [R=301,L]

Este es solo el código para redireccionar de un alias al dominio principal, el del redirecionamiento para las www del dominio principal esta explicado en un post anterior

Un saludo

Forzar el WWW en un dominio mediante Redirección

Es importante sobre todo en temas SEO que todas nuestras paginas entren por la misma URL es decir, si tenemos un Dominio, como por ejemplo:

dominioPrincipal.com
siempre podremos entrar desde dominioPrincipal.com y desde www.dominioPrincipal.com, si tenemos otros dominios funcionando como alias tambien entraremos a la misma web desde dominioSecundario.com, www.dominioSecundario.com, etc ...

Bien esto para Google y otros buscadores puede considerarse contenido duplicado y por lo tanto llevar a penalizacion, si habeis leido bien, a Google no le gusta que se pueda entrar desde mas de una URL a  la misma web, considera que hay mas de una web con el mismo contenido, y penaliza a ambas, en este caso seremos nosotros los penalizados, para que esto no ocurra debemos obligar que siempre se entre por la misma URL, asi que entren los usuarios por donde entren les mandamos a la que a nosotros nos interese mas, vamos a suponer que nuestro dominio es:

• dominioPrincipal.com

y vamos a mandarle a

• www.dominioPrincipal.com

Para ello solo tendremos que poner el sigueinte codigo en nuestro .htaccess

RewriteEngine On
RewriteCond %{HTTP_HOST} ^dominioPrincipal\.com[NC]
   RewriteRule ^(.*)$ http://www.dominioPrincipal.com/$1 [R=301,L]

Podeis ver un ejemplo en:
monologosymas.es
www.monologosymas.es

Para obligar a que nuestros subdominios tambien se redireccionen a nuestro dominio principal publicaremos otra entrada ;)

Forzar redirección de carpeta a subdominio desde el .htaccess

Ahora vamos a forzar la redirección de una carpeta hacia un subdominio por medio de un .htaccess con redirección 301.

En ocasiones podemos tener una o mas de nuestras carpetas alojadas de la siguiente manera:

www.nuestroDominio.com/carpeta/

y queremos que cuando entren ahí se les redireccione automáticamente al subdominio carpeta, quedando algo así:

carpeta.nuestroDominio.com

También añadiremos que cuando entren a alguna pagina de la carpeta se les redireccion a la misma pagina pero en el subdominio, como en este ejemplo:

www.nuestroDominio.com/carpeta/index.html  –> carpeta.nuestroDominio.com/index.html

Para hacerlo basta con poner el siguiente código en un archivo con el nombre “.htaccess” en la raíz del directorio (ejemp: /public_html/.htacess )#Forzar redireccion de carpeta hacia Subdominio

RewriteEngine On
RewriteCond %{HTTP_HOST} ^(www\.)?nuestroDominio\.com$ 
 RewriteRule ^carpeta(/.*)?$ http://carpeta.nuestroDominio.com$1 [R=301,L]
#FIN Forzar redireccion de carpeta hacia Subdominio

Acceder a tu servidor desde fuera

Para que tu web pueda ser vista desde internet, es necesario un par de configuraciones, lo mas importante que necesitamos es conocer la Ip real, para ello tenemos miles de paginas en internet, como por ejemplo:
http://www.cualesmiip.com/

Allí, en mi caso me ha dado: 82.158.17.99 (no os molestéis en intentar nada, tengo Ip dinámica en cuanto lance el post reiniciare el router)
También deberemos configurar nuestro router, para que redireccione las peticiones entrantes por el puerto 80, a la Ip privada de nuestro server, para ello como es obvio nuestro server debe tener una Ip fija, o cada vez que lo reiniciemos podrá tener una Ip distinta y abra que configurar de nuevo el router.(no voy a explicar como hacerlo ya que cambia según el sistema operativo que se use, y es algo muy básico, si tenéis alguna duda, poner un comentario, estaré encantado de ayudar)
Pues bien deberemos entrar en nuestro router, por lo general poniendo en el navegador 192.168.1.1 y logeandote puedes entrar, si no as cambiado los datos de acceso de fabrica suele ser admin/admin ; 1234/1234 , o alguna combinación de ambos, para otros casos mirar el manual del aparato, consultar con tu ISP o a googlear XD

Una vez estemos en el router, deberemos ir a las opciones de NAT, o como en mi caso (NetGear
Reenvío de Puertos) una vez estemos allí deberemos decir que todo el trafico que entre por el puerto 80, que nos lo dirija, al puerto 80 de la ip del server

En mi caso:

Externo			Interno
	Nombre	Puerto inicial	Puerto final	Puerto inicial	Puerto final	Protocola	Dirección IP Local
							192.168.1.

Una vez realizado esto ya lo tendremos listo, tan solo deberemos abrir un navegador (desde otro ordenador, móvil, etc) y poner

http://"DireccionIpExterna"/"NombreDeTuWeb"/ 

en mi caso:

http://82.158.17.99/poque/ 

Comprueba que no tengas ningún cortafuegos, o antivirus activado, ya que podría cortarte el acceso; con esto ya tenemos nuestro servidor instalado, y visible desde fuera; es posible que si intentas entrar desde la misma red te de algún tipo de error, para evitarlo desde otros ordenadores usa un servicio de proxy.

Con esto ya hecho, solo queda abrir la web, y esperar a ver si también me lo corta como me pasa con el servidor web.

Un Abrazo y Hasta el Próximo post