remodelacion de mi web, consejos ?

[anibal_cdf]

buenas, no soy nuevo en el foro pero cambie de usuario porque el anterior no lo pude recuperar(anterior: ardid)
Les cuento que estoy con ganas de remodelar mi sitio web (busquen en google argentina club del fiat si lo quieren ver)
Actualmente esta hecho medio a los golpes. El tema es que un amigo me ayudo con el codigo y funciones php y yo fui haciendo el html y las imagenes.
El asunto es que quiero hacer todo de cero de nuevo, motivos:
1) el codigo es muy rebuscado y confuso, tiene clases y funciones que ni se usan ( al parecer uso todas librerias que el tenia pero que a mi no me sirven), por lo cual quiero hacer todo el codigo yo de nuevo por uno simple y que se entienda.
2) el diseño ya me cansó, quiero hacer un diseño mas vistoso y mas facil e intuitivo.
3) quiero empezar a usar por ejemplo ajax para el tema de formularios y listados.
4) tengo idea de agregar al listado de socios diferentes filtros, ordenes, y ademas al perfil del socio agregarle fotos.

queria saber si me podrian dar consejos, sugerencias, y algunas pistas para arrancar bien con este tema :D

PD: lo que voy a usar es php+mysql+javascript/ajax (sin flash/swf)


Saludos y Gracias de antemano

[Shade]

Si vas a usar ajax/javascript personalmente te recomendaria fijarte en yahoo yui, tiene TODO lo que puedas llegar a necesitar, sus triggers son de lo mejorcito que he visto la verdad.

[anibal_cdf]

hay algun link aca para ver ejemplos de usos del yahoo yui ? yo solo vi ejemplos del isiajax (que vi q el creador postea aca) y un par mas de ejemplos

estuve viendo aca : developer.yahoo_com /yui/examples/ pero no veo bien para que sirven ... o que uso le puedo dar

[JavierGuerrero]

Hola, anibal_cdf.

Sería interesante que utilices un método para el desarrollo de tu sitio web. Básicamente podrías seguir este:

1. Planificación:
   • Definición de objetivos y audiencia
   • Contrucción de un mapa del sitio
   • Elaboración de los wireframes
2. Diseño:
   • Definición del aspecto visual
3. Codificación:
   • XHTML + CSS
   • Adaptación a un CMS (Drupal, Joomla)
4. Implementación:
   • Subir el sitio al servidor
5. Promoción:
   • Atraer tráfico a nuestro sitio web construido
6. Administración y mantenimiento:

Después de haber planeado adecuadamente y definir el diseño de tu sitio, es el momento de entrar a la etapa de codificación la cual podrías dividir en dos partes:

1ra: Pasar tu diseño (boceto) a código XHTML + CSS
2do: Adaptar tu código anterior a un CMS, me parece lo más adecuado para fines de administración.

Centrándome en la primera parte de la codificación, te recomendaría que escribas tu código en tres capas:

• Estructura - XHTML
• Apariencia - CSS
• Comportamiento - JavaScript

De esta manera escribirás un código limpio con grandes ventajas para el mantenimiento.

Saludos cordiales,

Javier Guerrero.

[anibal_cdf]

Iniciado por JavierGuerrero

Hola, anibal_cdf.

Ya que decidistes remodelar tu sutio web, te recomendaría que a la hora de escribir tu código lo hagas separando en tres capas:

• Estructura
• Apariencia
• Comportamiento

perfecto, cosas asi busco que me digan.
estuctura seria "template" / armado / esqueleto ? o sea html con tablas por ejemplo y eso ?
apariencia seria los css ?
comportamiento , serian los javascripts y funciones o clases ?

mi idea es hacer con css los estilos de colores y demas, con html/php hacer el codigo y estructura y en un .js meter las funciones de javascript

[anibal_cdf]

Iniciado por JavierGuerrero

Hola, anibal_cdf.

Sería interesante que utilices un método para el desarrollo de tu sitio web. Básicamente pordrías seguir este:

1. Planificación:
   • Definición de objetivos y audiencia
   • Contrucción de un mapa del sitio
   • Elaboración de los wireframes
2. Diseño:
   • Definición del aspecto visual
3. Codificación:
   • XHTML + CSS
   • Adaptación a un CMS (Drupal, Joomla)
4. Implementación:
   • Subir el sitio al servidor
5. Promoción:
   • Atraer tráfico a nuestro sitio web construido
6. Administración y mantenimiento:

agregaste data jeje
te respondo a esto ahora ...
con mapa del sitio a que te refieres ? a las secciones del sitio ? al "arbol" por asi decirle ?
wireframes ni idea que es ...
porque dices adapatacion a un cms ? no me gusta usar cms, lo que si uso es vbulletin que ya compre la licencia y lo tengo funcionando
sobre el mantenimiento y administracion me gustaria esta vez hacer un backend, ya que actualmente manejo todo por ftp y phpmyadmin , no tengo back salvo en el foro

