geplaatst door: MacMachine
Hallo mensen,

Ik wil in Dreamweaver onderstaande afbeelding als background-image (1280 x 790 pixels, voor 19" schermen) voor m'n website gaan gebruiken. De titel, de menu-tekst, enz heb ik allemaal in de gif opgenomen, zodat Explorer niet met m'n lay-out gaat klooien, en lettertypen behouden blijven. Ik plaats onzichtbare plaatjes over tekstjes heen, die vervolgens naar de betreffende content linken.

De background-image wou ik in CSS gaan plaatsen. Ik weet van het voordeel van CSS: Website-elementen die voor elke pagina hetzelfde zijn, kan ik het beste in CSS plaatsen, om ze niet elke keer op nieuw te hoeven laden.

Toch wil ik hier even checken: Is m'n denkwijze goed? Of zit ik er toch (deels) naast?
Bij voorbaat dank voor jullie antwoorden.

Groeten, Marco

P.S. Voor wie wii zien, hoe snel de background-image laadt, op flickr.com staat ie hier:
http://farm1.static.flickr.com/131/360748812_2303476543_o.gif

(Bewerkt door MacMachine om 22:58, 21-02-2007)

In zeven dagen schiep hij hemel, aarde en een mac.
Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 00:15    reactie #1
geplaatst door: atelier
Op mijn 17" scherm(pje) valt dat knopje "next" er dus straks af.
(want horizontaal scrollen doen we dus niet) :cool:

(Bewerkt door atelier om 0:16, 22-02-2007)

Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 07:58    reactie #2
geplaatst door: mk
Zou ik *nooit* doen, designen voor 1 resolutie, zeker niet voor max 1280 breed. (er zijn nog genoeg mensen die slechts 1024x768 hebben. Plus je site is voor geen meter te indexeren door zoekmachines.
Je kunt je site heus wel zo maken dat het er ook goed uitziet in IE :-)
Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 08:03    reactie #3
geplaatst door: MacMachine
Ja, ik ben er vanuit gegaan dat 19" schermen intussen min of meer standaard zijn geworden.
Heeft er iemand trouwens een website met statistieken over welke schermen gemiddeld het meest worden gebruikt?

En verder vooral: Is m'n denkwijze, zoals ik hier boven vertel, over CSS goed? Is het een goed idee om een dergelijke grote background-image in een stylesheet te zetten? Is het verstandiger om de teksten los van de background-image-gif op m'n website te plaatsen?

In zeven dagen schiep hij hemel, aarde en een mac.
Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 08:12    reactie #4
geplaatst door: MacMachine
@MK, ik had al gepost, voor je antwoord te hebben gelezen.
Thanks so far. :wink:
In zeven dagen schiep hij hemel, aarde en een mac.
Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 08:22    reactie #5
geplaatst door: mk
Het heeft meer te maken met de resolutie van een scherm, dan met de grootte daarvan. Ik ken mensen die op een 19" nog 1024x768 draaien (omdat anders de lettertjes zo klein zijn). Of mensen met 1600x1200 op een 19", wat trouwens ook een probleem met zich meebrengt, want hoe ga je met die extra ruimte om je design om? laat je je background verder 'tilen' (wat met bovenstaande achtergrond niet zal lukken, zeker niet met de tekst er al in), of positioneer je je site linksboven en laat de rest wit (ziet er misschien ook gek uit).

Het is altijd handig om plaatjes e.d. die met de opmaak te maken hebben in je css te plaatsen, 1x laden en aanpassen hoeft maar op 1 plek.

Check http://www.w3schools.com/browsers/browsers_stats.asp (onderaan), ruim de helft gebruikt nog 1024x768.

Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 08:32    reactie #6
geplaatst door: mvdg
Ik ben het eens met mk. Het idee achter je opzet is gewoon niet goed. Je sluit zo verreweg het grootste deel van de mensheid uit. Mensen met kleinere resoluties zien niet alles. Mensen met grotere resoluties zijn een leeg stuk naast je achtergrond. Mensen met een breedbeeldscherm zien weer iets anders dan mensen met een niet-breedbeeld scherm. Dit is gewoon niet de goede oplossing. Mijn advies is, zeker aangezien het blijkbaar om een professionele site gaat waar jij je fotografie op wilt aanprijzen, om je site door een ervaren iemand te laten maken. Daar heb je uiteindelijk veel meer aan.
Mitch Design : websites en interactieve toepassingen : http://www.mitchdesign.nl
Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 08:33    reactie #7
geplaatst door: MacMachine
Aha. En wat bedoel je eigenlijk met dat 'tilen'?
In zeven dagen schiep hij hemel, aarde en een mac.
Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 08:39    reactie #8
geplaatst door: mk
Dat je achtergrond gifje 'vaker' wordt gebruikt omdat je schermresolutie groter is. (als de resolutie nu groter is dan 1280, en je gifje 'tiled' (tja, wat is een goed nederlands woord?) dan begint je gif dus weer opnieuw naast de eerste.. zoiets als stoeptegels.. eh.. duidelijk?  :wacko:

(Bewerkt door mk om 8:40, 22-02-2007)

Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 08:44    reactie #9
geplaatst door: mvdg
Het laten herhalen van je achtergrond is natuurlijk niet mogelijk als je bijvoorbeeld je links erin hebt zitten. Dan krijg je diezelfde links rechtsonder opnieuw te zien. Alleen kun je er niet op klikken...

Als je toch je site op de manier wilt maken zoals jij zegt, maak dan in ieder geval een "lege" achtergrond en laat die herhalen. En zet daar overheen dan de knoppen die je wilt hebben. Heb je meteen beide problemen (niet passende achtergrond en herhalende knoppen) opgelost.

Mitch Design : websites en interactieve toepassingen : http://www.mitchdesign.nl
Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 08:46    reactie #10
geplaatst door: MacMachine
Helemaal duidelijk.  :wink:

@mvdg: Dank je wel voor de hint. Maar hier op m'n werk, word gevraagd dat ik me Dreamweaver over 'n jaar eigen heb gemaakt. Dus dit is een goed leerproject.

In zeven dagen schiep hij hemel, aarde en een mac.
Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 08:57    reactie #11
geplaatst door: Panico
Het is om al deze redenen (en nog een paar die ik kan bedenken),
en die allemaal met CSS en IE te maken hebben, dat je steeds meer
sites ziet die zijn gemaakt in Flash.

Maar of ik daar nou zo'n voorstander van ben :withstupid:

Ook de standaard layouts die je steeds vaker ziet (vooral grote sites)
zijn berekend op 800x600. Meestal 3 kolommen, en altijd scrollen.

Achtergrondplaatjes in CSS worden ook niet altijd hetzelfde (weer IE)...

PS: je zou altijd een script kunnen maken waarin de verschillende
browsers en resoluties herkend worden, en dan per keuze 1 CSS!

(Bewerkt door Panico om 9:00, 22-02-2007)

http://www.pauldj.nl/  ("Interesting reaction! But what does it mean?")
Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 09:02    reactie #12
geplaatst door: mvdg
Naar mijn idee gaat de ontwikkeling juist een beetje de andere kant op. Met de verbeteringen in IE (heel langzaam dat geef ik toe) en meer "niet IE browsers" die in het spel komen, wordt het steeds beter te doen om een goede css gebaseerde site te maken.

@MacMachine: Je een programma eigen maken en html kunnen programmeren zijn natuurlijk twee verschillende dingen. Het is niet zoals met Photoshop: als je dat programma kent, kun je mooie dingen maken die er altijd op dezelfde manier mooi uitzien. Met websites ligt het toch anders. Het programma is 1 ding, maar kennis van de structuren en technieken in html en css zijn belangrijker. Als je enkel Dreamweaver "kent" kun je mooie dingen maken die alleen op jouw browser mooi zijn. En dat kan toch niet het doel zijn!

Mitch Design : websites en interactieve toepassingen : http://www.mitchdesign.nl
Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 09:16    reactie #13
geplaatst door: mk
Ik heb ook het idee dat er steeds minder sites, volledig, in flash worden gemaakt dan voorheen. Mede omdat ook flash slecht te indexeren is door zoekmachines. Vandaag de dag toch belangrijk!

Ik ben van mening dat er voor zo goed als elke site 1 css te maken valt die in alle browsers goed werkt (dus ook IE), zonder hacks. Soms is je code dan semantisch misschien niet meer helemaal netjes, maar ook dat valt vaak wel mee.

Om een zo groot mogelijk publiek aan te spreken wordt er vaak nog gebruikt gemaakt van 800x600, hoewel dit ook steeds vaker naar 1024x768 gaat. bv yahoo.

Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 09:44    reactie #14
geplaatst door: Blender
Beetje natte vinger werk ‘Ik heb de indruk dat...’ Dit kan je natuurlijk onmogelijk weten.
Flash slecht indexeerbaar? Hangt er vanaf zijn wel degelijk goede oplossingen voor.
Maar sites met veel zakelijke informatie en tekst zijn natuurlijk voor flash niet ideaal.
Zelf maak ik bijvoorbeeld het menu wel (bijna) altijd in flash. Juist voor zo’n fotografie site is flash natuurlijk ideaal mits je weet wat je aan het doen bent. Je zou namelijk de gebruikers met een klein scherm dezelfde foto’s kunnen tonen maar dan verkleind. Gebruikers met een 19inch scherm kan je dan de foto’s maximaal tonen. Zoals op http://www.manipulator.com (door Group94)
Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 09:59    reactie #15
geplaatst door: Kapotlood

Citaat
mk om 9:16, 22-02-2007
Ik heb ook het idee dat er steeds minder sites, volledig, in flash worden gemaakt dan voorheen. Mede omdat ook flash slecht te indexeren is door zoekmachines. Vandaag de dag toch belangrijk!
Niet helemaal waar hoor ;) Een hoop flash-sites zorgen gewoon dat ze (bijvoorbeeld) hun site in een html-bestand zetten voor de indexering,
of maken een mooie splashpagina met de keuze voor een HTML of een Flash site.


Citaat
mk om 9:16, 22-02-2007
Om een zo groot mogelijk publiek aan te spreken wordt er vaak nog gebruikt gemaakt van 800x600, hoewel dit ook steeds vaker naar 1024x768 gaat. bv yahoo.
Een hoop sites die nu gemaakt/aangepast worden, krijgen of een variabele breedte, of een breedte van ±900px. Mensen met schermen van 800x600px zijn er maar heel weinig, tenzij je doelgroep bedrijven zijn op de bouw e.d. (of havens, want daar zitten ze soms met schermen van 12-14" te werken).

Dat je Dreamweaver in een jaar wilt leren kennen is een positieve instelling, hehehe.
Maar ik denk dat het makkelijker/sneller gaat als je HTML en CSS leert coderen. Want
als je Dreamweaver kent weet je hoe dat programma werkt, en hoe je "WYSIWYG" een
site kunt maken... welke over het algemeen nooit in álle browsers goed werkt. Dan zou
je daarna dus óók nog eens in de code moeten snuffelen om alles recht te trekken.
Als je daarentegen begint met handcoderen, kun je én sneller goede/snelle sites maken,
en scheelt het gewoon een hoop werk (qua sites maken, maar ook qua leerwerk wat je nu hebt).

Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 10:07    reactie #16
geplaatst door: mk

Citaat
joram om 9:59, 22-02-2007

Citaat
mk om 9:16, 22-02-2007
Ik heb ook het idee dat er steeds minder sites, volledig, in flash worden gemaakt dan voorheen. Mede omdat ook flash slecht te indexeren is door zoekmachines. Vandaag de dag toch belangrijk!
Niet helemaal waar hoor ;) Een hoop flash-sites zorgen gewoon dat ze (bijvoorbeeld) hun site in een html-bestand zetten voor de indexering,
of maken een mooie splashpagina met de keuze voor een HTML of een Flash site.

Volledig in flash is dus niet een html-versie ernaast  :biggrin:
Flash hangt in principe altijd in een html bestand, als je een site hebt met veel info kan er veel minder goed worden geindexeerd op de inhoud. Je site zelf wordt natuurlijk altijd geindexeerd door o.a. de metatags etc.

Flash is een tijdje een hype geweest, iedereen wilde een flashsite! Omdat het er zo cool uitziet  :blink:
Mijn idee is dat dat heden ten dage minder is, voor een aantal toepassingen is flash natuurlijk wel handig! bv. een fotosite  :biggrin:

Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 10:33    reactie #17
geplaatst door: Kapotlood
Zit wat in :)
Je moet geen Flashsite maken voor bijvoorbeeld een informatiesite. Maar
portfolio's, fotogalleries, soms zelfs persoonlijke blogs, kunnen prima indexeerbaar
zijn als ze gebruik maken van een goede splashpage. De info die een site als
Google nodig heeft zitten als ik me niet vergis toch vooral in de header. Als
je in die splashpage genoeg informatie zet (en validated opzet), dan heb je
in principe al genoeg gedaan om je flashsite geindexeerd te krijgen.

Maar om even terug te komen op de soort achtergrond die je wil plaatsen;
Het kán wel, maar hou er rekening mee dat je de site zelf op een goed
formaat maakt, of fluid houdt (dat hij altijd uitgevuld staat in de breedte).
Kijk dus bijvoorbeeld wat de doelgroep wordt, en of deze mensen vooral een
800x600, 1024x800, of misschien wel een 1680x1050 resolutie scherm hebben.
Stem daar de breedte (of juist de keuze om een fluid design te maken) op af :)

Dreamweaver: Grote background-image in CSS plaatsen?
22 februari 2007 - 11:39    reactie #18
geplaatst door: Blender
Niet echt het onderwerp maar wil deze tip graag delen.
http://blog.deconcept.com/swfobject/
Ideaal om flash te embedden en te laten indexeren en ook nog eens flash te activeren zonder er op te hoeven klikken (voor Explorer onder windows).