Dweb3d Diseño de Páginas Web y 3D en Colombia

BLOG DE DISEÑO: WEB, 3D, INDUSTRIAL Y MÁS

Viernes, Julio 25, 2014

Programando un Diseño Web Adaptable

Lunes, 16 Diciembre 2013 by Jorge Forero

Muchos ya conocemos la increíble ventaja que representan los diseños web adaptables y responsive, podemos remitirnos a artículos de nuestra web para saber más de su definición y proceso e historia web en general; pero ya entrando en datos técnicos como se programa una página web responsive?, a continuación una introducción al respecto. 

Aunque pareciera un aspecto bastante complicado, todo parte del principio fundamental de adaptabilidad en páginas que es muy básico: Debemos consideras 3 anchos de pantalla como mínimo: uno para smartphones, uno para tablets y otro para pantalla completa, en algunos casos será necesario considerar un ancho extra más que es el de las pantallas de notebooks pequeños que a veces nos dan inconvenientes  si sólo consideramos un ancho completo ya que es muy diferente una pantalla de 980 pixeles de ancho a una de 2000 pixeles de ancho, ya que hay que considerar que cada vez más usuarios acceden desde pantallas grandes por un lado, y por otro mucho más creciente aún, lo usuarios ya tienen acceso a internet móvil y poseen smartphones, además necesitan acceder a la información bastante rápido.

Para eso sirven los media queries y hay algunas maneras de añadirlos, se pueden llamar por separado desde el archivo html respectivo o ser pueden ingresar en el mismo archivo, a continuación les expongo un ejemplo en el cual pensamos en 4 tipos de pantallas, acá se intuye que ya tenemos un código para el ancho completo y para especificar en el css los respectivos paquetes los delimitamos con el siguiente bloque de código: @media screen and (max-width: ?px)  {   Bloque de código del ancho respectivo }  en donde ? es el punto máximo en hasta el cual el código es aplicado, luego de rebasar ese ancho pasa al siguiente bloque de css y así sucesivamente, algunos recomiendo empezar con cómo se vé el ancho más pequeño e irlo cada vez agrandando, entre más específicos sean los detalles de cada sección, mejor será la adaptabilidad de los diversos componentes, en este ejemplo tenemos sólo dos elementos, pero con esta misma estructura podemos asignar más elementos, considerando que muchas páginas tienen un header (sección superior), un slider (banners cambiantes) y un footer (sección inferior), sin contar los menús, recuerde que el div respectivo debe nombrado, para realizarle el respectivo llamado desde CSS.

/* smaller than 980  */
@media screen and (max-width: 980px) {
/* content */
#contenido {
width: 60%;
padding: 3% 4%;
}
/* sidebar */
#barra-lateral {
width: 30%;}
}
/* smaller than 650 */
@media screen and (max-width: 650px) {
/* content */
#contenido {
width: auto;
max-width:450px;
float: none;
margin: 20px 0;
}
/* sidebar */
#barra-lateral {
width: 100%;
max-width:650px;
text-align:center;
margin: 0;
float: none;
}
#barra-lateral img {
width: 100%;
max-width:450px;
margin: 0;
float: none;
} #barra-lateral .widget {
padding: 3% 4%;
margin: 0 0 10px;
}
/* smaller than 560 */
@media screen and (max-width: 480px) {
#contenido {
width: auto;
max-width:300px;
text-align:center;
float: none;
margin: 20px 0;
}
/* sidebar */
#barra-lateral {
width: 100%;
max-width:350px;
text-align:center;
margin: 0;
float: none;
}
#barra-lateral img {
width: 100%;
max-width:350px;
text-align:center;
margin: 0;
float: none;
}

Es necesario algo de práctica para dominar la técnica y tener conocimientos en HTML y CSS previos para poder realizar la maqueta correctamente, la mejor versión para maquetar el archivo .html sería por supuesto HTML5 que ya viene optimizado para funcionar en dispositivos móviles y tablets, para tener una buena interactividad es necesario incorporar además Javascript en nuestro sitio, recuerde que para diseñar webs cada vez será más importante pensar en los usuarios, por lo cual el diseño es bueno enfocarlo hacia la experiencia que tendrán los usuarios con las páginas web.