[Shade]

En este enlace tienes varios ejemplos del autocomplete de yahoo yui (la mayoria tienen efectos de expandido lo cual hace que se desplieguen bastante lento, pero puedes sacar todo ese tipo de efectos)

http://developer.yahoo.com/yui/examp...ete/index.html

Y aqui tienes el resto de cosas que puedes hacer con yui:

http://developer.yahoo.com/yui/

Fijate en la barra de la izquierda que te llevara a cada seccion, donde tendras ejemplos y ayuda. El unico problema es que la integracion no esta muy bien explicada, pero si tienes un poco de idea no es dificil.

[anibal_cdf]

Iniciado por Shade

En este enlace tienes varios ejemplos del autocomplete de yahoo yui (la mayoria tienen efectos de expandido lo cual hace que se desplieguen bastante lento, pero puedes sacar todo ese tipo de efectos)


Y aqui tienes el resto de cosas que puedes hacer con yui:


Fijate en la barra de la izquierda que te llevara a cada seccion, donde tendras ejemplos y ayuda. El unico problema es que la integracion no esta muy bien explicada, pero si tienes un poco de idea no es dificil.

la %$)%!"#%$#!"%!" , te respondi el mensaje y como no puedo incluir links me borro todo GRRRRRRRR

bueno despues de descargarme te cuento que estuve mirando eso pero por ejemplo el autocompletar no creo necesitar usarlo en un ppio , ademas navegue por yahoo.com o .com.ar mirando mas detallado el diseño, y vi que es muy lindo eso de cuando estas sobre MESSENGER o CORREO se abre para abajo un cuadro de explicacion, tambien las noticias del medio de la web que tienen solapas, esas cosas si seguro me sirven, pero no lo vi en el YUI ...

[JavierGuerrero]

Hola

Siguiendo con el consejo de separar en capas nuestra codificación, utiliza cada tecnología adecuadamente, según su función, es decir:

XHTML para definir la estructura del sitio, como lo dijistes, el esqueleto. Cuando construyas la estructura ten presente en utilizar las etiquetas según su significado, es decir, realiza un marcado semántico. Otro detalle importantísimo es que tu código debe ser lo más optimo posible, utilizando las etiquetas absolutamente necesarias considerando los estándares establecidos por el W3C.

CSS para determinar la apariencia del sitio además de la maquetación. Considerando el principio de separación colocas todas tus reglas de estilo en un archivo .css, de esta forma sólo bastaría un enlace para las hojas de estilo. Para una mejor organización te recomendaría que uses la técnica de CSS modular.

Javasript para definir el comportamiento, la interactividad utilizando
AJAX, por ejemplo.

Bueno, lo mejor sería que te leas este librito:

ppk on JavaScript

Hay una sección que habla sobre la separación en capas.

Saludos.

Javier Guerrero

[anibal_cdf]

Iniciado por JavierGuerrero

Hola

Siguiendo con el consejo de separar en capas nuestra codificación, utiliza cada tecnología adecuadamente, según su función, es decir:

XHTML para definir la estructura del sitio, como lo dijistes, el esqueleto. Cuando construyas la estructura ten presente en utilizar las etiquetas según su significado, es decir, realiza un marcado semántico. Otro detalle importantísimo es que tu código debe ser lo más optimo posible, utilizando las etiquetas absolutamente necesarias considerando los estándares establecidos por el W3C.

CSS para determinar la apariencia del sitio además de la maquetación. Considerando el principio de separación colocas todas tus reglas de estilo en un archivo .css, de esta forma sólo bastaría un enlace para las hojas de estilo. Para una mejor organización te recomendaría que uses la técnica de CSS modular.

muchas gracias por tus ayudas !!!

ahora, sobre css solo conozco q se podia poner colores a letras, backgrounds, etc, no entiendo bien a que te refieres ...

sobre xhtml no se nada de nada, yo solo se php y html basico, o sea lo que sale en frontpage/dreamweaver con la edicion normal poniendo tablas, frames, etc.

[JavierGuerrero]

Si decides convertirte en un desarrollador web, te recomiendo empieces por documentarte.

El error de muchos es no tomar en serio XHTML, te sugiero que leas:

HTML & XHTML: The Definitive Guide

O si no empieza a buscar material en internet, hay muchísimo al respecto.


Saludos

Javier Guerrero

[anibal_cdf]

voy a buscar sobre eso y mas documentos, encontre uno muy bueno q empieza de cero en wikilearning

estoy buscando informacion (se agradece todo lo que puedan) sobre como empezar a hacer la web de cero con buen orden, completa y profesional, ya sea con sitemaps, rss, dhtml, xhtml, etc.