breadcrumb o como saber donde estas

Es muy común en portales de internet del uso de una línea de texto en donde se indica claramente la posición actual dentro de la jerarquía de la web. Algo así como:

Inicio > categoría 1 > subcategoría 1 > aquí

Hay varias formas de realizar esta línea de texto o mediante lenguaje de programación en el lado del servidor o lo mismo pero en el lado del cliente. Yo me quedaría con la opción del lado del servidor. En mi caso php, pero también puede resultar interesante realizarlo en javascript. Este es el caso de breadcrumb. Un sencillo script con todas las funcionalidades requeridas ( creo) y que os podéis bajar desde aquí: BreadCrumbs.js

Sólo hay que colocar un div :

<div id="BreadCrumbBar"></div>

Colocar el js:

<script type="text/javascript" language="javascript1.5" src="/depts/research/includes/BreadCrumbs.js"></script>

Y utilizar los estilos necesarios:

#BreadCrumbBar
{
margin-top: 7px;
margin-right: 10px;
font-size: .75em;
color: #FFFFFF;
text-shadow: #000000 2px 2px 2px;
background-color: #34251F;
}
#BreadCrumbBar
{
float: left;
margin-left: 15px;
}
.breadCrumb
{
display: inline;
}

Y ya tendréis el breadcrumb

10 herramientas para el desarrollador web

He leído recientemente una lista de heramientas para webmasters y en general muy interesante para cualquier desarrollador web profesional. Algunas las utilizo habitualmente, otras dependiendo del proyecto y otras las desconocía:

1. WEBXACT

Información básica sobre tu web.

2. CleanCSS

No hay nada como limpiar esos css una vez ya no los vas a tocar. A veces se quedan muchas cosas comentadas...

3. W3C CSS Validator

Valida el css. Cuidado con los hacks...

4. W3C Markup Validator

Indispensable si deseas validar tu código.

5. TAW3

Una herramienta española bastante útil. Para webs acesibles.

6. WAVE

Monitorea tu código.

7. BrowserShots

te permite ver tu web en distintos navegadores. Muy válido para detectar errores graves.
Me encanta esta herramienta... tanto que tengo en marcha un proyecto similar... pero distinto

8. Ready.Mobi

Esta no la conocía. Y aunque hace años hice alguna web sólo para móviles... ahora no hago ninguna... quizás cuando saquen el iphone pirata y con linux en españa...

9. Pingdom

Permite ver tiempos de carga, de respuesta.. tampoco la conocía.

10. Readability Test

Esta herramienta es la gotita que colma el vaso...sólo para masocas

Cualquier fuente por css

Se acabaron los tiempos en los que el diseñador no muy versado en los medios de internet le encargaban una página... y luego no sabía como colocar las fuentes.

En teoría, sólo se pueden poner las fuentes que el usuario tenga instalada con su sistema operativo. Por eso, no se suelen utilizar tipografías raras. Pero claro, siempre hay algún diseñador que al final no hace código html sino que cuelga directamente una imagen como aquí

Con este trocito de código que han publicado los chicos de a list apart:


@font-face {
font-family: "Kimberley";
src: url(http://www.princexml.com/fonts/larabie/ »
kimberle.ttf) format("truetype");
}
h1 { font-family: "Kimberley", sans-serif }


Podemos hacer lo que queramos...

Sólo falta que sea compatible con todos los navegadores... y que la peña no se pase y comience a poner fuentes muy tochas...

Hay múltitud de fuentes disponibles para descarga... a buscarlas...

1001freefonts.com

todofuentes
....

Wymeditor: editor xhtml

Es muy frecuente en la actualidad el uso de herramientas creadas por terceros. No sólo se mejora la productividad sino que además estandarizas más fácilmente tus nuevos proyectos.

Una de estas herramientas con las que estoy trabajado últimamente es Wymeditor. Se trata de un editor que genera código Xhtml, lenguaje con el que suelo trabajar en la mayoría de mis desarrollos web.

Wymeditor no sólo sirve para generar completas páginas en código Xhtml sino que también sirve para generar eficientes entradas de campo en nuestros gestores cms.

Wymeditor es totalmente configurable y podemos añadir, editar o borrar cuantos botones queramos con sus propias funcionalidades.

Los chicos que generan Wymeditor también están trabajando en un nuevo proyecto... un gestor de contenidos con muy buena pinta...WYMsite CMS.


Como nota final sugerir otro editor. En este caso un editor html con muy buena funcionalidad y muy fácil de implementar en nuestros proyectos. Se trata de openwysiwyg, un editor multinavegador: IE 5.5+ (Windows), Firefox 1.0+, Mozilla 1.3+ y Netscape 7+.