-
Como podemos tornar o site melhor, mais adequado aos padrões W3C e ter uma boa experiência do usuário? Este é um problema enfrentado por muitos produtores de páginas da web e também é algo que todos desejam saber. no trabalho prático de longo prazo, espero que possa ser útil para todos. Por favor, critique e corrija quaisquer deficiências.
1. Compreender o tema do site, esclarecer o conteúdo exibido no site e a maioria dos grupos de navegação
Se você deseja construir um site que seja útil para os usuários, você deve primeiro considerar o conteúdo e as funções do site. O que os usuários precisam? Como eles podem encontrar o que desejam com rapidez e facilidade? Tudo deve ser feito em torno deste aspecto. Se os usuários não conseguirem o que desejam rapidamente ou se seu site não for fácil de usar, ele será um fracasso. Os usuários ficarão desapontados e talvez nunca mais façam login no seu site. Um pequeno exemplo: Se você quer fazer um site de ações, mas o tamanho da fonte do site é 12px, pense bem, a quantidade de idosos que se aposentam em casa e especulam em ações não é um número pequeno, mesmo que seu site conteúdo Por melhor ou mais incisivo que seja, é impossível para eles segurar uma lupa no monitor e olhar o seu site. O resultado será apenas a perda de um grande número de usuários.
2. Combinação de cores razoável
Para um web designer, o processo de design é doloroso e prazeroso. Depois de descobrir que tipo de site você deseja fazer, você terá que passar por um processo de seleção de cores e layout para refletir o tema de forma mais razoável. Pessoalmente, acho que se você não está construindo um site superpersonalizado, a correspondência de cores não é uma tarefa difícil. Primeiro, identifique a cor principal. Na verdade, as características da cor da indústria não são muito importantes. É apenas a percepção das pessoas sobre uma indústria que cria a relação entre a indústria e a correspondência de cores. Por exemplo, se você estiver construindo um site de hotel, é claro que não pode ser vermelho. ? Na verdade, tudo se resume à percepção das pessoas, porque ambos pensávamos que o vermelho era uma cor festiva e, portanto, inadequada para uma casa funerária. Por exemplo, o azul geralmente é melhor para sites de tecnologia ou baseados em tecnologia, o rosa é melhor para sites femininos, etc. Em segundo lugar, cores auxiliares e cores de acabamento Para confirmar a cor principal de um site, também são necessárias cores auxiliares e cores de acabamento. As cores auxiliares usam principalmente a mesma combinação de cores e combinações de cores adjacentes. A mesma correspondência de cores é obtida alterando a transparência, saturação, clareamento ou escurecimento da cor principal. A correspondência de cores adjacentes é baseada na cor principal, utilizando cores adjacentes na roda de cores, como vermelho e laranja. A cor de acabamento geralmente é bem diferente da cor principal. Geralmente é utilizada nos conteúdos ou botões mais importantes da página web. Sua função é atrair a atenção do usuário e limpar o cansaço visual da página web. razoavelmente para evitar muita aparência, caso contrário será contraproducente.
3. Bom layout web
Os elementos que devem ser compreendidos no layout de uma página web são prioridades claras, coordenação e organização, respeito pelos hábitos visuais dos usuários e organização razoável do conteúdo. Exiba o que os usuários desejam primeiro, tanto quanto possível, e preste atenção aos possíveis comportamentos de orientação dos usuários. Como diz o ditado: Uma boa memória não é tão boa quanto uma caneta ruim. Ao projetar a interface de um site, devemos primeiro usar um lápis para esboçar o layout do site e, em seguida, usar um software de desenho para criá-lo e modificá-lo após atingir o objetivo. efeito desejado. Os detalhes determinam o sucesso ou o fracasso nas renderizações do design, use o mínimo possível de blocos de cores grandes, destaque a navegação e tenha seções claras para obter um efeito limpo, conciso, organizado e coordenado. Por exemplo, a barra de navegação deve ser apropriadamente adicionada com efeito de mouse; as linhas da página web devem evitar muita diferença de cor, o contorno e a sombra não devem ser muito óbvios, se estiverem presentes ou não, é melhor; imagens e textos; o espaçamento entre as seções da página web deve ser razoável e uniforme; um lado e mais claro do outro, ou como uma fita enrolada em um objeto, o ponto de viragem deve ser ligeiramente saliente e ter uma sombra arredondada sutil)...
Após confirmada a produção das renderizações da página web, iniciaremos a produção da página html.
4. Título e meta da página da web
O título e a meta da página da web devem ser baseados nas colunas básicas e nas páginas de conteúdo. Não use o mesmo formato para todo o site. Você não precisa adicionar palavras-chave, o que tem pouco efeito nos mecanismos de pesquisa. empilhamento de palavras-chave.
5. Uso de tags h1-h6
Uma tag h1 de página da web só pode ser usada uma vez. Na página inicial, na página do canal e na página de lista de um site, a tag h1 pode ser usada para o nome do site, o nome do canal e o nome da lista de colunas, respectivamente. No entanto, na página de detalhes do artigo de um site, a tag h1 deve. ser usado no título do artigo. As tags h2-h6 podem ser usadas repetidamente em uma página, obedecendo, por sua vez, à hierarquia do site.
6.Arquivos CSS
Tente importar arquivos CSS de fora usando links e escreva um reset.css que você costuma usar para redefinir o estilo CSS. Evite usar *{}. Escreva um estilo em uma linha para reduzir o tamanho do arquivo. Tente usar definições de classe e reduzir definições de id. Tente evitar técnicas de hack de CSS para navegadores diferentes.
7.Otimização de imagens de fundo
Além do conteúdo real do site, as imagens utilizadas no frame devem ser definidas no arquivo css tanto quanto possível. De acordo com a situação real, a imagem de fundo deve ser mesclada o máximo possível para melhorar a velocidade de carregamento. É melhor não colocar uma imagem muito pequena lado a lado em uma área maior.
Layout 8.div + css para reduzir o aninhamento de páginas
O objetivo de usar o layout div+css é reduzir o código da página, tornar a estrutura do site hierárquica e separar conteúdo e apresentação. Reduzir o aninhamento não é apenas amigável para os mecanismos de pesquisa, mas também ajuda a reduzir o tamanho da página e facilita a manutenção e modificações subsequentes.
9. Otimize a página js
Os arquivos JS que podem ser mesclados são mesclados em um só, reduzindo loops em grande escala e referências hierárquicas excessivas e melhorando a velocidade de carregamento e execução.
10. Evite links mortos e conexões vazias
Seria muito frustrante para os usuários se, ao clicar em um artigo desejado, abrisse apenas "Esta página não pode ser exibida".
11. Texto e gráficos apropriados
Não preencha deliberadamente seu site com imagens. Os mecanismos de pesquisa não reconhecem imagens, exceto o atributo alt. Adicionar imagens em locais apropriados pode ajudar a atrair visitantes e eliminar o cansaço de ler textos longos.
12. Requisitos para imagens de páginas da web
Adicione atributos alt e atributos de largura e altura às imagens da página da web. Não comprima as imagens deliberadamente para garantir que a exibição da imagem não seja deformada.
13. Teste seu site em diferentes navegadores.
Para permitir que mais pessoas naveguem em seu site normalmente, teste sua página com diferentes navegadores convencionais para garantir que seu site funcione normalmente.
14. Aprovado na verificação W3C.
http://jigsaw.w3.org/css-validator/validator.html#validate-by-uri
Espaço pessoal do autor tomate