Etiquetado como:

Para la comunidad de diseñadores web y bloggers en Wordpress tenemos una noticia en el mundo del desarrollo web, una nueva versión de el actualmente más famoso CMS para blogging y sitios web: Wordpress en su version 3.8 o también conocida como "Parker" como homenaje a el legendario maestro del jazz Charlie Parker, está versión de WordPress está en línea desde el 13 de diciembre de 2013, con un nuevo tema para blogs llama Twenty Fourteen y una interfaz de administrador rediseñada y bajo el concepto del diseño web adaptable que ofrece una mejor experiencia de lectura y publicación desde tablets y smartphones, esquemas de color varios para escoger y un diseño de interfaz fresco en las áreas de temas, widgets y escritorio. Y como siempre el formato opensource de Wordpress nos permite disfrutarla de forma gratuita, ya ha tenido más de millón y medio de descargas en tan sólo 4 días luego de su lanzamiento. Bueno, y con ocasión del comienzo de las festividades de navidad y año nuevo, ha sido un excelente regalo. Hemos tenido un gran año 2013 con los lanzamientos de Wordpress 3.6, 3.7 y 3.8, esperamos que para todos lo haya sido, que nos traerá Wordpress para el 2014?

La versión 3.8 fué llamada Parker en honor a un maestro innovador del Jazz y el bebop, Charlie Parker y ya está disponible para descarga, una estética moderna y un diseño fresco que transmite claridad y simplicidad. Una tipografía limpia y de código abierto, como todo lo de Wordpress. Un contraste refinado, que cambia el look de Wordpress al que estábamos acostumbrados.  

Wordpress en cada dispositivo: Debido a que todos accedemos a Internet de diversas maneras, como por ejemplo desde el smartphones, tablets, portátil o PC de escritorio, Wordpress ahora se adapta a diversos tamaños de pantallas, lo cual nos hará sentir como en casa. Con alta definición y mejoras en la velocidad, podremos publicar más rápidamente nuestros artículos.

Los esquemas de color le darán a su interfaz una increíble capacidad de personalización, con los 8 nuevos esquemas de color que ahora se introducen en el diseño y desarrollo web de esta versión de Wordpress.

188 personas contribuyeron para que este lanzamiento se hiciera posible y todos podamos acceder a él de manera gratuita.

Más información de la versión 3.8 "Parker" de Wordpress en su sitio oficial:

http://wordpress.org/news/2013/12/parker/

Etiquetado como:

Que es el Diseño Web Adaptable?

Martes, 10 Diciembre 2013 by Jorge Forero

Responsive Web Design, Diseño Web Adaptativo o Adaptable

Todos los días la tecnología avanza de manera sorprendente con el fin de hacer más fácil la vida del hombre y con ella, surgen nuevos deseos y necesidades que demandan la innovación y la mejoría de los productos y servicios que se posicionan en el mercado.

Si hablamos de las tendencias en Internet, las nuevas estrategias que se están generando tienen que ver con los usuarios, de hecho su enfoque esta en ellos. Anteriormente existía una gran barrera que separaba al consumidores de los sitios, pues aunque se seguían desarrollando aparatos electrónicos con acceso a Internet, muchas de las paginas no estaban optimizadas para funcionar desde estos dispositivos.

Sin embargo ese obstáculo pudo derribarse gracias a las nuevas técnicas que permiten a las páginas adaptarse al contexto de los usuarios actuales y atraer a los usuarios potenciales, y que la muchos diseñadores, programadores y dueños de sitios están implementando.

Etiquetado como:

Como Incrementar la Autoridad de dominio de su sitio web?

Viernes, 15 Noviembre 2013 by Jorge Forero

La autoridad de dominio es un aspecto que siempre ha sido muy importante en el posicionamiento de las páginas web, con la llegada de los últimos algoritmos de google, como el hummingbird, el aspecto de la autoridad de dominio sigue teniendo una importancia considerable para el posicionamiento de las páginas, con el plus adicional que como cada vez es más importante diseñar webs para los usuarios, la temática de los sitios web adquiere relevancia en su clasificación, por lo que las webs con más autoridad en un tema determinado, adquirirán relevancia y mejores posiciones en los buscadores cuando los usuarios busquen por ese tema, con el algoritmo hummingbird, google va más allá de la palabra clave y puede realizar respuestas más complejas que antes a las consultas de los usuarios.

