Alles voor de beginnende webdesigner

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

Topicstatus:
Niet open voor verdere reacties.
  1. WinterBase

    WinterBase #VOTEFORRECKA XBW.nl VIP

    Berichten:
    6.594
    Leuk Bevonden:
    654
    Darkwing, bedankt voor je uitleg. Ik zal er zeker wat mee doen. Echt tof man hoe jouw CMS panel eruit ziet, knap werk:thumbs: Nogmaals bedankt!:cool:
     
  2. Gdzr

    Gdzr Hmmm?

    Berichten:
    2.751
    Leuk Bevonden:
    62
    @ Darkwing, heb je zelf die cms lay out gemaakt? ziet er super fjn uit volgens mij,
     
  3. Darkwing

    Darkwing Active Member

    Berichten:
    6.510
    Leuk Bevonden:
    25
    Thx :) Jup, zelfgemaakt, een beetje gebaseerd op de layout van Joomla (destijds Mambo). Grote iconen zijn ook gejat van Joomla ;) De kleine icoontjes zijn van het gratis famfamfam Silk Icon pack (aanrader!).
     
  4. Tsux

    Tsux Active Member

    Berichten:
    1.889
    Leuk Bevonden:
    0
    [​IMG]

    Als je goed kijkt zie je dat er ruimte zit tussen de onderkant van de C en de S en de rest van de letters.

    Dat komt omdat het twee plaatjes boven elkaar zijn. Hoe krijg ik die twee lagen aan elkaar geplakt?

    Ik heb al met margin:0, spacing:0, border:0 zitten spelen, maar 't werkt niet...

    Ik heb nu alleen nog even dit:

    HTML:
    <div id="navigatie">
    <img src="images/top.gif" width="899" height="100" /><br />
    <img src="images/top_links.gif" width="380" height="44" /><img src="images/top_rechts.gif" width="519" height="44" />
    </div>
    Met de CSS informatie:
    HTML:
    #navigatie
    {
    border:0;
    padding:0;
    margin:0;
    }
    Maar nog steeds zonder succes...

    Iemand?
     
  5. [2k]

    [2k] XBW.nl VIP XBW.nl VIP

    Berichten:
    8.968
    Leuk Bevonden:
    207
    Haal die enter na <br /> eens weg. Zodat je het volgende krijgt:
    PHP:
    .. /><br /><img..
    Erg vervelende issue dat enters, tabs of spaties na img tags ongewenst voor wat marge onder de images zorgt in IE.
     
  6. Darkwing

    Darkwing Active Member

    Berichten:
    6.510
    Leuk Bevonden:
    25
    Wat [2k] zegt, maar waarom zou je er 2 verschillende plaatjes van willen maken? Is dat een bewuste keuze geweest? Weet je zeker dat er geen betere oplossing is door er 1 plaatje van te maken?
     
  7. Tsux

    Tsux Active Member

    Berichten:
    1.889
    Leuk Bevonden:
    0
    Oh sorry, dat had ik hier thuis al weggehaald, alleen zonder succes.

    Ja, het bovenste gedeelte is gewoon een logo-bar, de onderkant zijn knopjes naast elkaar, vandaar. Schematisch dus dit:

    Code:
     ---------------------------------------------------
    |     top     plaatje                               |
    |                                                   |
    |---------------------------------------------------|
    | zijkant plaatje        |        |        |        |
    |                        | knopje | knopje | knopje |
     ---------------------------------------------------
    Met tabellen krijg ik het zo voor elkaar, maar iedereen loopt zo te zeiken over tabellen tegenwoordig, dat ik het zonder tabellen probeer en met DIV-jes... Alleen niet echt succesvol, zoals je kunt zien.

    Ik kan er natuurlijk ook gewoon een Flash-gedeelte van maken. Veel makkelijker... Maar ja, ik wil dit nu eerst ook oplossen :)
     
    Laatst bewerkt: 30 jun 2008
  8. [2k]

    [2k] XBW.nl VIP XBW.nl VIP

    Berichten:
    8.968
    Leuk Bevonden:
    207
    En als je die twee opsplits:

    <div id=header></div> (je topplaatje)
    <div id=navar> (zijkantplaatje met left margin of de button divjes right floaten/alignen)
    <div id=button>knop</div>
    <div id=button>knop</div>
    <div id=button>knop</div>
    </div>

    De images voor top plaatje en zijkant plaatje zou je dan als background image in de divs kunnen definiëren.
     
  9. Tsux

    Tsux Active Member

    Berichten:
    1.889
    Leuk Bevonden:
    0
    Oke, ik heb even geknutseld, ik heb [2k] z'n idee uitgewerkt.

    [2k] snapt wel wat ik bedoel, ik heb zo gedaan:

    <div header met top plaatje>

    <div navbar inclusief images met de links> <--- Top Margin van -4px gegeven zodat hij aansluit

    Snap je?

    Het werkt wel, maar ik zat er mee. Ik heb dit nog nooit gehad. Dat wanneer je 2 plaatjes onder elkaar zet, dat je dan opeens een miraculeuze spacing van 4pixels hebt. Dat heb ik in 7 jaar tijd nog nooit gezien.

    Ik heb daarna de hele pagina uit elkaar gehaald, stuk voor om te kijken wat de oorzaak kon zijn.

    Wat blijkt? Dit staat bovenaan mijn pagina in de broncode:
    HTML:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    	<head>
    	<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    		<title>ToDe Combustion Services</title>
    
    	<style type="text/css">
    	@import "css/style.css";
    	</style>
    	</head>
    Zodra ik de <!DOCTYPE> weghaal *PLOP* weg spacing en passen de plaatjes naadloos op elkaar!
    Zit er een fout in de !DOCTYPE dan? Of is mijn HTML niet goed? Ik snap het niet meer...
     
  10. Darkwing

    Darkwing Active Member

    Berichten:
    6.510
    Leuk Bevonden:
    25
    Ik zou niet de doctype weghalen, dan weet de browser niet meer hoe de pagina gerenderd moet worden en gaat ie in Quirks mode, en dat wil je niet. Lees dit artikel maar eens over het belang van Doctypes:

    Maar waarom gebruik je xHtml Strict? Probeer het eens met xHTML Transitional, dat is een prima Doctype en geeft je flink wat meer vrijheden. Ik weet niet of het je probleem ook oplost, maar je zou het kunnen proberen - tenzij je een hele goede reden hebt om Scrict te gebruiken.
     
  11. Rivanov

    Rivanov Apple Fanboy

    Berichten:
    16.906
    Leuk Bevonden:
    559
    Ik denk dat Dreamweaver dat voor 'm heeft gedaan aangezien DW dat altijd doet. Aangezien hij niet weet waarom dat daar staat, zal hij er zelf niet voor gekozen hebben.
     
  12. Darkwing

    Darkwing Active Member

    Berichten:
    6.510
    Leuk Bevonden:
    25
    Oh? Dacht dat Dreamweaver standaard voor Transitional kiest. Maar dat weet ik ook niet zeker, gebruik het bijna nooit :+
     
  13. [2k]

    [2k] XBW.nl VIP XBW.nl VIP

    Berichten:
    8.968
    Leuk Bevonden:
    207
    Als het goed is kan je bij het openen van een nieuw document kiezen voor welke filetype/doctype je gaat, als php / xhtml 1.0 transitional oid.
     
  14. Tsux

    Tsux Active Member

    Berichten:
    1.889
    Leuk Bevonden:
    0
    Nee ik gebruik geen DreamWeaver :) Ik tik alles gewoon handmatig. Alleen ik ben uitgegaan van deze site:

    http://www.gigadesign.be/2006/01/een-xhtml-website-maken/

    Heb daarvoor nooit XHTML gebruikt en die raden 'strict' aan, vandaar.

    Dus Darkwing, ik probeer nu even Transitional en dan update ik dit bericht zo meteen om te kijken of het werkt.

    Update
    Transitional werkt goed! :D

    Thx for the help!
     
    Laatst bewerkt: 1 jul 2008
  15. Nightbringer

    Nightbringer Wieder geil! XBW.nl VIP

    Berichten:
    12.896
    Leuk Bevonden:
    556
    Oké hele simpele vraag, ik ben bezig met een website voor school loop al een tijdje te prutse maar ik snap er weinig van (dreamwaver etc) en ik heb zo in photoshop het ontwerp gemaakt:

    [​IMG]

    En ik hoorde van pegas dat ik het moet slice etc maar hoe moet het dan verder. (oftewel hoe zet ik het goed om in dreamwaver zodat ik simpel tekst + links kan adde)
     
  16. Tsux

    Tsux Active Member

    Berichten:
    1.889
    Leuk Bevonden:
    0
    Staat er nou "Aars Portfolio" ?
     
  17. Ryu Suyanto

    Ryu Suyanto Ryu Suyanto

    Berichten:
    846
    Leuk Bevonden:
    0
    Nee lol, ''Lars Portfolio''. Je kan em vergroten om het beter te zien:lol:
     
  18. Rivanov

    Rivanov Apple Fanboy

    Berichten:
    16.906
    Leuk Bevonden:
    559
    My eyes..my eyes!! 8)
     
  19. Nightbringer

    Nightbringer Wieder geil! XBW.nl VIP

    Berichten:
    12.896
    Leuk Bevonden:
    556
    Bedankt voor de nuttige tips mensen :)
     
  20. Darkwing

    Darkwing Active Member

    Berichten:
    6.510
    Leuk Bevonden:
    25
    Zelfs dan lijkt het 'Aars'. Zou dat toch iets aanpassen. En er staat 'portofolio', niet portfolio.

    Wat betreft je ontwerp, die is absoluut niet geschikt als website. Je hebt hem namelijk voor één vaste resolutie gemaakt; wat nou als iemand een grotere resolutie heeft? Dan wordt de achtergrond heel lelijk herhaald, of abrupt afgebroken en dat is niet mooi. Daarnaast zijn al die gepixeleerde patroontjes echt verschrikkelijk imho. 4 of 5 verschillende patroontjes, en allemaal doen ze zeer aan mijn ogen. En het kleurgebruik... tja, dat is er simpelweg niet :+

    Niet om af te kraken, maar ik zou dit ontwerp zeker niet gebruiken als ik jou was. Ik weet dat dit geen antwoord op je vraag is, maar je kunt dat beter aanpakken voordat je tijd gaat besteden aan iets wat bijna onmogelijk tot een mooie website is te verwerken.
     
Topicstatus:
Niet open voor verdere reacties.

Deel Deze Pagina