Alles voor de beginnende webdesigner

Discussie in 'PC, Handheld & Algemeen' gestart door dutch_badass, 28 apr 2005.

Topicstatus:
Niet open voor verdere reacties.
Pagina 49 van 67
  1. Darkwing

    Darkwing Active Member

    Berichten:
    6.510
    Leuk Bevonden:
    25
    Heel simpel:

    HTML:
    <a href="#" rel="lightbox[]">
    En als je meerdere albums op dezelfde pagina hebt doe je zoiets:

    HTML:
    <a href="foto1.jpg" rel="lightbox[1]">
<a href="foto2.jpg" rel="lightbox[1]">
<a href="foto3.jpg" rel="lightbox[1]">

<a href="foto4.jpg" rel="lightbox[2]">
<a href="foto5.jpg" rel="lightbox[2]">
<a href="foto6.jpg" rel="lightbox[2]">
     
    Darkwing, 31 jan 2008
    #961
  2. sickness

    sickness i kill like a plague

    Berichten:
    968
    Leuk Bevonden:
    0
    inderdaad vrij simpel hoef alleen maar [1] toe te voegen, ben er nu mee bezig laat wel weten als er weer een update is



    hij is geupdate, ook wat fotos toegevoegd, maar je ziet nu dus dat je op next kan doen, echt een hele verbetering, tell me what you think!!
     
    Laatst bewerkt: 31 jan 2008
    sickness, 31 jan 2008
    #962
  3. Darkwing

    Darkwing Active Member

    Berichten:
    6.510
    Leuk Bevonden:
    25
    Een paar opmerkingen over je siteontwerp en je markup:

    • Waarom jpg's als achtergrondafbeeldingen en geen png? Png leent zich uitstekend voor dit soort afbeeldingen, scheelt een flink stuk in bestandsgrootte en is kwalitatief ook nog eens beter voor non-fotografisch materiaal.
    • Waarom is je homepagina zo leeg? Ik zie een lege pagina als ik op je site kom, niet echt uitnodigend.
    • Ik vind je markup echt ontzettend slordig voor een relatief eenvoudige site als deze. Ik zou het als volgt coden:
      • Al je content in één div, en deze de achtergrondafbeelding geven die je nu helemaal hebt opgeknipt. Met CSS kun je deze precies stylen.
      • De rollover knoppen absoluut positioneren.
      • Eén of twee overliggende div's voor de daadwerkelijke content.
    Je css komt er dan ongeveer zo uit te zien:

    Code:
    //Dit wordt je complete sitevak:
#main_content {
  position: relative; //om de buttons straks absoluut te kunnen positioneren
  margin: 20px; //20 pixels van de rand van het scherm af
  border: 5px solid #00000; //een 5pixels dikke rand om je div
  width: 1000px; //of zo breed als je maar wilt
  height: 600px;
  background-image: url(achtergrond.png); //met daarin dus de complete achtergrond: het silhouet, de menu-brushes en het 'be creative'
}

//een voorbeeld van een van de rollover buttons
#button1 {
  position: absolute; //de button wordt absoluut gepositioneerd ten opzichte van de body div
  top: 20px; //20px van de bovenkant af
  left: 300px; //300px van de linkerkant af. De exacte waardes moet je zelf uitzoeken
}
//hetzelfde doe je voor alle buttons, met eigen waardes voor top en left

//het vlak waar je foto's of tekst in komen
#content_right {
  float: right; //we laten het vak rechts zweven
  margin: 30px 60px; //30px van de bovenkant en 60px van de zijkant af.
  width: 350px;
}
    En je html markup (versimpeld) iets als dit:
    HTML:
    <html>
  <head>
    <!-- Al je header info hier -->
  </head>
  <body>
    <div id="main_content">
      <!-- je menu buttons -->
      <div id="button1">
        <a href="#"><img src="image1.png" onmouseover="this.src='image1_over.png'" onmouseout="this.src='image1.png'" /></a>
      </div>
      <div id="button2">
        <a href="#"><img src="image2.png" onmouseover="this.src='image2_over.png'" onmouseout="this.src='image2.png'" /></a>
      </div>
      <!-- enz. -->
      
      <!-- je content -->
      <div id="content-right">
         <!-- Hier al je foto's en/of tekst -->
      </div>
    </div>
  </body>