Es por esto que recomendamos dentro dentro del diseño de una estrategia digital de posicionamiento, darle importancia a aumentar la autoridad de dominio del sitio a posicionar, pero la pregunta más importante es cómo incrementar la autoridad de dominio de su sitio web?, hemos encontrado una interesante infografía que nos dará algunos tips al respecto.

Etiquetado como:

Cortometrajes en Animación 3D Colombianos

Jueves, 10 Octubre 2013 by Jorge Forero

En Colombia, la animación 3D es un área hasta ahora en crecimiento, sin embargo se han hechos algunos avances en este campo y hay gente muy talentosa ávida de trabajar y realizar proyectos interesantes, como ejemplo les compartimos algunos cortometrajes en animación 3d hechos en Colombia. Felicitamos a estos profesionales por estar siendo pioneros en Colombia en un campo al que aún le falta bastante de donde sacarle provecho en nuestro país. Les compartimos 3 cortometrajes: Los Atrapasueños, Dirigida por Antonio Sanint, Nucuma, de Signos Studio y Eduado y el Televisor, de José Alexander Gallardo.

Etiquetado como:

Infografías Sobre Diseño Web y Redes Sociales

Jueves, 10 Octubre 2013 by Jorge Forero

Las infografías son útiles maneras de representar gráficamente estadísticas, textos, descripciones y narraciones, en las cuales representamos los datos de una manera icónica, figurativa, gráfica, e incluso sonora, animada e interactiva. Las infografías son medios para mostrar los datos e información gráficamente a través de infogramas, que pueden ser mapas, estadísticas, íconos, gráficos comparativos, viñetas, con los que la información se hace más completa y detallada y el elemento gráfico la hace más comprensible y amigable.

En esta ocasión hemos elaborado una selección de infografías útiles para la comunidad del diseño y desarrollo web y social media, las infografías permiten comprender rápidamente algunos aspectos ya que al ser mostradas de una manera gráfica la información se vuelve más clara, si desea un diseño específico de alguna infografía y mostrar la información de una manera distinta e impactante no dude en contactarnos.

Etiquetado como:

Hummingbird (Colibrí), el nuevo algoritmo de Google

Miércoles, 09 Octubre 2013 by Jorge Forero

hummingbird Google 300x187 Google Updates Search with Hummingbird http://www.dweb3d.com/blog/posicionamiento-seo/hummingbird-el-nuevo-algoritmo-de-google.html Hummingbird (Colibrí), el nuevo algoritmo de Google Hummingbird , es el nombre del último algoritmo de Google, introducido a finales de septiembre de 2013, para muchos fué un cambio inesperado ya que Google no avisó oficialmente de este lanzamiento. #hummingbird #googlehummingbird

Hummingbird , es el nombre del último algoritmo de Google, introducido a finales de septiembre de 2013, para muchos fué un cambio inesperado ya que Google no avisó oficialmente de este lanzamiento, el anuncio se dió en medio del cumpleaños de Google en una reunión que se dió en el antiguo garaje en e cual se dió origen a la companía. Este algortmo ha estado realizando cambios en las búsquedas en el último mes.

Así como caffeine, panda y penguin en sus momentos realizaron cambios y hasta estragos en los resultados de búsqueda, ahora viene el colibrí a modificar a incluso mejorar el concepto de las búsquedas de Google.

Entonces, ¿qué es el colibrí (Hummingbird)?, sin duda es un cambio bastante profundo, ya que afecta el 90% de las búsquedas en el mundo, a diferencia del Penguin que sólo afectó al 3% de los resultados de búsqueda, Penguin estaba diseñado para eliminar los sitios de spam, el Hummingbird no está pensado en eliminar los sitios de spam, es un algoritmo especial que se centra en la inteligencia artificial y en la manera de presentar datos a los usuarios, con este algoritmo Google ofrecerá más datos más precisos a los usuarios, al responder preguntas más complejas.

Etiquetado como:

