[HTML][CSS]<DIV> Struktura Strony oparta na divach

[Yoko]

Witam
Przegladnalem 2 strony zwiazane z kursem html i myslalem ze juz cos wiem do puki nie wszedlem na to forum i przecztalem ze nie wiem nic : P

Swoje pierwsze strony tworzylem w html oparta na tabelkach ( teraz juz wiem ze strony oparte na tabelkach nie sa dobrym pomyslem chociaz nie wiem czemu ... latwy i przejzysty sposob wg mnie ale pisza inni zeby tego nie uzywac... ale dlaczego... tego juz nie pisza... )

html

Kod:

<table width="100%" cellspacing="0" cellpadding="5">
<tr>
    <td colspan="2" bgcolor="#808080">
        <table width="100%" cellspacing="0" cellpadding="5">
        <tr>
            <td align="center" valign="middle" bgcolor="white"> <br><b>LOGO</b><br /> </td>
        </tr>
        </table>
    </td>
</tr>
<tr>
    <td width="100" valign="top" bgcolor="#A0A0A0">
        <table width="100%" cellspacing="0" cellpadding="5">
        <tr>
            <td bgcolor="white"><b>MENU</b><br />- Link 1<br />- Link 2<br />- Link 3</td>
        </tr>
        </table>
        <br />
        <table width="100%" cellspacing="0" cellpadding="5">
        <tr>
            <td bgcolor="white"><b>MENU 2</b><br />- Link</td>
        </tr>
        </table>
    </td>
    <td valign="top" bgcolor="#C0C0C0">
        <table width="100%" cellspacing="0" cellpadding="5">
        <tr>
            <td height="100%" valign="top" bgcolor="white"><b>TREŚĆ STRONY</b><br /><br />Jakis tekst...</td>
        </tr>
        </table>
    </td>
</tr>
<tr>
    <td colspan="2" align="center" bgcolor="#808080">
        <table width="100%" cellspacing="0" cellpadding="3">
        <tr>
            <td align="center" valign="middle" bgcolor="white"><b>STOPKA</b></td>
        </tr>
        </table>
    </td>
</tr>
</table>

!. Pierwsze pytanie: czemu nie mozna tworzyc stron na tabelach?
--------------------------------------------------------------------------------------

Przeczytalem ze strony powinno sie tworzyc by byly oparte na <divach>

html

Kod:

<div id="top">
    <div id="NAGLOWEK">Nagłówek szablonu</div>
    <div id="MENU">Menu nawigacyjne</div>
    <div id="TRESC">Treść strony</div>
    <div id="STOPKA">Stopka serwisu</div>
</div>

css

Kod:

html, body {
    background-color: #fff;
    color: #000;
    margin: 0;
    padding: 0;
}

#NAGLOWEK {
    background-color: #888;
}

#MENU {
    width: 150px;
    float: left;
    overflow: hidden;
    position: relative;
    background-color: #ccc;
}

#TRESC {
    margin-left: 150px;
    background-color: #fff;
}

#STOPKA {
    clear: both;
    background-color: #888;
}

i chcialem teraz spytac, jak to jest czy teraz nalezy w to wstawic grafike i tresc i strona bedzie profesjonalna?

mam jedna strone:
http://tibiopedia.pl

wiem ze tematycznie moze nie kazdemu sie podobac ale patrzac na to okiem "webmastera" strona wydaje mi sie na bardzo wysokim poziomie
i chcialem wiedziec czy eby stworzyc taka strone wystarczy html,css strona oparta na divach i grafika czy potrzebne jest cos jeszcze? dziekuje za odpowiedzi

[Pedro84]

1. Bo struktura to nie dane tabelaryczne. Proste. Dlaczego zupy nie jesz nożem? Bo do tego nie służy. Wystarczy poczytać
2. Nie, nie będzie "profesjonalna" Na to trzeba dużo wiedzy i jeszcze więcej praktyki.

http://tibiopedia.pl/ - to ma być ta strona na wysokim poziomie? Pomijam już wygląd czy tematykę, to przecież to spaghetti jakich mało. Nie sztuką jest narżnąć div'ów jak oszalały, sztuką jest zrobić dobrą strukturę dokumentu.

