Archive for Marzo 2010
¡Que susto!
Justo cuando subía unos archivos por ftp, veo que me salta una pantalla negra con un mensaje en el centro reinicie su equipo.
Lo hice y vi que el iMac mostraba una pantalla completamente blanca y emitía una serie de 3 tonos consecutivos.
El problema estaba en la placa de memoria una de las dos estaba muerta. Fui a una tienda de Apple a por un repuesto y os cuento los pasos para hacer el cambio.
Desconecta el cable de corriente del equipo iMac.
Voltea la pantalla boca abajo en una mesa limpia con mantel.
Verás bajo el perfil de la pantalla una ranura con un pequeño tornillo.
Lo siguiente es localizar la lengüeta de plástico de color negro que usaremos para tirar suavemente hasta soltar la placa de memoria.
Lo siguiente es con cuidado y utilizando los bordes, extraemos la placa de memoria Koreana.
El siguiente paso es introducir con el mismo cuidado con el que extrajimos la placa poner la nueva que seguramente sea made in Germany como la mía.
Volver a introducir la lengüeta de plástico en su sitio.
Enchufas el cable de corriente y enciendes tu iMac nuevamente, caso veas la misma pantalla blanca y los 3 tonos consecutivos, no te alarmes.
Seguramente te equivocaste de placa, prueba reemplazar la otra y verás como te funciona de maravilla.
La placa dispone de un corte como puedes ver en la siguiente foto.
Debe estar al lado izquierdo por si no te fijaste como sacaste la placa anterior.
Ya tengo mi iMac con la cabeza despejada y listo para trabajar nuevamente, el tiempo total empleado fue una hora por el tráfico y precio unos 37€ la placa de memoria nueva y gasolina.
25
Diferencias entre Diseñador web y informático
0 Comentario | Posted by Alejandro Briz in Diseño web
Según define Wikipedia;
El diseño web es la actividad que planifica el diseño e implementación de sitios web y páginas web.
No es simplemente una aplicación del diseño convencional, ya que requiere tener en cuenta cuestiones tales como navegabilidad, interactividad, usabilidad, arquitectura de la información y la interacción de medios como el audio, textos, títulos, imagen y vídeos. Se considera dentro del campo del diseño multimedia.
Por lo contrario un informático lo define Wikipedia como;
Profesional dedicado a la ciencia aplicada que abarca el estudio y aplicación del tratamiento automático de la información, utilizando dispositivos electrónicos y sistemas informáticos. También está definida como el procesamiento automático de la información.
Muchos clientes me llaman y comentan que necesitan una página web y que me encontraron buscando un “informático” en internet.
Con lo cual este pequeño texto va en ayuda de las personas que necesiten un diseñador web o informático, para que después no tengan resultados inesperados si contratas un diseñador para realizar el trabajo de un informático y viceversa.
¡Saludos!
Aquí os dejo el código de como hacer un menú vertical sencillo en CSS y Html.
Código CSS;
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 | #menu {
border: 1px solid #ACCFE8;
border-width: 1px 1px 0 1px;
width: 150px;
font: 80% "Trebuchet MS", Arial, Helvetica, sans-serif;
}
#menu ul, li { list-style-type: none; }
#menu ul { margin: 0; padding: 0; }
#menu li { border-bottom: 1px solid #ACCFE8; }
#menu a {
text-decoration: none;
color: #3366CC;
background: #F0F7FC;
display: block;
padding: 3px 6px;
width: 138px;
}
#menu a:hover { background: #DBEBF6; } |
Aqui el código Html;
2 3 4 5 6 7 8 9 10 11 | <body>
<div id="menu">
<ul>
<li><a href="#">Ítem 1</a></li>
<li><a href="#">Ítem 2</a></li>
<li><a href="#">Ítem 3</a></li>
<li><a href="#">Ítem 4</a></li>
</ul>
</div>
</body> |
¡Espero le valga a alguien!
Saludos ; )
23
Centrar contenido en CSS margin:0 auto;
0 Comentario | Posted by Alejandro Briz in Diseño web
No es la primera vez que me preguntan como centrar un contenido con CSS y no será la ultima.
Un ejemplo común de la utilización de margin para centrar contenido será cuando necesitemos crear el cuerpo de la página y por consiguiente que se mantenga siempre en el centro de la pantalla del navegador del usuario.
Para ello supongamos que tenemos el siguiente código HTML;
1 2 3 4 5 6 7 8 9 | <html> <head> </head> <body> <div id=”contenedor”> <p>nuestro futuro contenido web</p< </div> </body> </html> |
El código HTML es muy sencillo, creamos un tag DIV llamado con un identificador único “contenedor” , cual con la ayuda de CSS le daremos estilo y lo centraremos a la pantalla del navegador.
Para ello aplicamos el siguiente código CSS;
Doy por hecho que tienes los margenes y espacios interiores reseteados a 0 por si las moscas.
Ejemplo:
2 | * { margin:0; padding:0; }/* Resetea todos los margenes y padding a 0 */ |
A continuación declaramos el DIV en el archivo CSS.
3 4 5 6 7 8 9 10 11 12 13 | div#contenedor {
width:960px; /* Anchura de nuestro contenedor centrado */
height: 700px; /* Forzar 700px de altura */
border:solid 1px #C5C5C5; /* simple borde para saber donde anda el contenedor */
margin:0 auto; /* el culpable de que centremos el contenedor */
} |
Ya está no necesitas nada más, hemos declarado el ancho de nuestro contenedor a 960px, en este ejemplo ya que no tengo contenido declaramos la altura en 700px pero no lo necesitas poner ya que al disponer de contenido crecerá por si solo el contenedor.
Lo mismo haríamos en caso que trabajemos dentro de otro div dentro de otro y otro y otro…
El Instituto de Crédito Oficial y el Ministerio de Industria, Turismo y Comercio amplían el convenio de colaboración de la línea de financiación ICO – Plan Avanza con el objetivo de fomentar el uso de las nuevas tecnologías de la información y de las Comunicaciones.
Los préstamos están cofinanciados por el Ministerio de Industria, Turismo y Comercio y el Fondo Europeo de Desarrollo Regional (FEDER), para las regiones Objetivo 1.
Recursos disponibles
1.760,70 millones de euros, ampliables en función de la demanda y de las disponibilidades presupuestarias.
Vigencia
Hasta el 31 de diciembre de 2010 o hasta el agotamiento de los fondos en su caso.
Más información en http://www.ico.es/web/contenidos/272/index.html
Hoy día 19 de marzo del año 2010 a sido aprobada la Ley Sinde en la ciudad de Sevilla.
A mi parecer estuvieron calentando el pico ya que se respira alegría en Sevilla que se acerca a la feria de Abril.
No doy fe, ahora cualquiera que tenga un poquito de poder y este encabronado sin necesidad de un juez que lo determine puede cerrar una página web.
¿ Por que nos quieren callar ?
Los poderosos tienen años para pleitear y demostrar que no robaron fondos públicos, el pueblo llega a olvidarse de sus trapos sucios y juicios.
Acabamos de asistir a la confirmación de que a día de hoy el peso de la ciudadanía es prácticamente cero, somos títeres que el poder político maneja a su antojo y deseo.
¡Hoy Psoe, mañana PP!
Por otro lado la aprobación de la “Ley Sinde” es la confirmación de que los grupos empresariales son los que “cortan y reparten el bacalao” en España.
¿Estos nos buscan las cosquillas, no? ¡Quieren guerra!
¡ Ufh ! Acabo de visitar la tienda de Apple para ver y soñar un poco con sus máquinas.
Me he puesto a tunear un MacPro que de base cuesta 2.199€.
Y estas son las especificaciones de la máquina;
- Procesador Two 2.93GHz Quad-Core Intel Xeon
- Memoria 32GB (8x4GB)
- Mac Pro RAID Card
- Disco 2TB 7200-rpm Serial ATA 3Gb/s
- Disco 2TB 7200-rpm Serial ATA 3Gb/s
- Disco 2TB 7200-rpm Serial ATA 3Gb/s
- Disco 2TB 7200-rpm Serial ATA 3Gb/s
- ATI Radeon HD 4870 512MB
- Two 18x SuperDrives
- Apple Cinema HD Display (pantalla plana de 30 pulgadas)
- Apple Cinema HD Display (pantalla plana de 30 pulgadas)
- Apple Magic Mouse
- Apple Keyboard con teclado numérico (Español) & Guía del usuario
- AirPort Extreme Wi-Fi Card with 802.11n
- Quad-channel 4Gb Fibre Channel PCI Express card
La cantidad final fue de 15.831,97 €, eso sí el envió es gratuito menos mal ¿no?
Esta pseudo clase afecta a un elemento que sea el objetivo de un identificador para un fragmento representada por un símbolo ancla “#” en la URL del documento.
Cuando hagas clic en un enlace que termina con un elemento identificador de fragmento que estamos señalando se convierte en el objetivo de :target.
Un ejemplo, si la url es http://www.alejandrobriz.es#n, el siguiente selector que coinciden con el elemento que había en el id del atributo de “n”;
Por ejemplo;
1 2 3 4 5 | div#n:target {
background: #C5C5C5 none repeat scroll 0 0;
border: 2px solid #FF0099;
padding: 5px;
} |
Internet Explorer no tiene soporte en todos los de la: pseudo-clase, Opera no es compatible con este selector cuando se utiliza el botones Atrás y Adelante. Aparte de eso, los principales navegadores dan soporte a está fantástica psuedo clase de CSS3.
¡Si! Es verdad no me gusta, no le veo cual es el beneficio de introducir un Bubble Tooltips en todos los enlaces que disponga el contenido.
Siempre el usuario al leer el contenido acaba poniendo el ratón sobre uno de ellos, abriéndose así el dichoso globo con la información y despistando en la lectura del contenido.
Sin duda es un recurso llamativo y práctico si lo usamos con cabeza y en su debido sitio y momento.
Lo veo muy práctico en enlaces o botones que nos faciliten una descarga para informar al usuario del tipo de archivo tipo Coda, la cantidad de kilobytes a descargar y el formato de la descarga, pero poner un Bubble Tooltips en cada enlace o incluso en imágenes o banner que alguno he visto pues no creo que sea lo suyo.
La mayoría de las veces tardan en cargar las miniaturas de páginas y si el texto es pequeño y el usuario torpe debe apuntar muy bien para un funcionamiento optimo.
Con lo cual recomiendo estudiar muy bien la colocación de los Bubble Tooltips en nuestro contenido ya que puede molestar mucho.
Caso necesites implementar un Bubble Tooltips en tu página web te recomiendo jQuery, buenísimo.
Saludos
Si bien no entiendo por que no incluyeron en la versión CSS 2.1 la propiedad de texto sombra, en la versión CSS3 si viene y es genial y muy sencilla.
La nueva propiedad de CSS3 se llama text-shadow a primera vista es muy sencilla de utilizar pero debemos estudiarla a fondo ya que en profundidad se complica su uso.
¡Es broma! Más fácil de usar es imposible.
Este seria un ejemplo básico de su uso, por ejemplo en los tag de texto
1 | <h1><h2><p> |
El código CSS seria así;
2 3 4 | .tu_texto { text-shadow:-3px 5px 2px #C5C5C5; }
.tu_texto2 { text-shadow:-10px 5px 5px #999; }
.tu_texto3 { text-shadow:5px 5px 2px #999; } |
El código HTML seria así;
3 4 5 | <h1 class=”tu_texto”>Sombras en textos con CSS3</h1> <h2 class=”tu_texto2″>Sombras en textos con CSS3</h2> <h3 class=”tu_texto3″>Sombras en textos con CSS3</h3> |
Saludo