Les compartimos como inspiración en diseño industrial, algunos diseños que nos parecen de alto impacto e interés, el factor x del diseño industrial es un aspecto que debe causar alto impacto en la primera impresión, muchos diseños industriales exitosos se destacan por este factor de impactar, por supuesto que la parte funcional es importante, sin embargo esta conexión inicial entre el objeto y el espectador se genera incluso antes que el objeto sea utilizado, cuando vemos un objeto en la vitrina y pensamos que es para nosotros, es esa primera impresión que ha cumplido su propósito y nos ha incitado a tomar la decisión de compra, es este aspecto, la labor del diseño es imprescindible, un buen diseño industrial debe ser el resultado de varios factores entre los cuales se encuentran: la usabilidad, funcionalidad e impacto visual.

Etiquetado como:

Las páginas más visitadas en Colombia - Octubre 2013

Martes, 01 Octubre 2013 by Jorge Forero

 

Hoy 1ero de Octubre de 2013 les compartimos las páginas web más visitadas del momento segun Alexa, ya anteriormente habíamos publicado rankings de webs cocurridas, en esta actualización vemos algunos cambios para Colombia, sin embargo los pesos pesados de los últimos años se siguen manteniendo a la delantera, veámos como les acaba de ir en lo que queda del año y que novedades nos traen los sitios web de alto tráfico en internet.

Etiquetado como:

Que es el Diseño gráfico 3D?

Sábado, 28 Septiembre 2013 by Jorge Forero

 

El diseño gráfico 3D es una disciplina que se deriva del diseño gráfico pero se vale de recursos propios del diseño industrial y 3d, en cuanto a la comprensión del el espacio en un ámbito tridimensional, esto aumenta la cantidad de recursos y posibilidades que se pueden usar a la hora de diseñar, además que hace más pequeña la brecha entre las diversas disciplinas, aspecto originado en parte por la necesidad de encontrar nuevos campos de aplicación del diseño gráfico y el diseño 3d.

Etiquetado como:

 

Ya es bien sabida la diversion que nos aporta Google cuando cambia en ocasiones especiales o conmemorativas, su logo en su página web por un doodle animado o interactivo, varias veces nos ha sorprendido con video juegos como el caso de los olímpicos o el alien que quería retornar a casa, hoy 27 de septiembre de 2013 google nos invita a su fiesta de cumpleaños a que golpeemos la piñata y saquemos la mayor cantidad de dulces, pues hace 15 años nació Google en un garaje de Menlo Parke en Silicon Valley.

Etiquetado como:

Les compartimos esta infografía que nos parece de interés para la comunidad interesada en temas de marketing B2B, en esta infografía se destacan detalles como la importancia del contenido en las redes sociales en el cual se destacan Twitter, Facebook y Pinterest como redes sociales importantes a la hora de generar ingresos para una compañía en el marketing de negocio a negocio, la capacidad que tienen los materiales en video debe ser tenida en cuenta en el momento de crear expectativas interesantes y transmitir mensajes

Estrategia Digital, Porqué su negocio la necesita?

Lunes, 29 Julio 2013 by Maria Alejandra Rojas Matabajoy

La estrategia digital es uno de los aspectos más relevantes para tener éxito en internet. En la actualidad los usuarios necesitan información rápida pero les siguen sorprendiendo las cosas serias, por esta razón las empresas deben trabajar para tener buena reputación online; al tener los usuarios herramientas para el dialogo en la red tienen la oportunidad de hablar bien o mal de la marca, es importante establecer objetivos y construir mapas de operaciones que faciliten acertar en la toma de decisiones.

Establecer una presencia en la red requiere esfuerzo y dedicación, los resultados cualitativos empresas importan más que los cuantitativos ya que arrojan datos sobre el público al que está llegando la marca y sobre como este público está asumiéndola. El estilo de la corporación debe verse reflejado no solo en la parte conceptual, la identidad gráfica y los mensajes utilizados en su sitio web y redes sociales deben ser acordes y reflejar lo que su organización quiere ofrecer a los consumidores de la red que pueden convertirse en clientes potenciales.