</html>
    Je ziet het: een stuk overzichtelijker, en ook sneller!
    Dit is niet getest, dus je zult er wel wat aan moeten sleutelen, maar ik raad je echt aan om je html op deze manier om te gooien.
     
    Darkwing, 31 jan 2008
    #963
  4. sickness

    sickness i kill like a plague

    Berichten:
    968
    Leuk Bevonden:
    0
    dude weet je wat het is, ik ben een site bouw noob. dit is in dreamweaver gemaakt en dat programma maakt nu eenmaal een slordige code als je puur in het design tabel werkt. achtergrondbeelden als png is wel een idee

    en opzich vind ik de index niet zo heel erg leeg. geen kleur inderdaad maar dat maken de rollovers weer goed
     
    Laatst bewerkt: 31 jan 2008
    sickness, 31 jan 2008
    #964
  5. Rivanov

    Rivanov Apple Fanboy

    Berichten:
    16.906
    Leuk Bevonden:
    559
    Je kunt wel even een intro-tekst plaatsen op de witte leegte die je nu ziet op de index.html
     
    Rivanov, 31 jan 2008
    #965
  6. sickness

    sickness i kill like a plague

    Berichten:
    968
    Leuk Bevonden:
    0
    ja oke dat kan wel.


    maar vind opzich dat het niet slecht is. en dat ik er best credit voor kan krijgen, behalve voor de lightbox dan dat is rivanovs werk
     
    sickness, 31 jan 2008
    #966
  7. Rivanov

    Rivanov Apple Fanboy

    Berichten:
    16.906
    Leuk Bevonden:
    559
    Het ziet er ook netjes uit. Maar de code is gewoon slordig, waar jij niets aan kunt doen. Het is puur een tip van Darkwing, om zo meer overzicht te krijgen in je code.
     
    Rivanov, 31 jan 2008
    #967
  8. sickness

    sickness i kill like a plague

    Berichten:
    968
    Leuk Bevonden:
    0
    ja dat snap ik wel. tja ben meer visueel gericht en heb weinig met de code gedaan. dat heeft dreamweaver allemaal gedaan voor mij. maar ik geef toe dat het er als een zooitje uit ziet
     
    sickness, 31 jan 2008
    #968
  9. Gerjan

    Gerjan XBW.nl VIP XBW.nl VIP

    Berichten:
    6.685
    Leuk Bevonden:
    221
    Haha zo ben ik ook hoor :9 Ben beetje anti programmeren (komt door java 8)). Alleen actionscript/html/css wil ik af en toe nog wel proberen.

    Ben het alleen altijd snel zat wanneer iets, wat ik op een bepaalde manier voor ogen heb, niet lukt.
     
    Gerjan, 31 jan 2008
    #969
  10. Tsux

    Tsux Active Member

    Berichten:
    1.889
    Leuk Bevonden:
    0
    Misschien is Flash daarom wel een leuke voor je!

    Dat is voornamelijk grafisch ingesteld, moet je alleen een heel klein beetje ActionScript leren voor knopjes, maar dat stelt in principe niet zoveel voor, maar dan kan je dit "zonder" HTML of CSS maken.

    Maar goed, Flash is ook niet alles :) Maar ik weet, misschien is het wel gewoon wat voor jou om te doen aangezien je graag tekent.
     
    Tsux, 31 jan 2008
    #970
  11. | QuickneZ |

    | QuickneZ | Ik ben sexy

    Berichten:
    544
    Leuk Bevonden:
    0
    Nog goede tuts voor een noob?
     
    | QuickneZ |, 4 feb 2008
    #971
  12. KevskiVD

    KevskiVD Active Member

    Berichten:
    949
    Leuk Bevonden:
    0
    Dan moet je juist doorzetten ;) Dan is het uiteindelijk toch super als het wel lukt (njah dat vind ik in ieder geval).

    Heb je dat alleen met programmeren of ook met grafisch ontwerpen enzo (ben even vergeten welke opleiding je doet, wel iets die hoek uit toch?)

    Maar programmeren vind ik verder ook nogal frusterend, maar soms ik wil iets gewoon écht kunnen en weten en dan ga ik gewoon verder klooien. Maar dat moet je natuurlijk wel kunnen, niet iedereen kan of wil daar moeite voor doen.

    Ik krijg morgen mijn eerste les Actionscript op de HU O-) Eens kijken hoe dat is, daar moet je volgens mij wel leuke dingen mee kunnen

    Heel even vlug gekeken naar je website, op zich vind ik hem er wel goed uit zien (niet op details gelet, ik moet zo weg :p) Je hebt hem helemaal veranderd t.o.v. je vorige layout zeker?
    Toen had je toch een aantal rechthoeken zodat je naar de verschillende onderdelen van je website kon (kortgezegd :+)
     
    Laatst bewerkt: 4 feb 2008
    KevskiVD, 4 feb 2008
    #972
  13. Tsux

    Tsux Active Member

    Berichten:
    1.889
    Leuk Bevonden:
    0
    Voor een specifiek iets?
     
    Tsux, 5 feb 2008
    #973
  14. sickness

    sickness i kill like a plague

    Berichten:
    968
    Leuk Bevonden:
    0

    thnx
    ja precies zo begon hij wel vorige keer, is helemaal anders nu. ga er deze week weer eens naar kijken denk wat ik kan verbeteren.
     
    sickness, 10 feb 2008
    #974
  15. Gerjan

    Gerjan XBW.nl VIP XBW.nl VIP

    Berichten:
    6.685
    Leuk Bevonden:
    221
    Heej actionscript @ hu.. Doe je daar toevallig Mediatechnologie? Dat doe ik dus (2e jaars)

    Actionscript vind ik juist wel weer cool. Vooral door de duidelijk link met gewoon flash.
    En alle programma's van Adobe+Autodesk zijn vet :D Heb ik mezelf ook allemaal aangeleerd dus dat zit wel goed (Tools vakken stellen dus niks voor :9).
     
    Laatst bewerkt: 10 feb 2008
    Gerjan, 10 feb 2008
    #975
  16. sickness

    sickness i kill like a plague

    Berichten:
    968
    Leuk Bevonden:
    0
    google vind de site nu al, en dat zonder dat ik doorlink naar andere sites, maar waarschijnlijk omdat ik hier me site heb staan in mijn tag vind ie hem over en over met zijn spiders. wel relaxt dus, had het niet verwacht.
     
    sickness, 11 feb 2008
    #976
  17. Tsux

    Tsux Active Member

    Berichten:
    1.889
    Leuk Bevonden:
    0
    Nou ik ben aan het kloten voor een nieuwe website, alleen ik werk nu voor het eerst in m'n leven met <div> enzo.

    Dit is iets van hoe het uiteindelijk eruit moet gaan zien:
    http://www.what-the-funk.nl/test/wd02.jpg

    en dit is het beginnetje wat ik eraan gemaakt heb:
    http://www.what-the-funk.nl/test/

    Alleen heb ik nu het probleem dat wanneer niet alles in het scherm past en ik horizontaal moet scrollen, dat m'n achtergrond dan opeens stopt.
    Maar als ik niet scroll, maar gewoon m'n window groter maak, dan is er niks aan de hand! Die snap ik niet...

    Hulp iemand?
     
    Tsux, 18 feb 2008
    #977
  18. Intraxz

    Intraxz Ja!

    Berichten:
    2.119
    Leuk Bevonden:
    0
    Bij mij is ie gewoon mooi. De achtergrond ook.
     
    Intraxz, 18 feb 2008
    #978
  19. Tsux

    Tsux Active Member

    Berichten:
    1.889
    Leuk Bevonden:
    0
    Het is een beetje moeilijk uitleggen, ik heb wel even een screenshot gemaakt, die staat hier:
    http://www.what-the-funk.nl/test/voorbeeld.png

    Je moet eerst je Browser-venster versmallen in de breedte, dat de website er niet meer oppast en je dus een horizontale scrollbar krijgt. Als je dan met de scrollbar van links naar rechts beweegt zie je dat je achtergrond niet meer meewerkt.
    Ik weet nog steeds niet waar het aan ligt....

    [Edit]
    Ja... Weet iemand nog een maniertje om te testen of websites ook werken met IE6? Of browser versies een stapje terug? Want ja... Alles werkt met de huidige browsers, maar met sommige oude nog niet, maar aangezien op geeneen mac of pc een oude browser heb, valt dat voor mij dus niet te testen...
     
    Laatst bewerkt: 18 feb 2008
    Tsux, 18 feb 2008
    #979
  20. KevskiVD

    KevskiVD Active Member

    Berichten:
    949
    Leuk Bevonden:
    0
    Volgens mij is het testen in een oudere versie van IE6 niet mogelijk.

    Ik kreeg ook wel eens opmerking van bepaalde websites dat die er niet goed uit zag in IE, terwijl ik dat altijd test (die hadden dan dus IE6)
    Helaas is het voor zover ik weet niet mogelijk om op je eigen systeem een website te laten draaien in IE6 als je IE7 geinstalleerd hebt.
    Mocht het wel zo zijn wil ik het ook graag weten.

    Dat van je achtergrond is inderdaad erg vreemd :confused: Die snap ik ook niet helemaal (nu ben ik ook geen held in CSS etc.)
    Ik vind hem er verder wel erg goed uit zijn, mijn complimenten
     
    Laatst bewerkt: 18 feb 2008
    KevskiVD, 18 feb 2008
    #980
Pagina 49 van 67
Topicstatus:
Niet open voor verdere reacties.

Deel Deze Pagina