[css] hogere resolutie logo in printed media

[Verwijderd]

Ik heb een pagina die begint met een bedrijfslogo, het ding is uitgevoerd als h1:

code:

<h1>[img]"logo.gif"[/img]</h1>

nu is dit logo geoptimaliseerd voor webweergave. In de prints zou ik eigenlijk een hogere resolutie willen gebruiken, maar ik weet niet hoe ik dit het beste aan kan pakken.

Ik zou het logo als achtergrond van de h1 kunnen instellen, de alternatieve text in een span stoppen binnen de h1 en die hiden. Dan kan ik in de print css een andere achtergrond instellen. Probleem is dat ik voor het achtergrondplaatje niet de resolutie kan instellen, dus die achtergrond wordt loeigroot geprint.

Een andere mogelijkheid die ik zie is 2 plaatjes in die h1 te stoppen en dan met css de een of de ander hiden, maar dit vind ik eigenlijk ook niet echt super netjes.

[Verwijderd]

Gebruik de search en lees de FAQ en GOOGLE OOK NOG !

[drm]

JohnnyBB:
Gebruik de search en lees de FAQ en GOOGLE OOK NOG !

Duderino, anders ga je even ergens anders de moderator uithangen. En dan bedoel ik vooral: niet op dit forum, en niet in topics waar het niet nodig is

[Verwijderd]

Verwijderd schreef op 16 juli 2004 @ 13:20:
Gebruik de search en lees de FAQ en GOOGLE OOK NOG !

misschien dat jij me dan kan helpen aan een relevante searchresult? Het lijkt me duidelijk dat ik al gezocht heb uiteraard

[André]

Verwijderd schreef op 16 juli 2004 @ 13:14:
Ik heb een pagina die begint met een bedrijfslogo, het ding is uitgevoerd als h1:

code:

<h1>[img]"logo.gif"[/img]</h1>

Een andere mogelijkheid die ik zie is 2 plaatjes in die h1 te stoppen en dan met css de een of de ander hiden, maar dit vind ik eigenlijk ook niet echt super netjes.

Ik denk dat dat toch de beste oplossing is, gewoon 2 plaatjes die allebei dezelfde hoogte een breedte hebben op het scherm maar waarvan de ene 100 * 100 is en die andere 1000*1000. Nadeel is wel dat altijd beide plaatjes geladen moet worden.

[X-Lars]

Je kan toch gewoon met media="print" werken in de CSS-link? Dus twee verschillende stylesheets in je header opgeven.

[Folkert]

<link rel="stylesheet" type="text/css" media="print" href="print.css" />

Gewoon ff zoeken, gji zult zeker vinden...
http://www.meyerweb.com/eric/articles/webrev/200001.html

[ Voor 56% gewijzigd door Folkert op 16-07-2004 13:34 ]

[André]

Verwijderd schreef op 16 juli 2004 @ 13:14:
Dan kan ik in de print css een andere achtergrond instellen.

X-Lars schreef op 16 juli 2004 @ 13:32:
Je kan toch gewoon met media="print" werken in de CSS-link? Dus twee verschillende stylesheets in je header opgeven.

Folkert schreef op 16 juli 2004 @ 13:32:
<link rel="stylesheet" type="text/css" media="print" href="print.css" />

Dat weet hij dus ook wel

[ Voor 30% gewijzigd door André op 16-07-2004 13:33 ]

[X-Lars]

André schreef op 16 juli 2004 @ 13:32:
[...]

Dat weet hij dus ook wel

Dan zie ik het probleem niet zo goed

[Folkert]

Waarom zou je geen 2 plaatjes gebruiken, hoezo is dat niet netjes? Maak gewoon 2 elementen die afhankelijke van mediatype visible worden gemaakt....

[X-Lars]

offtopic:
Gaat lekker dit topic, mophor is zo nog geen steek verder geloof ik...

[Verwijderd]

nee, idd

twee plaatjes is niet zo heel netjes om de volgende redenen:
- er moeten twee plaatjes ingeladen worden, zoals Andre al aan gaf
- UA's die geen css ondersteunen laten nu twee plaatjes zien, is op zich wel weer op te lossen door de width en height op 0 te zetten (en in de css dus te resetten), maar al met al wordt het er dus steeds minder netjes op

(overigens ben ik ook bang dat er weinig anders op zit, maar ik hoopte hier op wat creatieve css ideeen )

[ Voor 14% gewijzigd door Verwijderd op 16-07-2004 13:45 ]

[André]

Misschien kun je met JS icm met het onbeforeprint event het plaatje voor het printen omwisselen

