[Resolvido] Site on-line

[veaoum]

Boas não sei se é aqui que posso colocar isto mas gostava de ter o feedback de alguém que perceba de sites. Aqui está o meu primeiro site: http://www.mcccorreia.com e gostava que caso alguém possa passe lá para que possam criticar para que eu tente melhorar e corrigir. Desde já o meu obrigado ao tempo que dispensarem.

[HappyHippyHippo]

pontos relevantes :

- o footer está estranho (descentrado de uma forma estranha e colado ao conteúdo)

- os inputs (formulário de contactos) não seguem todos o mesmo estilo e não estão alinhados

- os textos de menu não estão centrados, principalmente no submenu onde estão mesmo fora da posição correcta

- a cor do submenu vai de um rosa claro a um rosa ainda mais claro, ao ter texto branco tornasse complicado ver (tenta dar sombra ao texto)

pontos de gosto

- a imagem de header parece demasiado grande, talvez porque o texto está descido o que faz parecer ter espaço no topo desnecessário

- não sei que tipo de funcionalidades tem/deverá ter o site, mas tirando a página de contactos, o resto parece ser somente páginas com conteúdo textual com uma imagem, se bem que não seja problemático, dá uma sensação de escassez e limitado

- o que está na moda são ligações a redes sociais (facebook, twitter, etc ,etc ...)

[veaoum]

- o footer está estranho (descentrado de uma forma estranha e colado ao conteúdo)

O footer está depois do menu. Achas melhor alinhado ao menu? quanto ao colado acho que tens razão vou afastar um bocado.

- os inputs (formulário de contactos) não seguem todos o mesmo estilo e não estão alinhados

Aqui não percebi o que quiseste dizer com isto.

- os textos de menu não estão centrados, principalmente no submenu onde estão mesmo fora da posição correcta

O menu aparece-me nos sítios certos.... o submenu está alinhado com o primeiro submenu. Qual é o navegador que usas para a net?

- a cor do submenu vai de um rosa claro a um rosa ainda mais claro, ao ter texto branco tornasse complicado ver (tenta dar sombra ao texto)

E se trocar dará em vez de ser rosa claro a um rosa ainda mais claro ir de rosa ainda mais claro a um rosa claro, achas que ficava mais legível?

- a imagem de header parece demasiado grande, talvez porque o texto está descido o que faz parecer ter espaço no topo desnecessário

- não sei que tipo de funcionalidades tem/deverá ter o site, mas tirando a página de contactos, o resto parece ser somente páginas com conteúdo textual com uma imagem, se bem que não seja problemático, dá uma sensação de escassez e limitado

- o que está na moda são ligações a redes sociais (facebook, twitter, etc ,etc ...)

No primeiro a solução pode passar por colocar o logo mais para cima, não?

No segundo Foi o que me foi pedido tipo queriam um site basico e sem mais nada apenas texto.

No terceiro colocar no footer ligações para as redes sociais, certo?

Edited March 8, 2013 at 07:13 PM by veaoum

[pwseo]

Uma questão não necessariamente relacionada com o site... o domínio é mcccorreia.com mas a empresa chama-se apenas MCCorreia? (o domínio tem um 'c' a mais).

De resto, vou comentar os seguintes pontos

• Como já foi dito, a imagem de header é demasiado grande e empurra todo o site para baixo, o que é muito desagradável, especialmente em ecrãs mais pequenos (eu tenho 1280x800)
  
• Contrastando com o header gigantesco, o footer está demasiado pequeno, mal centrado e demasiado perto do conteúdo. Deveria também ter uma cor mais clara.
  
• A página tem uma margem branca desagradável (default nos browsers, deverás corrigir isso com CSS)
  
• A barra lateral faz uma transição má da curva para a linha recta
  
• Estás a utilizar demasiadas imagens com texto. Não há problema em usar imagens -- o problema surge quando usas imagens para certas coisas que deveriam ser feitas com elementos <h1>, <h2>, etc, como por exemplo os títulos das secções (pois só dessa forma o Google indexará correctamente)
  
• Tens que rever o CSS para não dependeres dos estilos default dos browsers
  

Edited March 8, 2013 at 06:57 PM by pwseo

[veaoum]

Uma questão não necessariamente relacionada com o site... o domínio é mcccorreia.com mas a empresa chama-se apenas MCCorreia? (o domínio tem um 'c' a mais)