[Yoko]

hmm bralem pod uwage wyglad odsylaczy ( tych po lewej stronie ) oraz sam fakt ze po kliknieciu "glownego"tematu wysuwaja sie "podtematy"
po drugie odsylacze nad manu czyli ze nie ktore sa nad inne pod np guildie , dress up a nie standardowo w jednej lini
no i tlo ze fajnie przechodzi grafika w czarny kolor podczas przewijania strony w dol.
widac wiec ze dla laika czyli dla mnie strona moze sie podobac a dla Was starych wyjadaczy jest to "spaghetti"
wogole widac ze zielony jestem w tych sprawach i sie strasznie wyglupilem zakladajac ten temat... ide dalej cwiczyc html css i tworzenie stron w divach

[Pedro84]

Szukaj sobie materiałów/kursów w Google, tego jest naprawdę od groma, a nie ma sensu pisać rzeczy powtórzonych już pierdolion razy. No i szukaj na forum, wartościowych tematów trochę tu jest.

[Yoko]

Dzieki za rady caly czas sie do nich stosuje a cala poznana wiedze staram sie sprawdzac w praktyce
mam dodatko 2 prosby:
1.Zrobilem sobie menu rozwijane za pomoca skrypt ale jest jeden problem...
cyt"Warto nadmienić, że w przypadku kiedy elementy menu zawierają odsyłacze, gałąź menu, w której znajduje się odnośnik do aktualnie wczytanej strony, zostanie na starcie automatycznie rozwinięta. Dzięki temu użytkownik łatwiej odnajdzie punkt w nawigacji, w którym teraz się znajduje"
a ja wlasnie nie chce tak... chcialbym zeby na starcie ta galaz menu byle zawinieta i dopiero po kliknieciu w dany element sie rozwinela... tylko nie wiem jak to zrobic .... moglby ktos pomoc?
2. 2 problem... kiedy najezdzam na dany element ( mowie o tym elemencie ktory to po kliknieciu rozwija mi cale menu ) wogole nie zmienia mi sie rodzaj kursosa ... i tak sie zastanawiam skad niby ktos ma wiedziec by w to kliknac skoro kursos po najechaniu jest caly czas taki sam...
np kiedy najezdzam na odsylacz to kursor ( strzaleczka ) zamienia mi sie w ten wyciagniety palec dzieki czemu wiem ze moge tu kliknac i wydarzy sie jakas interakcja ... natomiast po najechaniu na ten glowny element menu kursos jest taki sam.... tez prosze o jakies rady
-----------------------------------------
edit do dwojki
zrobilem cos takiego
<dt style="cursor: pointer">HTML</dt>
efekt jest chce tylko wiedziec czy to jest zgodne ze wszystkimi normami i czy moge tego uzywac w taki sposob czy powinienem zapisac to jakos inaczej?
Dziekuje

[kmd]

Nie chodzi tylko o to czy dan są tabelaryczne czy nie. Stworzenie strony na tabelkach nie daje Ci nad nią żadnej kontroli poza ustawieniem elementów na stronie (tak, owszem, ustawisz zgrabnie header, menu, treść itp). Ale co zrobisz jak będziesz chciał odpowiednio ostylować jedną część, a resztę pozostawić standardowo? Powiedzmy masz 3 różne menu i w każdym chcesz inny kolor linków? Jak stronę napiszesz na divach, to odwołujesz się w CSS do danego div'a i stylujesz. A na tabelkach? Będziesz i tak musiał tworzyć klasy dla linków, co w konsekwencji zaśmieci kod. Kolejna sprawa: będziesz chciał dodać elementy interaktywne przy użyciu JavaScript (jQuery itp.). Jak odwołasz się do jakiegoś elementu w tabeli? Nie odwołasz się, bo nie masz punktu zaczepienia. A div'y dają taką możliwość. Nadajesz odpowiednią klasę i działasz. Oczywiście, możesz nadać klasę tabeli i elementom w niej się znajdującym, no ale właśnie wtedy zaczniesz wychodzić z szablonu opartego o tabele i przestawiać się na ten oparty o divy