Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

azeredo

Deixar o site mais correto....

Por , em Desenvolvimento frontend

Recommended Posts

azeredo    0

azeredo
Postado

Bom para facilitar... segue todas as páginas do site........

estrutura.css

/* CSS Document */body{	margin:10px 15px;	font: 12px Arial, Helvetica, sans-serif;	background:#666600;	text-align:center;	}#tudo {	width:760px;	background: url(/imagens/falso.gif) repeat-y 0 0;	text-align:left;	margin:0 auto;	}#topo {		margin:0;	height:80px;	background-color:#b5daa2;	padding-top: 0px;		color:#666666;	}#principal {	width:578px;	font-size:small;	background-color:#FFFFFF;	color:#666600;	float:right;		}	#navegacao {	width:180px;	background-color:#FFFFFF;	float:left;	}#principal * {	padding: 0 20px;	}#navegacao * {	padding: 0 0px;	}#rodape {		clear:both;	height:20px;	background-color:#b5daa2;	color:#666666;	}
index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta'>http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><link href="estilos/estrutura.css" rel="stylesheet" type="text/css" /><script src="http://www.google-analytics.com/urchin.js" type="text/javascript"></script><script type="text/javascript">_uacct = "UA-1180133-1";urchinTracker();</script></head><body><?php	$p = $_GET["p"];	if (!$p) $p="principal";?><div id="tudo"><div id="topo">	<div align="right">		  <table width="auto" border="0">			<tr>				  <td><?php include("topo.php") ?></td>			</tr>		</table>	</div>	<table width ="760" border="0">   			 <tr>		 	 	<td>Moisés Azeredo</td>			 </tr>	  </table>	  </div><div id="principal"><?php	if (file_exists("$p.php")) include("$p.php"); else include("404.php");?></div><div id="navegacao"><?php include("menu.php") ?></div><div id="rodape"><div align="right"><?php include("rodape.php") ?></div></div></div></body></html>
topo.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br" lang="pt-br"><head><title>Moisés Azeredo</title><meta name="keywords" content="tableless, web standards, acessibilidade, css, tutorial css,  tutorial, menu css, css menu, folhas estilo, estilo, layout css, layout sites, webdesign, web design, paginas web" /><meta name="description" content=" Tutoriais, macetes, dicas sobre uso das CSS para projetar sites." /><meta name="author" content="Mauricio Samy Silva" /><meta name="MSSmartTagsPreventParsing" content="true" /><meta http-equiv="imagetoolbar" content="no" /><meta http-equiv="Pragma" content="no-cache" /><meta name="robots" content="all" /><meta name="language" content="pt-br" /><meta http-equiv="Content-Type"  content="text/html; charset=iso-8859-1" /><style type="text/css">	ul.nav li {	list-style:none;		display:inline;	}ul.nav li a {	float:left;	border:1px solid #f00;	border-top:0.1em solid #fff;	border-right:0.1em solid #909090;	border-bottom:0.1em solid #909090;	border-left:0.1em solid #fff;	width:6.0em;	font: Verdana, Arial, Helvetica, sans-serif;	background:#FFFFFF;	color:#333;	text-align:center;	padding:0  0.2em 0.2em  0;	text-decoration:none;	}ul.nav a:hover{	background:#666600;	color:#fff;	border-color:#00f;	border-color:#000 #fafafa #fafafa #000;	}</style><ul class="nav"><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li></li><li><a href="#nb">Contato</a></li><li><a href="#nb">Curriculum</a></li><li><a href="http://blog.moisesazeredo.com" target="_blank">Blog</a></li><li><a href="http://moisesazeredo.com:2095/3rdparty/squirrelmail/index.php" target="_blank">Webmail</a></li></ul></body></html>
menu.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" lang="pt-br" xml:lang="pt-br"><head><meta name="keywords" content="tutorial,acessibilidade,css,css menu,estilo,folhas estilo,layout css,layout sites,menu css,paginas web,tutorial css,web design,web standards,webdesign,tableless" /><meta name="description" content=" Tutoriais, macetes, dicas sobre uso das CSS para projetar sites." /><meta name="author" content="Nick Rigby" /><meta name="MSSmartTagsPreventParsing" content="true" /><meta http-equiv="imagetoolbar" content="no" /><meta http-equiv="Pragma" content="no-cache" /><meta name="robots" content="all" /><meta name="language" content="pt-br" /><meta name="ICBM" content="-22.975781,-43.193082" /><meta name="DC.title" content="CSS para Web Design" /><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Horizontal Drop Down Menus - Parte 3</title><script type="text/javascript">function IEHoverPseudo() {	var navItems = document.getElementById("primary-nav").getElementsByTagName("li");		for (var i=0; i<navItems.length; i++) {		if(navItems[i].className == "menuparent") {			navItems[i].onmouseover=function() { this.className += " over"; }			navItems[i].onmouseout=function() { this.className = "menuparent"; }		}	}}window.onload = IEHoverPseudo;</script><style type="text/css">body { font: normal 62.5% verdana; }ul#primary-nav,ul#primary-nav ul {	margin: 0;	padding: 0;	width: 180px; /* Width of Menu Items */	border-bottom: 1px solid #ccc;	background: #fff; /* IE6 Bug */	font-size: 100%;	}ul#primary-nav li {	position: relative;	list-style: none;	}ul#primary-nav li a {	display: block;	text-decoration: none;	color: #777;	padding: 5px;	border: 1px solid #ccc;	border-bottom: 0;	}/* Fix IE. Hide from IE Mac \*/* html ul#primary-nav li { float: left; height: 1%; }* html ul#primary-nav li a { height: 1%; }/* End */ul#primary-nav ul {	position: absolute;	display: none;	left: 179px; /* Set 1px less than menu width */	top: 0;	}ul#primary-nav li ul li a { padding: 2px 5px; } /* Sub Menu Styles */ul#primary-nav li:hover ul ul,ul#primary-nav li:hover ul ul ul,ul#primary-nav li.over ul ul,ul#primary-nav li.over ul ul ul { display: none; } /* Hide sub-menus initially */ul#primary-nav li:hover ul,ul#primary-nav li li:hover ul,ul#primary-nav li li li:hover ul,ul#primary-nav li.over ul,ul#primary-nav li li.over ul,ul#primary-nav li li li.over ul { display: block; } /* The magic */ul#primary-nav li.menuparent { background: transparent url(imagens/arrow.gif) right center no-repeat; }ul#primary-nav li.menuparent:hover,ul#primary-nav li.over { background: #f9f9f9 url(imagens/arrow_preta.gif) right center no-repeat;}ul#primary-nav li a:hover { color: #E2144A; }</style></head><body><form method="get"><ul id="primary-nav">  <li><a href="">Principal</a></li>  <li class="menuparent"><a href="">Informática</a> 	<ul>	  <li class="menuparent"><a href="">Programação</a></li>		  <ul>		  <li><a href="#">Algoritmos</a></li>		  <li><a href="#">PHP</a></li>		  		</ul>	  <li><a href="#">Linux</a></li>	  <li><a href="#">Windows</a></li>	</ul>  </li>  <li class="menuparent"><a href="">Fotos</a> 	<ul>	  <li class="menuparent"><a href="">Álbuns</a></li>		  <ul>		  <li><a href="#">Família</a></li>		  <li><a href="#">Geral</a></li>		  		</ul>	  <li><a href="?p=enviar_fotos">Enviar Foto</a></li>	</ul>  </li> </ul></form><p><table width="180" border="0">  <tr>	<td>asdasdasda</td>  </tr></table></body></html>
principal.php

<p>Web site pessoal de Moisés Azeredo. Informações e interesses   pessoais, profissionais e acadêmicos.</p>
rodape.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta'>http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Untitled Document</title></head><body>Dados da página....</body></html>
enviar_foto.php

<style type="text/css"><!--body {	margin-left: 0px;}--></style><hmtl><body><style type="text/css"><!--.frm5 {	BORDER-RIGHT: #888888 1px solid; BORDER-TOP: #888888 1px solid; FONT-WEIGHT: bold; FONT-SIZE: 7pt; BORDER-LEFT: #888888 1px solid; BORDER-BOTTOM: #888888 1px solid; FONT-FAMILY: Verdana; BACKGROUND-COLOR: #f0f0f0;}--></style><form action="enviarfotos.php" method="post" enctype="multipart/form-data" name="form1">Selecione a Foto<br /><input name="arquivo" class="frm5" type="file" size="28"><br /><br />Descrição:<br><input name="comentario" class="frm5" type="text" size="40"><br /><br /><input type="submit" class="frm5" name="Submit" value="Enviar"></form></body></html>

Gostaria que vocês avaliasem.. primeiro esse negocio do paddin na div principal que está zuando tudo, por exemplo um field txt ao clicar nele.. o texto começa com um espaço em branco...... e tb esse negocios para validação doctype e metas... posso por todos no index? ou tem que ser assim mesmo um em cada página????

 

Ando lendo bastante sobre tabless e css mas estou com essas dúvidas ainda.... :wacko:

 

Opa.. desculpem o post longo... o site em questão é o mesmo lá de cima, moisesazeredo.com

 

ah... e tb.. um css atrapalha o outro.... tem com resolver isso tb?? dizendo quem manda em quem...

Vlw!!

Compartilhar este post

Link para o post
Compartilhar em outros sites

void    1

void
Postado

dude uma dica! acho q a mais valiosa de todas!!

 

o pouco é muito!

simplifique as coisas!!

 

vou colcoar aki um link muito bom sobre designs web2.0 acredito q pode te ajudar no quesito design pq quando o design está 100% facilita a codificação falo isso por experiencia!!

 

quando comecei a 4 anos atraz meus designs eram uma bosta claro(naum to falando q o teu está ruim) e fui evoluindo nao só o meu design mas tb como eu transformava ele em html só q tive problemas que me ajudaram muito um outro designer na empresa meu amigo do peito só me ferrava pq ele naum era muito pé no chao ai ele fazia uns designs muito sem nocao que eram impossiveis de fazer em html mas os clientes gostavam e aprovavam ai quem tinha q fazer o html era eu por algumas determinacoes dos chefes q alias eram vários!!

com isso fui melhorando minhas tecnicas de codificação e fui mudando minha forma de ver um design pq comecei a ser mais pé no chao na hora q estava na frente do photoshop então meus designs depois de prontos no photoshop eram 100% fieis no html com isso fui ganhando mais experiencia!!

 

o site é sobre design porem c você seguir oq está la vai fazer um design simples, bonito, na moda e será mais facil de codificar!

 

outra dica é use Firefox 90% das coisas que você faz no ff funcionam no IEca ai irá faltar apenas alguns ajustes!!

 

espero ter ajudado sei q naum te dei a resposta extata que queria!!

 

http://www.webdesignfromscratch.com/web-2....style-guide.cfm

 

 

the void

Compartilhar este post

Link para o post
Compartilhar em outros sites

azeredo    0

azeredo
Postado

vlw void...vou ler esse guia... mas tipo... você cria todo o layout no photo e depois exporta para html???aih q me mata.. eheheh, o que gosto é de programação.. sem criatividade para fazer um layout... aqui no site to fazendo em css mesmo... só o degrade do topo e rodapé que fiz no photo.. ehehemas conhecimento nunca é demais...vlw!

Compartilhar este post

Link para o post
Compartilhar em outros sites

void    1

void
Postado

mas é só para desenhar pq serve de guia para você codificar!!mas c você quer trabalhar com isso terá q aprender é um skill que naum tem como fugir!!

Compartilhar este post

Link para o post
Compartilhar em outros sites

Guilherme Rambo    4

Guilherme Rambo
Postado

Bom eu gosto de fazer o design no illustrator, e minha historia podemos dizer que é quase a mesma do void, ja tive mtu trabalho com layouts complicados.[]'s

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito