[Photoshop/HTML] Vaste schaduw rond website

[Fritsje]

Ik ben bezig met een website en nu wil ik graag rond de hele website een schaduw plaatsen. Ik weet dat ik dit kan doen door gewoon een verloop te maken van zwart naar de achtergrond kleur maar ik wil de achtergrond kleur regelmatig kunnen veranderen dus dan werkt dit niet.

Ik heb ook al geprobeerd een PNG bestandje met verloop naar een transprante achtergrond erin te plaatsen maar de kwaliteit van de verloop neemt dan erg af en dat ziet er niet mooi uit.

Een voorbeeldje van de schaduwrand die ik zoek is te vinden op http://www.tien.tv/. Hier zie je rond de complete website een kleine schaduw lopen.

Is hier nog een andere oplossing voor?

[ Voor 12% gewijzigd door Fritsje op 24-07-2007 14:12 ]

[Verwijderd]

Waar wil je die schaduw laten dan? Als ie echt 'rond de hele website' zit dan is er helemaal geen plaats voor want je browser is niet groter dan je website

[RM-rf]

PNG24 zal de enige mogelijkheid zijn, dat is de enige die 8bits alpha-transparantie kent

[Willem]

Gewoon de schaduw in de achtergrond image mikken en goed positioneren?
Lijkt me het mooist en je kunt gewoon JPG of GIF gebruiken.

[Fritsje]

willem169 schreef op dinsdag 24 juli 2007 @ 14:19:
Gewoon de schaduw in de achtergrond image mikken en goed positioneren?
Lijkt me het mooist en je kunt gewoon JPG of GIF gebruiken.

Maar als ik dan mn achtergrondkleur verander moet ik telkens een nieuwe gaan maken. Ik kan via het CMS gewoon een andere kleur aangeven en de schaduw moet dan over die kleur heenvallen.

[Verwijderd]

Aangezien je de website in Photshop hebt ontworpen kun je toch gewoon de files met schaduw opslaan en die telkens aanpassen.

[Dark Blue]

Fritsje schreef op dinsdag 24 juli 2007 @ 14:11:
Ik ben bezig met een website en nu wil ik graag rond de hele website een schaduw plaatsen. Ik weet dat ik dit kan doen door gewoon een verloop te maken van zwart naar de achtergrond kleur maar ik wil de achtergrond kleur regelmatig kunnen veranderen dus dan werkt dit niet.

Ja, dat wilde ik ook ooit...

Ik heb ook al geprobeerd een PNG bestandje met verloop naar een transprante achtergrond erin te plaatsen maar de kwaliteit van de verloop neemt dan erg af en dat ziet er niet mooi uit.

Waarom niet? Blokkerig? Hard verloop? Weinig kleuren? Sla je 'm wel op als PNG-24?

Een voorbeeldje van de schaduwrand die ik zoek is te vinden op http://www.tien.tv/. Hier zie je rond de complete website een kleine schaduw lopen.

Die zullen wel niet zo vaak hun achtergrondkleurtje veranderen, en zo wel, dan hebben ze daar een apart team voor die het geen probleem vinden om tegen uurtarief nieuwe plaatjes te gaan bakken

Is hier nog een andere oplossing voor?

Heb er ook al lang over nagedacht, en ik heb geen echte andere oplossing. Op mijn eigen website werkt het, ik gebruik een PNG die ik absoluut over mijn div heen zet. Hij is in het midden transparant en de schaduw loopt naar transparant. Ik kan de achtergrondkleur ten allen tijde veranderen, patroontje of kleurtje: no problemo. Mijn website is overal hetzelfde formaat, maar dat is gewoon een consequentie daarvan... PNG's uitrekken lijkt me niet zo'n optie.

Klik voor een voorbeeldje op m'n huisje hier links.
http://heidi.stylite.nl/uploads/images/shadow.png Dit is het plaatje dat ik gebruik.
In Photoshop moet je er wel aan denken dat je hem in een aparte laag maakt (Layer Effects -> Make Layer...) en dan kun je hem geheel afzonderlijk opslaan als PNG door de andere lagen gewoon uit te zetten. Sleep er voor het gemak even een vak omheen en copy-paste hem in een nieuwe image, zodat je geen overtollige lege ruimte uit je afbeelding moet knippen.

[ Voor 3% gewijzigd door Dark Blue op 24-07-2007 14:28 ]

[Fritsje]

Heb er ook al lang over nagedacht, en ik heb geen echte andere oplossing. Op mijn eigen website werkt het, ik gebruik een PNG die ik absoluut over mijn div heen zet. Hij is in het midden transparant en de schaduw loopt naar transparant. Ik kan de achtergrondkleur ten allen tijde veranderen, patroontje of kleurtje: no problemo. Mijn website is overal hetzelfde formaat, maar dat is gewoon een consequentie daarvan... PNG's uitrekken lijkt me niet zo'n optie.

De content van de sites zal variabel zijn dus zal de schaduw dus mee moeten rekken.

Ik weet zo 123 even niet of ik de PNG's wel als PGN24 opgeslagen heb. Ik zal hier eens mee gaan experimenteren.

[DP Kunst]

dan nog moet je er rekening mee gaan houden dat IE dit niet leuk vind. Als ik DB's plaatje bekijk in IE zie ik niets, in FF die ik gewoon een mooie schaduwrand...

[Dark Blue]

DaNiEl KuNsT schreef op dinsdag 24 juli 2007 @ 15:21:
dan nog moet je er rekening mee gaan houden dat IE dit niet leuk vind. Als ik DB's plaatje bekijk in IE zie ik niets, in FF die ik gewoon een mooie schaduwrand...

Ik heb voor IE een script ingebouwd
http://homepage.ntlworld.com/bobosola/pngtestfixed.htm
...die het op zich zou moeten oplossen. Je kunt hem niet gebruiken op achtergronden en plaatjes die kleiner zijn dan iets van 20x20 pixels ofzo. In mijn geval werkt het goed, waarschijnlijk heeft Daniel gewoon Javascript uitstaan ofzo. In mijn geval mis je ook niks aan de pagina.

Maar TS, móet je plaatje wel mee uitrekken? Kan je layout niet gewoon aan de boven, linker en rechterkant een schaduw hebben, die tot aan de bodem loopt? Of kun je de schaduw opdelen in 4 stukken, zoals een schilderijlijst? Via het PNG-in-IE script kun je hem dus niet als background plaatsen (laten herhalen) maar je zou hem met wat goor tabellenwerk - of een meerekkende div - wel 100% hoogte kunnen laten aannemen.

[Savantas]

Als je site een variabele breedte heeft, zullen neem ik aan de linker en rechterrand juist een vaste breedte hebben. Je kan natuurlijk via css zorgen dat de linkerzijde en rechterzijde een vaste afbeelding hebben waar je de schaduw dan inbakt.
Alleen als je de achtergrond ook wil door laten lopen achter je content gaat dat niet meteen werken... Afhankelijk van de achtergrond kan je dat dan eventueel iets afwijkends laten zijn.