http://msdn.microsoft.com.../events/onbeforeprint.asp

Of kun je misschien niet standaard een highres plaatje neerplempen en die resizen met html?

[ Voor 4% gewijzigd door André op 16-07-2004 13:49 ]

[drm]

Ik zou eerlijk gezegd dit liever gewoon op een old-fashioned manier oplossen en danwel serversided zorgen dat het juiste plaatje er komt danwel een andere html pagina maken. Je vergooit het effect van een web-optimized plaatje (kleine grootte) namelijk nogal als je alsnog de browser vertelt dat je een hi-res plaatje wilt gebruiken op die pagina

[X-Lars]

Dan wil ik graag de vraag stellen waarom het niet lukt met 2 verschillende stylesheets (media="screen" en media="print") op de manier waarop Folkert en ik dat meldden?

[Bosmonster]

Volgens mij laadt (iig IE) geen afbeeldingen die zich in onzichtbare delen bevinden. Een img op visibility:hidden/display:none wordt dus volgens mij niet geladen, maar dit zou je even uit moeten testen.

[ Voor 4% gewijzigd door Bosmonster op 16-07-2004 14:00 ]

[André]

Bosmonster schreef op 16 juli 2004 @ 14:00:
Volgens mij laadt (iig IE) geen afbeeldingen die zich in onzichtbare delen bevinden. Een img op visibility:hidden wordt dus volgens mij niet geladen, maar dit zou je even uit moeten testen.

Volgens mij wel , anders zou hij bij het zichtbaar maken van een plaatje eerst het plaatje moeten laden en dat is niet zo. Anders zou het maken van DHTML spelletjes een crime zijn.

[Ramon]

ik denk dat de topicstarter het volgende even moet verduidelijken:

Probleem is dat ik voor het achtergrondplaatje niet de resolutie kan instellen, dus die achtergrond wordt loeigroot geprint.

[Verwijderd]

X-Lars schreef op 16 juli 2004 @ 13:57:
Dan wil ik graag de vraag stellen waarom het niet lukt met 2 verschillende stylesheets (media="screen" en media="print") op de manier waarop Folkert en ik dat meldden?

dan zou je met backgrounds moeten werken, want in css kan je niet de src van een plaatje aanpassen. Ten eerste worden backgrounds in de regel niet geprint, ten tweede is bij backgrounds de width en height of de resolutie ervan niet in te stellen, dus als ik aankom met m'n hires plaatje van 1800px is het enige resultaat een loeigrote background.

Overigens is het logo op 150 dpi in gif maar 6,5 kb, dus ik denk dat ik maar voor 2 plaatjes ga

Die js oplossing is ook wel leuk om verder mee te spelen, kom ik ook eens een ie feature tegen die wel eens handig zou kunnen zijn.

[ Voor 20% gewijzigd door Verwijderd op 16-07-2004 14:04 ]

[OzBoz]

Misschien zeg ik iets kansloos maar gewoon gedachtenkronkel. Stel nou dat je dat logo als flash ding plaatst. Das vector tenslotte. Al weet ik niet of Flash geprint wordt.

[André]

X-Lars schreef op 16 juli 2004 @ 13:57:
Dan wil ik graag de vraag stellen waarom het niet lukt met 2 verschillende stylesheets (media="screen" en media="print") op de manier waarop Folkert en ik dat meldden?

Dat geeft hij toch al aan: browsers die dat niet ondersteunen laten 2 plaatjes zien. En bij gebruik van 2 stylesheets zul je dus met een background-image moeten werken en die kun je niet resizen.

[André]

OzBoz schreef op 16 juli 2004 @ 14:03:
Misschien zeg ik iets kansloos maar gewoon gedachtenkronkel. Stel nou dat je dat logo als flash ding plaatst. Das vector tenslotte. Al weet ik niet of Flash geprint wordt.

kansloos, word volgens mij niet geprint.

Verwijderd schreef op 16 juli 2004 @ 14:02:
[...]

Overigens is het logo op 150 dpi in gif maar 6,5 kb, dus ik denk dat ik maar voor 2 plaatjes ga

Maar 6,5 kb, waar hebben we het over

[X-Lars]

André schreef op 16 juli 2004 @ 14:03:
[...]

Dat geeft hij toch al aan: browsers die dat niet ondersteunen laten 2 plaatjes zien.

Bij twee verschillende stylesheets niet.

En bij gebruik van 2 stylesheets zul je dus met een background-image moeten werken en die kun je niet resizen.

Die worden niet geprint, ze zouden ook niet geresized hoeven te worden als je twee verschillende images gebruikt als bg.

