Orientado al desarrollador CSS/HTML tutorial/libro

Soy un desarrollador de software que de vez en cuando escribir CSS o código HTML. Actualmente estoy trabajando en una aplicación que requiere bastante complicado html/css basado en el diseño y siento que no entiendo CSS/HTML layout suficiente para ponerlo en práctica. Qué libros y tutoriales ¿me puede recomendar para mejorar mis habilidades?

P. S. I a entender la diferencia entre bloque y elementos en línea es, lo que flota, etc, pero lo que me falta es una imagen coherente de cómo funciona y de cómo a la disposición arbitraria de cosas en html/css.

P. P. S. he probado varios libros antes y que tiene un manual de referencia (formato como este: http://www.amazon.com/Pro-CSS-HTML-Design-Patterns/dp/1590598040) o que contienen información que ya conozco, por ejemplo, la mayoría de los tutoriales básicos en w3schools, la mayoría de los libros para dummies en amazon, etc, o incluso peor, el diseñador de la orientación. No necesito leer acerca de los colores, etc, solo me falta aprender a hacer maquetación en HTML/CSS como yo lo hago en Java/Swing o similares de otros marcos.

  • trate de Lynda.com tutorial básico. Creo que es un gran tutorial.
  • Ya sé lo que contiene. Necesito algo más de información de nivel bajo. Algo así como el libro que he mencionado en el post, pero más legible.
  • Echa un vistazo positioniseverything.net – es una forma más avanzada de sitio, y que descomponen los pequeños matices en navegadores específicos y las maneras de solucionarlos (incluyendo formas de hacerlo sin tener que recurrir a hacks). Me ha ahorrado muchas horas mirando allí para ayudarle a solucionar los problemas de procesamiento.
  • Algunos buenos tutoriales sobre posicionamiento y flotante: alistapart.com/author/nstokes. Además de eso, el más completo tutorial que he encontrado es sitepoint.com/web-foundations/css-layout-formatting.

7 Kommentare

  1. 42

    Déjenme comenzar esta diciendo que prefiero buscar material de referencia en línea, según sea necesario (yo almaceno mi conocimiento en la nube) en lugar de aprender de memoria un libro entero sobre las propiedades css que podría parecer totalmente fuera de contexto; al mismo tiempo me resulta más beneficioso para leer profundamente en el más alto nivel de la teoría y guías, sea de artículos o libros.

    Le han dado una amplia styleguide o tal vez incluso un par de maquetas y ahora depende de usted para hacer en html+css? En este caso te sugiero que

    • Hechos a mano de CSS: Más a prueba de Balas de Diseño Web – por encima de todo, cubre algunos de los más «hip» de técnicas como el diseño líquido y hace que usted se sienta cómodo con el concepto de degradación (lo que significa que IE6 y FF10 debe no ofrecer la misma experiencia). Esto le ahorra el dolor de cabeza y dificultades en el largo plazo – el mío era tan popular que un colega tomó el extranjero… para ocho meses
    • CSS: The Missing Manual y HTML, XHTML y CSS de la Biblia – muy en profundidad y el material, sin embargo, hay que ser obsoleto. Te sugiero leer sobre flotadores de primera (de muchas peculiaridades allí, independientemente de la experiencia previa) y cualquiera de los capítulos iba a llenar las lagunas de conocimientos que usted siente que puede, si cualquier. Más allá de que – se utiliza como referencia.
    • Cómodo con los conceptos generales, pero la necesidad de buscar una ocasional de la propiedad? En primer lugar, w3schools están mal uso MDN lugar. Relacionado: fantástico JS de referencia así como de CSS/HTML que usted está después.
    • Marcador quirksmode y caniuse para que no se vuelva demasiado lejos cuando un navegador de repente se niega a dejar a su cincelado código correctamente.
    • Marcos de investigación que están ahí fuera. De sistemas de red sería una fantástica manera de ahorrar tiempo si el diseño se adapta; cubierto con jQuery-UI o formalizar que tendría la común rastas cuidados para usted (mirando a usted, diseños!).

    Si quieres profundizar y tener una mejor comprensión de los principios de diseño y usabilidad de los conceptos que hay detrás de un producto de éxito, o si usted está todavía vienen con tramas/página de maquetas etc., la lista de lectura expande:

    Y recordar stackoverflow – si he encontrado con un problema, alguien probablemente ya ha resuelto 🙂

    • Te recomiendo que para agregar este nuevo sitio web llamado SnoopCode. Esta es la manera mejor que w3schools o cualquier otra cosa por ahí. snoopcode.com
    • «w3schools son malos «, que escribió, no descuidado, no está mal, no está pasada de moda, pero el mal, lo que implica un plan para dañar a los demás. Lo que justifica su calificación de =mal=?
  2. 5

    Recomiendo la lectura de http://www.html5rocks.com/en/tutorials/internals/howbrowserswork/.

    No es un artículo pequeño. Es un muy detallado, bien pensado artículo, que describe varios aspectos del navegador. Los siguientes pueden ser de su interés:

  3. 3

    Si quieres saber cómo CSS trabajo de diseño. Hay un buen tutorial por google

    http://code.google.com/edu/submissions/html-css-javascript/

    & como usted dijo que usted sabe lo que es CSS. Así que, es mejor aprender a evitar los errores comunes que se hizo por los principiantes. hay varias ir de artículos sobre eso. Hay pocos :

    http://sixrevisions.com/css/12-common-css-mistakes-web-developers-make/

    http://webdesignledger.com/tips/the-most-common-html-and-css-mistakes-to-avoid

    http://www.designdetector.com/2006/06/ten-common-css-mistakes.php

    • Los enlaces están muertos pero estoy asumiendo que te refieres a estos: churchm.ag/…
  4. 3

    Le sugiero que eche un vistazo a este tutorial

    Es una de los 30 días de HTML/CSS Curso de Jeffrey Manera, se explica todo lo que necesitas muy buena y en una forma agradable y lo mejor es que es gratuito (es necesario registrarse para obtener una cuenta gratuita, que se encuentra en la esquina superior derecha).

    Alternativa:

    Pero hay muchos muchos muchos recursos para aprender html y css en la web.

    • Parece un buen tutorial de introducción, pero no es lo que yo quería. Necesito un bajo nivel de descripción de navegador algoritmo de diseño.
    • No se trata de un completo bajo nivel de descripción ! Usted va a aprender todo desde el principio. ¿Cuáles son las carrozas, ¿cuáles son los elementos en línea y así sucesivamente !
    • +1 a learncss.tutsplus.com … fácilmente el mejor tutorial para aprender todo lo que necesita para knw. Confía en mí @KonstantinSolomatov , si usted no consigue lo que desea a partir de ese curso, yo le dará 30 días atrás.
    • gracias por tus responder, pero no había upvote 😉
  5. 1

    Yo prefiero los libros de texto. Usted puede utilizar postit notas a poner la página de marcadores en ellos (cualquiera puede leer en el baño!).

    Como a uno para CSS – CSS La falta del manual que he encontrado bastante bien

    HTML – El Resumen de los libros (que siempre he encontrado buena) es buena.

  6. 0

    Acaba de ir a leer sobre cómo el DOM (document object model) de las obras. Cosa más importante a saber es que el código html se analiza de arriba abajo, y que es donde el conocimiento de la posición de los elementos también será muy útil. La construcción de un esquema será muy fácil con esto en mente, y también si usted mantiene una cuadrícula como la estructura de la mente. También leer sobre las mejores prácticas en materia de accesibilidad.

    También he leído algunos buenos artículos técnicos/tutoriales/etc en el IBM developerworks sitio.

    Todo lo que necesitas está en Google, creo que es simplemente una cuestión de usar las palabras clave adecuadas 🙂

    • Así que DOM funciona muy fácilmente, es sólo un AST. El problema está en el diseño. Que las especificaciones de hacer que me recomiendan para leer? CSS+HTML especificaciones son más de 1000 páginas, me va a tomar mucho tiempo para leer, sobre todo si tengo en cuenta lo difícil de leer tales especificaciones son.
    • No estoy seguro de entender lo que quiere… ¿desea información sobre cómo crear un HTML/CSS front-end? O, ¿quieres saber cómo un navegador va sobre el análisis de HTML y CSS? Si es la primera, entonces la cosa más importante es tener en mente html se analiza de arriba abajo, y luego sólo tienes que seguir cuadrícula-como la estructura y mantener en la mente la forma en CSS agrega propiedades de los elementos HTML, como de posicionamiento. Por desgracia esto va a ser un ejercicio visual así que tendrás que tener con los colores etc también 🙂 de lo Contrario, basta con mirar en Twitter Bootstrap CSS 960 grid marco de HTML o de texto repetitivo y CSS reset para iniciar
    • Cómo CSS/HTML el análisis de las obras es muy fácil para mí. Lo que no entiendo son las reglas de CSS diseño del motor. Que lo que me falta para crear componentes que quiero.
    • Ok dame un ejemplo, entonces podemos mejor guía a la derecha de los recursos. Suena como que usted está buscando técnicos docs aunque también suena como que no es lo que estás buscando.. 🙂
    • Aparte de las especificaciones, CSS: La Guía Definitiva es, probablemente, el más completo de los recursos.
    • Así que aquí está un ejemplo de una pregunta que quiero ser capaz de responder después de leer el tutorial: stackoverflow.com/questions/9735076/…

Kommentieren Sie den Artikel

Bitte geben Sie Ihren Kommentar ein!
Bitte geben Sie hier Ihren Namen ein

Pruebas en línea