Ubuntu Sverige

Jag har börjat på en hemsida åt orkestern som jag är med i och tänkte fixa den enligt konstens alla regler. Har bara hunnit fixa skalet hittills och använt både html-knackning och med hjälp av Kompozer. Jag kan se att Kompozer ändrar i html-koden ibland, inte till nackdel men ändå. Följer Kompozer W3C?
Har hört någon nämna att man bör lägga text, bilder m.m. i tabeller för att det ska bli snyggare, stämmer det?

http://www.freewebs.com/kjermeus/

Tänkte fixa färdigt sidan innan jag kontaktar ett webbhotell. Jag kanske ska tänka på att ha ett webbhotell som stödjer php?

För att få den absolut kompaktaste och renaste koden bör du skriva den helt för hand, eftersom du då har full kontroll på vad varenda html-tagg gör.

Och att lägga in saker och ting i tabeller bara för att få det "snyggt" är inget jag kan rekommendera, tabeller är till för att visa data, om du vill få din data att se bra ut ska du använda CSS, enligt konstens alla regler.

Det finns enkla regler som man kan tänka på.

1. Organisera inte sidan i frames.  Använd istället tabeller, eller bygg upp sidan med div-boxar.
2. Låt html dokumentet innehålla innehållet på sidan. Och placera all formatering (färger, storlekar etc) i en css-mall.
3. Använd små bokstäver i taggar.
4. Avsluta varje tagg. <br> är t.ex. dålig stil, använd <br />.
5. Se till att taggarna är nästade i rätt ordning. Du kommer antagligen inte direkt förså vad allt detta innebär om du precis börjat koda html. Men när du lär dig mer så gå tillbaka och kolla.
Det du däremot alltid bör tänka på är punkterna 3-5.

http://www.webdesignskolan.com/

Där finns allt du behöver veta.

zero gravity skrev: 4. Avsluta varje tagg. <br> är t.ex. dålig stil, använd <br />.

Varför skulle <br /> vara bättre än <br>? Det ena är korrekt xhtml och det andra är korrekt html.

Förövrigt så tycker jag själv rätt bra om www.w3schools.com

andol skrev:

zero gravity skrev: 4. Avsluta varje tagg. <br> är t.ex. dålig stil, använd <br />.

Varför skulle <br /> vara bättre än <br>? Det ena är korrekt xhtml och det andra är korrekt html.

Just därför

Här kan du testa så att dina sidor följer w3c-standard: http://validator.w3.org/

Hej

Här finns det också lite bra resurser för html...
http://www.atiger.pp.se/sida.html

htt://ninetnet.com

Mycket bra för att komma igång med egen kodning, har bra kodexempel

Tack för alla tipsen. Ska se om jag kan få sidan att bli så bra som möjligt.

zero gravity skrev: 1. Organisera inte sidan i frames.  Använd istället tabeller, eller bygg upp sidan med div-boxar.

Det är frames jag har använt mig av för att få länkar till vänster, sidan till höger och "Göteborgs Salongsorkester" högst upp.
Är inte detta bra?

ZX Spectrum skrev: Det är frames jag har använt mig av för att få länkar till vänster, sidan till höger och "Göteborgs Salongsorkester" högst upp.
Är inte detta bra?

Det är inte alls bra, förutsatt att du inte är ute efter en riktigt 1996-känsla.

Det bästa är att göra html-koden såpass enkel att sidan ser helt ok ut i en
textbaserad webläsare (t.ex. lynx).  Sedan använder du en separat stilmall
(css) för att få det hela att se snyggt ut i grafiska webläsare.

Använd <div></div> och styr huruvida ett lager ska synas eller inte via JavaScript med CSS: visibility: visible/hidden.

Det fungerar som så att du har en ruta med menyalternativ och alla undersidor i varsin ruta ovanpå varandra som då byter plats med varandra