Maar goed, het punt wat ik dus over het hoofd zag was dat bg-images niet geprint worden

Zomaar een idee: kun je niet iets server-side in je css doen? Lijkt me eigenlijk niet, omdat de UA zeker uitgaat van wat er client-side aanwezig is voor het printen...

[Willem]

Ehm een logo op 300 dpi opslaan als logo2.gif kan geen kwaad
Wordt 'ie dan loeigroot geprint? Niet als je de width en height aanpast....

of raaskal ik?

[André]

willem169 schreef op 16 juli 2004 @ 14:17:
Ehm een logo op 300 dpi opslaan als logo2.gif kan geen kwaad
Wordt 'ie dan loeigroot geprint? Niet als je de width en height aanpast....

of raaskal ik?

Maar was het niet zo dat IE alles op 72 dpi uitprint? Of raaskal ik nu ook?

[Verwijderd]

nee, opzich niet, het kan ook met 1 plaatje, maar het probleem is dan dat het resizen van het plaatje voor het scherm (vooral in ie) niet mooi gebeurd, en da's erg vervelend voor een logo.

[André]

Verwijderd schreef op 16 juli 2004 @ 14:20:
nee, opzich niet, het kan ook met 1 plaatje, maar het probleem is dan dat het resizen van het plaatje voor het scherm (vooral in ie) niet mooi gebeurd, en da's erg vervelend voor een logo.

Dan zou je het alleen met 75%, 50% of 25% moeten resizen en geen tussenmaten.

[Verwijderd]

da's nog eens constructief geraaskal, blijkt maar weer eens dat we niet te moeilijk moeten denken

[Willem]

[André]

Hij's fijn

[Verwijderd]

Verwijderd schreef op 16 juli 2004 @ 14:24:
da's nog eens constructief geraaskal, [...]

hetzelfde als constructieve afbraak?

[Verwijderd]

Stop eens met dit topic te vervuilen, als er dalijk iemand zoekt op constructieve afbraak krijgt ie allemaal klets over css en plaatjes en resolutie enzo, da's natuurlijk niet wat je wilt

En bovendien, als we nog verder offtopic gaan wordt de boel dalijk nog gesloten en da's niet goed voor m'n slotjescount

[Verwijderd]

halloooo ben ik weer

de theorie was leuk, de praktijk laat echter zien dat ook al resize je het plaatje tot 25% het er op het scherm nog steeds verneukt en aliased eruit ziet. Op de print is het fantastisch nu, maar ja, het scherm wil ook wat.

Ik val dus toch maar terug op de 2-plaatjes optie

[drm]

mophor:
En bovendien, als we nog verder offtopic gaan wordt de boel dalijk nog gesloten en da's niet goed voor m'n slotjescount

Ik wilde eigenlijk net gaan laten zien wat echt constructieve afbraak is
[/off-topic]

[BtM909]

drm schreef op 16 juli 2004 @ 17:08:
[...]
Ik wilde eigenlijk net gaan laten zien wat echt constructieve afbraak is [afbeelding]
[/off-topic]

Wie weet wie deze animated gif heeft gemaakt . Het wordt tijd dat ik eens langs ga

_{want die MODS spammen deze zo vaak;}

[GX]

Is anders SVG niet een oplossing? Ik weet niet hoe ingewikkeld het logo is, maar als het een vrij simpele en strakke is moet dat best in elkaar te flansen zijn. Vectoren zijn ideaal voor dit soort doeleinden.

[/raaskal]

[André]

GX schreef op 16 juli 2004 @ 17:17:
Is anders SVG niet een oplossing? Ik weet niet hoe ingewikkeld het logo is, maar als het een vrij simpele en strakke is moet dat best in elkaar te flansen zijn. Vectoren zijn ideaal voor dit soort doeleinden.

[/raaskal]

Voor SVG ben je als ik het goed heb een plugin nodig die niet iedereen zal hebben. En dan is het nog de vraag of dat wel geprint word.

[Verwijderd]

Heel simpel hoor: je weet niet op welke resolutie geprint gaat worden. Dat is een enorm probleem.

Wil je toch een pagina met een mooi logo willen printen, dan zou ik proberen om een aparte pagina te maken voor print met een eigen (hoge resolutie) afbeelding en een eigen stylesheet. Maten geef je dan op in centimeters bijvoorbeeld. Als je aangeeft dat iets 6 centimeter breed moet zijn dan moet de printer zich daar maar aan houden.

Ik denk dat dit best lastig op te lossen is.

[ Voor 3% gewijzigd door Verwijderd op 16-07-2004 18:18 ]