El uso de medios virtuales le permite a las empresas proyectarse en todo el mundo, pero por lo general las empresas que usan la web ya sea teniendo un sitio propio, creando blogs o cuentas en las principales redes sociales les dedican poco tiempo y recursos. Las empresas que aún no hacen uso de internet afirman que no se sienten capacitadas para ello.

Etiquetado como:

El Diseño Web en Colombia

Jueves, 11 Julio 2013 by Jorge Forero

El papel de los diseñadores de websites colombianos

En Colombia el diseño web es una rama en constante aumento y en este año 2013 vemos un auge en nuestro país de esta disciplina. Las ventajas de emprendimiento que presenta nuestro país le dá a los diseñadores web gran ventaja a la hora de crear empresa y eso es una ventaja. Es por esto que cada vez más crecen las redes de freelancers en américa latina y a través de ellas el networking entre países a avanzando.

El creciente intercambio de Colombia con naciones como por ejemplo Estados Unidos, países centro americanos e incluso España y Europa, y la buena respuesta con trabajos de calidad y a precios competitivos, nos abre las puertas al mundo y se empieza a ver una tendencia como lo que pasa por ejemplo en India y China, que son países que, al tener un bajo costo en programación y alta competencia, le ofrecen a las "Grandes Potencias" trabajos de buena calidad a precios competitivos.

Debido a que el mercado local colombiano de las páginas web tiende a la saturación, los diseñadores web colombianos debemos mirar cada vez a tener nexos y ofrecer servicios a empresas en el exterior y para poder seguir siendo competitivos en un entorno local hay que ofrecer un producto de mejor calidad y diferenciador frente a la competencia.

Es importante el aspecto del valor agregado que le imprimimos a nuestros productos, la posibilidad de ofrecer servicios integrativos también amplía las ventajas a la hora de poder integrar paquetes de servicios que puedan satisfacer las expectativas de los clientes.

En dweb3d estamos comprometidos con nuestra nación y con ofrecer siempre los servicios de la mejor calidad, servicios con valores agregados como la posibilidad de ofrecer páginas autoadministrables, incluir capacitación para que el usuario final actualice sus páginas web, incluir consejos de posicionamiento e integrar un blog corporativo a nuestras páginas, así como la integración de lo que se conoce como web 3d y diseño gráfico 3d, disciplinas que integran el diseño web y el diseño web.

Como parte de nuestra visión, está la posibilidad de formar redes, vínculos y alianzas estratégicas, con empresas nacionales e internacionales para dar a conocer la calidad e impacto de nuestros diseños dentro y fuera del país.

Con integración de los sitios diseñados con estrategias digitales que incluyen marketing online, publicidad en google adwords y social media, optimización en motores de búsqueda (posicionamiento seo), interconexión con redes sociales, blogging corporativo, y técnicas como el email marketing, hará que sus webs sean de alto impacto y aumenten su tráfico.

Etiquetado como:

Bienvenidos a la nueva plataforma de Dweb3d.com

Martes, 11 Junio 2013 by Jorge Forero

Con el fin de mejorar nuestros servicios y la atención a nuestros actuales y futuros clientes les presentamos la nueva Dweb3d.com

En la nueva versión de nuestra página web, podrán explorar el estilo fresco y profesional que les traemos para este año 2013, siéntanse libres de opinar sobre como le parece esta nueva versión de dweb3d con respecto a la anterior, siempre nos estamos esforzando por mejorar la calidad de nuestros productos y servicios, los invitamos a explorar las nuevas secciones de nuestro website.

Página 1 de 2

Comparte Este Blog

Calendario de Publicaciones

« Julio 2014 »
Lun Mar Mier Jue Vie Sáb Dom
  1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31      

Comentarios

Qué espera para empezar?

Necesita una página web que optimice sus ventas?Descubra la importancia de un sitio web optimizadoSolicitar cotización de nuestros servicios web y 3d

CONTACTO

Jorge Enrique Forero 3D & Web Design, UX, SEM
Tels: +571 803 05 29 +57 310 696 92 16
Email:
Skype: jorge.forero.design

Dweb3d contrate nuestros servicios de websites y marketing digitalContáctese con dweb3d

SUSCRÍBASE Y COMPARTA EN SOCIAL MEDIA
Scroll to top