[Lager med meny, alltid synligt]
[Lager 1: startsida, börjar att vara synligt][Lager 2: sida 2, är osynlig från början][Lager 3: sida 3, är osynlig från början]

Den andra raden illustrerar alltså rutor som ligger ovanpå varandra där bara en av dem är synliga, och det när du aktiverar det genom att välja ett alternativ i menyn, hoppas att du begriper

Från w3schools.com

The disadvantages of using frames are:

• The web developer must keep track of more HTML documents
• It is difficult to print the entire page

Konservburk skrev:

ZX Spectrum skrev: Det är frames jag har använt mig av för att få länkar till vänster, sidan till höger och "Göteborgs Salongsorkester" högst upp.
Är inte detta bra?

Det är inte alls bra, förutsatt att du inte är ute efter en riktigt 1996-känsla.

Det bästa är att göra html-koden såpass enkel att sidan ser helt ok ut i en
textbaserad webläsare (t.ex. lynx).  Sedan använder du en separat stilmall
(css) för att få det hela att se snyggt ut i grafiska webläsare.

Kan man få sidan uppdelad på detta sättet också? Tänkte att "Göteborgs Salongsorkester" och länkarna till vänster skulle vara kvar oavsett om man trycker på någon länk för att lättare kunna navigera grafiskt.

mcNisse skrev: Från w3schools.com

The disadvantages of using frames are:

• The web developer must keep track of more HTML documents
• It is difficult to print the entire page

Jo, har sett att det krävs många html-sidor när man använder sig av frames.

ZX Spectrum skrev: Kan man få sidan uppdelad på detta sättet också? Tänkte att "Göteborgs Salongsorkester" och länkarna till vänster skulle vara kvar oavsett om man trycker på någon länk för att lättare kunna navigera grafiskt.

Ja.  Du kan t.ex. göra som upnorth föreslår.

Fanns gott om hjälp att få angående <div> och javascript genom googling. Ska se om jag inte får till detta.

Hittills har jag bara försökt att förstå mig på <div> och javascript. Det som ska stå uppe i <heads> är värre att förstå men skam den som ger sig.
Självaste <div>-taggarna om jag fattat det rätt kan stå enligt följande:

<div id="main" style="position:absolute; top:50px; left:100px;">
your stuff to show here
<a href="javascript://" onclick="showhide('main');">Förstasidan</a>
</div>

<div id="historik" style="position:absolute; top:50px; left:100px;">
Här kommer historiken att finnas
<a href="javascript://" onclick="showhide('historik');">Historik</a>
</div>

Man ska väl deklarera ex. id="historik" uppe i heads med hjälp av ett java-script?
Antar att när man trycker på en länk så ska ex. main bli hidden och historik bli visible på något sätt?
style handlar väl mer om var på skärmen texten ska stå.

I slutändan kan man alltså klara sig med en html-fil och ett antal png-bilder?

Där används lager bara för en kort textsnutt, som är utplacerade 50 pixlar från webbläsarfönstrets övre kant och 100 pixlar från den vänstra.

Det du ska göra är rutor för innehållet som i princip täcker upp hela webbläsarfönstret.
För att lättare komma igång föreslår jag att du även färglägger lagren så att du ser hur de beter sig med olika inställningar.

upnorth skrev: Det du ska göra är rutor för innehållet som i princip täcker upp hela webbläsarfönstret.

Förstår inte riktigt det här med rutorna som du skriver om?
Har gjort bakgrundsfärg på lagrerna nu

<div id="main" style="position:absolute; top:100px; left:200px; background:#0000FF">
Förstasidan
<a href="javascript://" onclick="showhide('main');">Förstasidan</a>
</div>

<div id="historik" style="position:absolute; top:200px; left:200px; background:#FF0000;">
Här kommer historiken att finnas
<a href="javascript://" onclick="showhide('historik');">Historik</a>
</div>

Varje <div></div> är en ruta.

Jag blir själv galen på css, mest för att jag inte har orkat lära mig hur man ska göra.