Min nettside

hjahre · 15. april 2011

Websiden er grei den, jeg liker det nye designet bedre enn det gamle. Nå skal det sies at jeg ikke er noen webdesigner, og ikke har så mye peil på design. Men jeg syns det var slitsomt å se på at hele sida flytta seg nedover når jeg tok musepekeren over visse menyelementer. Hvis du hadde fått de undermenyene til å komme foran headeren din, så tror jeg mye hadde vært gjort. Og kanskje litt gjennomsiktig bakgrunn også. Derimot er det dårlig å se at du ikke har validert HTML og at du bruker tabeller så mye som du gjør. Jeg har drevet litt med webutvikling gjennom tidene og tabeller hører ikke hjemme i design. :nei:

Hvis du skal ha et håp om å tjene litt penger på webdesign, vil jeg si at du må lære deg følgende;

Riktig bruk av elementer i HTML og hvordan lage gyldig markup
CSS og verifisering av den (det ser ut som du har klart det fint)

Ellers ser det ganske bra ut. Men du trenger ikke bruke JavaScript for å få vist undermenyene. Det kan like gjerne gjøres med CSS, men det funker ikke like bra i eldre nettlesere som IE6 (håper dør ut snart).

Men uansett er det ikke ille for en 15-åring, så hvis du tar ett steg av gangen (og ikke regner med at du skal klare alt på en gang) er jeg sikker på at du får det til bedre etterhvert. Personlig fiklet jeg litt med webdesign når jeg var rundt 15, men etterhvert innså jeg at design ikke var det jeg likte, jeg syns det var morsommere å fikle med kode og lage programmer Det var litt OT, men uansett, lykke til

Endret 15. april 2011 av hjahre

Burnski · 15. april 2011

Da tror jeg du ser på den litt eldre utgaven, for på den nye hopper ingenting.

lettnett.com

Uansett, kan du fortelle meg hvordan jeg får elementet til å vises ved hjelp av CSS? Så vidt jeg vet er det nødvendig med JS.

hjahre · 15. april 2011

Oisann, gikk litt fort i svingene i sta.. Så ikke at du hadde satt opp siste linken, det var http://lettnett.com/ex4/ jeg kommenterte på. Men jeg ser at du bruker tabeller i den nye også. Tabeller brukes bare til tabulær data. Altså data som hører hjemme i tabeller, f.eks sammenlikning av to skjermkort, forskjellige versjoner av samme program osv.

Når det gjelder å undermeny i CSS er det noen forskjellige måter å gjøre det på. Men ganske enkelt forklart må du si hva som skjer når du hoovrer over et element. Her følger et lite eksempel jeg slang sammen nå;

HTML:

<!DOCTYPE html>
<html>
<head>
	<title>CSS DROPDOWN MENU</title>
	<link rel="stylesheet" type="text/css" href="style.css"/>
</head>

<body>
	<ul id="menu">
		<li>
			<a href="#" >Menu 1</a>
			<ul class="submenu">
				<li><a href="#">Item 1</a></li>
				<li><a href="#">Item 2</a></li>
			</ul>
		</li>

		<li><a href="#">Menu 2</a></li>
	</ul>
</body>
</html>

CSS:


ul#menu {
display: block;
width: 600px;
border: solid 1px #000;
padding: 5px 0 5px 0;

}

ul#menu li {
display: inline-block;

margin: 5px 0 5px 0;
padding: 0 10px 0 10px;
text-align: center;

border-right: solid 1px #DDD;
}

ul#menu li ul {
position: absolute;
display: none;

border: solid 2px #555;
background: #CCC;

top: 2.5em;
}

ul#menu li:hover ul {
display: block;
}

Hvis du ser så sier jeg at den indre lista skal vises når jeg hovrer over li-elementet. Dette vil fungere i alle nettlesere som støtter CSS og webstandarder (Opera, Chrome, Safari, Firefox etc)

Edit: Slenger med en link til ei side der det er flere eksempler på ting du kan få til med CSS og som ikke krever JS CSSPlay.co.uk

Endret 15. april 2011 av hjahre

Burnski · 15. april 2011

Men mange bøker om temaet anbefaler tabeller. Forstår ikke hvorfor jeg ikke skal bruke det

hjahre · 15. april 2011

Den viktigste grunnen jeg kommer på er at sider med en stor tabell blir fryktelig tungt å laste. Jo mindre html-fila er, desto kjappere vil sida komme opp og folk slipper å vente lenge. Det er stor forskjell når samme sida kan være 4kB (uten tabell) og 100kB (med tabeller). Dette er bare eksempler, men det illustrerer at tabeller er mye tyngre enn vanlig markup. Du kan jo også spørre deg selv, ville du venta 3 sekunder når samme sida kunne vært lasta på 0,5 sek?

På denne sida kommenterer de litt mer på hvorfor man ikke skal bruke tabeller.

Et eksempel; hva er enklest?

<table>
<tr><td>Col1</td><td>col2</td><td>col3</td></tr>
</table>

eller

<div class="wrap">
<div class="left"></div>
<div class="right"></div>
</div>

EDIT:

Legger ved noen sider som kan vise deg hva CSS kan gjøre. Merk at ingen av sidene bruker tabeller til design.

Endret 15. april 2011 av hjahre

Burnski · 15. april 2011

Ok, takk for tipset

Logg inn

Min nettside

Anbefalte innlegg

hjahre

Lenke til kommentar

Videoannonse

Burnski

Lenke til kommentar

hjahre

Lenke til kommentar

Burnski

Lenke til kommentar

hjahre

Lenke til kommentar

Burnski

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Opprett konto

Logg inn

Hvem er aktive 0 medlemmer