Completamente de acordo mas isso ultrapassa-me 🙂

Edited March 8, 2013 at 06:53 PM by veaoum

[pwseo]

Completamente de acordo mas isso ultrapassa-me 🙂

Pois, imaginei que sim, mas não pude deixar de comentar.

PS.: alterei o meu post anterior com mais observações.

[veaoum]

Uma questão não necessariamente relacionada com o site... o domínio é mcccorreia.com mas a empresa chama-se apenas MCCorreia? (o domínio tem um 'c' a mais).

De resto, vou comentar os seguintes pontos

• Como já foi dito, a imagem de header é demasiado grande e empurra todo o site para baixo, o que é muito desagradável, especialmente em ecrãs mais pequenos (eu tenho 1280x800)
  
• Contrastando com o header gigantesco, o footer está demasiado pequeno, mal centrado e demasiado perto do conteúdo. Deveria também ter uma cor mais clara.
  
• A página tem uma margem branca desagradável (default nos browsers, deverás corrigir isso com CSS)
  
• A barra lateral faz uma transição má da curva para a linha recta
  
• Estás a utilizar demasiadas imagens com texto. Não há problema em usar imagens -- o problema surge quando usas imagens para certas coisas que deveriam ser feitas com elementos <h1>, <h2>, etc, como por exemplo os títulos das secções (pois só dessa forma o Google indexará correctamente)
  
• Tens que rever o CSS para não dependeres dos estilos default dos browsers
  

1. Sim teem razão, irei pensar numa forma de contornar isso se me permiterem.
   
2. Pelo menos a parte do footer estar descentralizado e colado ao texto vou alterar.
   
3. Na altura pensai em colocar uma cor suave como cor de fundo. A minha duvida era se colocava a mesma cor por todo ou a zona dos menus e texto a uma e as laterais a outra. O que achas?
   
4. Nunca pensei que isso fosse ser visível. Muito obrigado pela atenção.
   
5. Nesta parte vou ter que discordar pois os textos estão como h1 em cima das imagens. Alterei logo isso quando pesquisei quais os pontos importantes para o google. Isto antes de colocar o site no servidor
   
6. Não percebi o que quiseste dizer. Desculpa.
   

Apenas queria agradecer a todos os que viram este tópico. Queria agradecer principalmente ao HappyHippyHippo e ao pwseo pelos comentários e acima de todo pelas criticas, pois só assim é possível melhorar. O meu muito Obrigado

👍

[pwseo]

• Nesta parte vou ter que discordar pois os textos estão como h1 em cima das imagens. Alterei logo isso quando pesquisei quais os pontos importantes para o google. Isto antes de colocar o site no servidor
  

Tive imensa pontaria então: http://www.mcccorreia.com/contatos.html (só tinha visto essa página)

• Não percebi o que quiseste dizer. Desculpa.
  

Quero dizer que o aspecto do site está demasiado dependente do browser / sistema operativo utilizado. Tens que anular algumas coisas pré-definidas (como por exemplo a margem irritante de 8px que os browsers costumam dar ao body) e testar bem outras como por exemplo o tipo de letra utilizado -- no meu sistema não há Century Gothic, o que faz com que alguns títulos apareçam num tipo de letra serifado local e outros em Century Gothic (os que estão embutidos nas imagens). O corpo do texto também aparece no tipo de letra default do browser, aqui.

Edited March 9, 2013 at 09:31 PM by pwseo

[Virneto]

Tive imensa pontaria então: http://www.mcccorreia.com/contatos.html (só tinha visto essa página)

Quero dizer que o aspecto do site está demasiado dependente do browser / sistema operativo utilizado. Tens que anular algumas coisas pré-definidas

(...).

O corpo do texto também aparece no tipo de letra default do browser, aqui.

Esta questão pode ser contornada minimizada com um css reset. Ou seja, no teu ficheiro css começas por atribuir regras básicas para que todos os browsers os utilizem (anulando os seus valores padrão). Depois atribuis os teus estilos. Um exemplo é o de EricMeyer.

Se só quiseres eliminar a margem então podes colocar no teu css:

html, body {
margin: 0;
}

[veaoum]

Tive imensa pontaria então: http://www.mcccorreia.com/contatos.html (só tinha visto essa página)

E tens toda a razão, fiz isso para os serviços e esqueci-me de fazer para o resto. oppsss.

Quero dizer que o aspecto do site está demasiado dependente do browser / sistema operativo utilizado. Tens que anular algumas coisas pré-definidas (como por exemplo a margem irritante de 8px que os browsers costumam dar ao body) e testar bem outras como por exemplo o tipo de letra utilizado -- no meu sistema não há Century Gothic, o que faz com que alguns títulos apareçam num tipo de letra serifado local e outros em Century Gothic (os que estão embutidos nas imagens). O corpo do texto também aparece no tipo de letra default do browser, aqui.

Já percebi. O que é que aconselhas que seja mais alterado das defenições default do browser? Sabes se existe alguma listagem com tipos de letra que todos os computadores tenham?

Esta questão pode ser contornada minimizada com um css reset. Ou seja, no teu ficheiro css começas por atribuir regras básicas para que todos os browsers os utilizem (anulando os seus valores padrão). Depois atribuis os teus estilos. Um exemplo é o de EricMeyer.

Se só quiseres eliminar a margem então podes colocar no teu css:

html, body {
margin: 0;
}

Muito obrigado.

[pwseo]

Usa um CSS reset, como foi proposto acima.

Quanto ao tipo de letra, uma alternativa é escolheres outro tipo de letra que exista na maioria dos computadores, ou então utilizas um tipo de letra que possa ser distribuído com o site, via css @font-face. Aqui está uma lista de tipos de letra supostamente semelhantes ao Century Gothic: http://jsfiddle.net/pxfunc/TeBRS/show/ (escolhes um, clicas no tab "Webfont Kit" e pronto)

Edited March 10, 2013 at 05:15 PM by pwseo

[veaoum]

Usa um CSS reset, como foi proposto acima.

Quanto ao tipo de letra, uma alternativa é escolheres outro tipo de letra que exista na maioria dos computadores, ou então utilizas um tipo de letra que possa ser distribuído com o site, via css @font-face. Aqui está uma lista de tipos de letra supostamente semelhantes ao Century Gothic: http://jsfiddle.net/pxfunc/TeBRS/show/ (escolhes um, clicas no tab "Webfont Kit" e pronto)

Ok! Vou tentar, nao sabia que era possivel embutir a font no css, mas e qualquer uma ou só as que tem o tal webfont kit?

[pwseo]

Nem todos os tipos de letra estão legalmente habilitados a serem incluídos dessa forma (o Century Gothic é um dos exemplos cuja licença não o permite).

Claro que, na prática, se tiveres um conversor de .ttf para webfont, qualquer tipo de letra pode ser utilizado... Mas aí entras na parte dos problemas legais, por isso mais vale utilizar tipos de letra que já sejam especificamente autorizados para tal.

[veaoum]

Boa noite! Depois de ver todas as opiniões coloquei aquilo que penso ser a versão final do site:

www.mcccorreia.com

será que podiam dar-me a vossa opinião?

Edited March 15, 2013 at 11:18 PM by veaoum

[HappyHippyHippo]

os componentes de inserção de dados continuam sem estilos e desalinhados

[veaoum]

os componentes de inserção de dados continuam sem estilos e desalinhados

Não consigo perceber o quer dizer, não se importa de explicar melhor? o codigo do formulário é:

<div id="form">
<h2>Entre em contato connosco</h2>
<p>
<form action="env.php" method="POST">
 Nome:
 <input type="text" name="nome" size="34">
 <p>
   E-mail: <input type="text" name="email" size="34">
   <p>
   <p>
   Mensagem:
   <br>
   <textarea name="coment"  cols="50" rows="13"></textarea>
   <p> <input type="submit"  value="Enviar" class="button"  />
</form>

[HappyHippyHippo]

olha para a página de contactos :

as caixas são apresentadas com estilos diferentes (input vs textarea)

e estão desalinhadas

[veaoum]

Mas teoricamente o textarea não serve para criar um campo para texto e o imput uma linha? Vou pesquisar como alinhar os campos( referes-te ao facto do campo do nome não estar alinhado com o campo do e-mail certo?)

[veaoum]

olha para a página de contactos :

as caixas são apresentadas com estilos diferentes (input vs textarea)

e estão desalinhadas

Acho que finalmente compreendi o que disseste, já está alinhado http://www.mcccorreia.com/contatos.html, certo? Aquilo que não percebo é o porque dos estilos diferentes teoricamente não está correcto por querer que um campo tenha muito mais espaço para texto?

[yoda]

As borders dos inputs e textarea são diferentes.