1. #1

    Registered
    18/11/02
    Location
    Eke, Belgiƫ
    Posts
    2,448
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/0

    INFO: Hoe correct slicen (flexibele layout)

    Omdat ik merkte dat er de laatste tijd steeds meer threads opduiken over hoe je correct sliced, richt ik deze thread op. Ik heb me deze avond bezig gehouden met het maken van een afbeelding die poogt te illustreren hoe je correct een layout moet opdelen zodat deze flexibel wordt. Dit wil zeggen dat ze mee beweegt/groeit met de grootte van je inhoud.

    De meesten gebruiken namelijk 1 grote afbeelding of verschillende afbeeldingen van een vaste grootte om een kader te vormen rond hun inhoud. Dit is echter fout. Om een flexibele layout te krijgen ben je verplicht met herhalende elementen te werken. De onderstaande afbeelding probeert dit te illustreren:

    http://www.webcoder.be/lode/_lessons/slicen01.jpg

    Hopende dat er mensen zijn die er wat aan hebben groet ik u

    Opmerking:
    deze methode is voornamelijk gericht op een tabellayout, een uitleg over hoe je hetzelfde effect bereikt volgens de nieuwe 'standaard' (namelijk div's en css) zou te ingewikkeld worden omdat het al een bepaalde voorkennis van CSS vereist.

    Bovenstaande methode zorgt trouwens voor flexibiliteit in beide richtingen (zowel horizontaal als verticaal). Meestal is enkel verticale flexibiliteit voldoende en volstaan bijgevolg 4 images, dit is al iets simpeler te implementeren door middel van DIV's en CSS.


    *EDIT*

    Als je een stap voor stap tutorial zoekt voor het maken van een layout volgens de nieuwste methodes en standaarden:

    Les 1
    Les 2
    Les 3
    Les 4
    Les 5
    Les 6
    Les 7
    Les 8
    Last edited by DarkBone; 10-09-2004 at 01:47.
    no votes  

  2. #2
    Dece's Avatar
    Registered
    25/10/02
    Location
    Ninove
    Posts
    829
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/0
    zoals lb reeds zei: nice work.
    no votes  

  3. #3

    Registered
    18/11/02
    Location
    Eke, Belgiƫ
    Posts
    2,448
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/0
    Net de link teruggevonden naar een artikel van Alistapart hoe je custom borders en corners toepast volgens de nieuwste technieken (xhtml&css):
    http://www.alistapart.com/articles/customcorners/

    Maar voor beginners is dit allemaal zo simpel nog niet, one step at a time
    no votes  

  4. #4
    [DZM]TheOne's Avatar
    Registered
    17/07/02
    Location
    De Haan
    Posts
    244
    iTrader
    20 (100%)
    Mentioned
    0 Post(s)
    Reputation
    0/0
    fantastisch

    'k ben net bezig me wat bij te schaven inzake lay-out en css
    There is no spoon.
    no votes  

  5. #5
    Brando[n]'s Avatar
    Registered
    17/08/03
    Location
    Zele
    Posts
    542
    iTrader
    6 (100%)
    Mentioned
    0 Post(s)
    Reputation
    0/0
    Sticky
    no votes  

  6. #6
    Dece's Avatar
    Registered
    25/10/02
    Location
    Ninove
    Posts
    829
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/0
    spijtig genoeg kan deze thread niet "gestickied" worden aangezien we al 3 stickies hebben.
    no votes  

  7. #7
    Mich's Avatar
    Registered
    14/09/02
    Location
    Hoogstraten
    Posts
    2,488
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/1
    echt zalig gedaan darkbone, kwas daar juist achter aant zoeken
    no votes  

  8. #8
    InnerChild's Avatar
    Registered
    01/11/02
    Location
    Evergem
    Posts
    526
    iTrader
    13 (100%)
    Mentioned
    0 Post(s)
    Reputation
    0/1
    Quote Originally Posted by Dece
    This quote is hidden because you are ignoring this member. Show
    spijtig genoeg kan deze thread niet "gestickied" worden aangezien we al 3 stickies hebben.
    kan dit dan niet toegevoegd worden aan de info sticky voor webmasters?
    no votes  

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Log in

Log in