.psd in css

Status
Niet open voor verdere reacties.

maarten54321

Gebruiker
Lid geworden
7 nov 2010
Berichten
121
Hallo iedereen,

Hoe kan je een .psd bestand omzetten?
Het is voor een website te maken.

Alvast bedankt!
 
met alleen .css kom je er niet, .html heb je ook nodig, wil je dat gebruiken.
 
.css en .html? Heb ondertussen de term al gevonden: slicen ofzo...
Als je op sitedeals.nl kijkt en andere dan zie je templates met zeer grote afbeeldigskwaliteiten.
Wat is de file van zo een afbeeldig. Heb adobe photoshop.
 
Eventjes heel simpel uitgelegd, wat je niet snapt, moet je ff vragen: Je maakt een site compleet op in photoshop (72DPI, bijv. 960px. breed en 1300px. hoog) inclusief tekst en alles, mocht je dat willen. Dan slice je het doormiddel van het slice-gereedschap, en ga je naar bestand > opslaan voor web en apparaten > instellingen mogelijk aanpassen en opslaan als afbeeldingen en/of .html bestanden. De .css kun je zelf daaruit opmaken, met de basiskennis, als je die hebt.
Makkelijkste tools om te hebben: Photoshop natuurlijk > Dreamweaver > Fireworks
Succes!
 
Zeker bedankt voor je reactie! Ik begin het te begrijpen, maar dreamweaver is niet echt iets voor mij. Ik houd ervan om gewoon te programmeren met kladblok. Maar hoe zou ik te werk moeten gaan. Ik maak mijn hele lay-out en dan zou ik hem moeten knippen?
 
Ja, dat klopt.
  • Maar waar je de schaar er in moet zetten, is helemaal afhankelijk van het ontwerp:
  • Wat je van plan bent met bv. de blokken waarin het menu en de inhoud gaat komen.
  • Voor een zich horizontaal of verticaal herhalende background heb je maar een klein strookje nodig.

Ook moet er rekening mee gehouden worden op welke plaatsen de pagina moet kunnen groeien in hoogte, als er meer inhoud op komt, of als de bezoeker een groter letterformaat in z'n browser instelt.
In de praktijk:


  • Voorbeeld van een pagina die gemaakt moest worden: deze.
  • En de routebeschrijving om daar met zo min mogelijk *) en zo klein mogelijke images te komen staat in dit topic.

  • Andere routebeschrijving, voor een ingewikkelder pagina: Reisverslag uit Cascade-land.

Met vriendelijke groet,
CSShunter
__________
*) Op die automatische slice-programma's heb ik het niet zo begrepen. Die maken er vaak te veel kleine of onhandige onderdelen van, of juist veel te grote stukken, omdat ze niet weten hoe de html pagina-structuur is waar alles in opgenomen moet worden. Dan gaat de vorm de structuur of de inhoud bepalen, en kom je al gauw scheef te zitten: "het past er niet op". Vormgeving, structuur en inhoud moeten samen op gaan.
Of slice-tools maken er tabellen van, waarmee ook de raarste dingen gaan gebeuren (en die ook niet voor opmaak bedoeld zijn).
- En die programma's zijn nog duur ook!

Maar met kladblok en een tekenprogramma ben je er al. :)
En een velletje A4 om een schets te maken van wat je precies wilt, en waar de flexibiliteit van de pagina moet zitten
 
Laatst bewerkt:
Bedankt voor je reactie! Dus als ik het goed begrijp is een lay-out op sitedeals gewoon een afbeelding en een template de gecodeerde lay-out?
 
Een "template" is een compleet sjabloon voor een website. D.w.z. een kant-en-klaar model dat bestaat uit:
  • Eén of meer html-pagina's, waarin de structuur van de site is vastgelegd: de opbouw en volgorde van de onderdelen (kop, menu, zijkolommen, inhoud-gedeelte, voertregels, enz.).
  • Een css-bestand waarin de bijpassende opmaak wordt geregeld (Hoe hoog is de kop? Wat is de afstand van de links in het menu ten opzichte van elkaar? Hoe breed is de linkerkolom? Welke lettertypes en -formaten zitten in de verschillende blokken? enz. enz.).
  • Een aantal afbeeldingen die bij de opmaak horen: bv. een verloop-kleur voor een achtergrond, versierings-elementen, enz. Soms ook voorbeeld-afbeeldingen die in de inhoud komen te staan.
  • Eventueel één of meer javascript-bestanden, als er speciale functies in de site zitten (bv. een automatische diavertoning).

Templates kunnen alleen de basis van een site vastleggen of heel gedetailleerd zijn.
Bij een gedetailleerd template hoef je alleen maar de inhoud in de pagina's in te vullen en er je eigen afbeeldingen in te zetten.
Bij een basis-template (bv. zoiets; en bv. hier of hier onder CSS-Layouts in uiteenlopende soorten te vinden) moet je er meer aan doen, dan heb je alleen een goed schema om op verder te bouwen.
Templates kunnen gratis zijn (zoals bovengenoemde opmaak-modellen), maar ze worden ook te koop aangeboden (zoals via sitedeals, en op veel speciale template-sites). Bij de gratis templates zitten vaak demo's, en kan je proberen hoe een template het doet. Bij de sitedeals zie ik die niet, en moet je er op vertrouwen dat ze goed werken, en het goed doen in alle browsers (browserversies) en beeldscherm-formaten.
Voor Joomla- en Wordpress-sites zijn er bv. bijzonder veel gratis templates te vinden.

Maar dit is allemaal heel wat anders dan een psd slicen. :)
Bij het slicen van een psd ben je in feite bezig je eigen template te maken!

Met vriendelijke groet,
CSShunter
 
Bedankt voor al je reacties! :D
Ik begrijp nu wat slicen is...
De .psd wordt er gewoonlijk bij gegeven voor aanpassingen en de .png voor de css.

Bedankt! :D
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan