Links úteis de HTML / CSS

Code Fellows UX Dev Journey de Max Brockman

Links superúteis para Front End Web Development!

Estou no acelerador de desenvolvedor de UX de front-end do Code Fellow há algumas semanas, e algumas das informações mais úteis que aprendi é uma vasta biblioteca de sites realmente excelentes que falam sobre web design. Esta é uma lista muito curta agora, mas irei atualizá-la com a maior frequência possível. TAMBÉM, eu adoraria que alguém lendo isto adicionasse um link para algo que considerou útil na seção de comentários. Basta colocá-lo lá, porque você nunca sabe o quanto pode ajudar alguém em uma situação difícil. ~ Max

<ul> <li> <a href=” http://learn.shayhowe.com/”> Um guia prático para HTML e CSS </a> foi escrito por Shay Howe. É um ótimo ponto de partida para qualquer pessoa que queira saber onde está sua habilidade de codificação. </li>
<li> <a href = ” http://daneden.github.io/animate.css/ ” target = ” blank “> Animate.css </a> é uma ótima página que mostra o código das animações que você deseja usando apenas CSS. </li>
<li> <a href =” http://caniuse.com/ “target = “
blank”> CanIuse.com </a>
http://css-tricks.com/snippets/css/a-guide-to-flexbox/”>Flex-Box </a> é a solução para todos os seus problemas de posicionamento de CSS. Posso apenas criar um cabeçalho com alguns elementos que respondem ao tamanho e são fáceis de centralizar? Agora você pode. </li>
<li> <a href = ” http://code.tutsplus.com/tutorials/the-30-css-selectors-you- must-memorize – net-16048 “> 30 seletores CSS que você deve memorizar </a> é uma lista incrivelmente útil de seletores CSS avançados que você pode usar para tornar seu layout infinitamente mais sexy e bem escrito. </li>
<li> <a href=” http://css-tricks.com/ “target=” blank”> CSS-Tricks </a> é uma página realmente útil e constantemente atualizado sobre CSS …truques … </li>
<li> <a href = “http://csswizardry.com/ “target =”
blank “> CSS Wizardry </a> Harry Roberts é um grande jogador no mundo do front-end. Veja o que ele tem a dizer. Provavelmente é importante. </li>
< li> <a href=” http://pumpula.net/p/apps/css-vocabulary/”> Vocabulário CSS <a/> Usa uma tecnologia incrível para destacar todo o vocabulário de seletores de que você possa precisar. Este é um INCRÍVEL ferramenta. </li>

<li> <a href=” http://css-tricks.com/dom/”> Document Object Model ou DOM, o que é isso? </a> Esta é a bela explicação de Chris Coyier sobre o quê o DOM realmente é. </li>
<li> <a href = “ http: //media.smashingmagazine.com / wp-content / uploads / images / html5-cheat-sheet / html5-cheat-sheet.pdf “target =”blank “> Folha de referências HTML5 </a> lista de tags html5. Pode ser muito útil para escrever HTML semanticamente correto. </li>
<li> <a href =” http://gsnedders.html5.org/outliner/ ” > HTML5 Outliner </a> é uma ferramenta na qual você cola seu HTML e o divide em um esboço gerado pelo leitor. Esta é uma ótima ferramenta para julgar o quão <strong> semanticamente </strong> corrigir seu HTML realmente é! < / li>
<li> <a href=” http://learnlayout.com/”> LearnLayout.com </a> ensina o mundo aparentemente difícil de usar CSS para layout. Siga as 19 etapas 19 vezes, e então você deve estar ok. </li>
<li> <a href = ” http: // lab.maltewassermann.com/viewport-resizer/ “target =”
blank “> Resizer </a> é uma ferramenta incrível criada por <a href=” https://twitter.com/maltewassermann” target=” blank”> Malte Wassermann </a> para mostrar tamanhos de tela ajustáveis. Isso empresta seu auto de web design responsivo bem. </ li>
<li> <a href=” http://css-tricks.com/responsive-data-tables/ “target=”
blank”> Tabelas Responsive </a> um css artigo de truques sobre a criação de tabelas responsivas que ficam bem em dispositivos móveis e comp. </li>
<li> <a href=” http://smacss.com/”> Arquitetura escalonável e modular para CSS </a> é uma abordagem para o desenvolvimento web escrito por Jonathan Snook.uma leitura rápida que vale a pena. </li>
<li> <a href = “http://screensiz.es/phone “target =” blank “> Tamanhos de tela </a> uma lista de tamanhos de tela para cada dispositivo relevante lá fora! </li>
<li> <a href =” http: // csslint.net/ “target =”
blank “> CSS Lint </a> é uma ferramenta incrível para limpar seu CSS. A redundância é o inimigo aqui. Estamos aprendendo a utilizar completamente nosso código para eficiência e legibilidade para humanos e máquina. </li>
<li> <a href=” http://sassmeister.com/”> Sass Meister </a> é um projeto que nosso destemido líder <a href = ” https://twitter.com/ anotheruiguy “> Dale Sande </a> é uma parte importante de.Ferramenta muito valiosa se você usa Sass para escrever CSS. </li>
</ul>