We streven altijd naar een perfecte implementatie van het ontwerp, zodat de website zoals deze online wordt weergegeven, exact overeenkomt met de ontwerpbestanden. Onze eigen vormgevers beoordelen ons werk altijd voordat het wordt vrijgegeven en geven feedback en aanpassingen door aan onze ontwikkelaars als dat nodig is.
Sommige ontwerpen zijn eenvoudiger te implementeren dan andere - dit vertaald zich dan ook in minder tijd en geld en we hebben hieronder een lijst met aanbevelingen opgesteld over de manier waarop ontwerpen het beste voorbereid en aan ons aangeleverd kunnen worden.
Dit zijn richtlijnen, omdat trends en technologieën veranderen, zullen we deze lijst regelmatig bijwerken om optimaal samen te kunnen werken.
Ontwerp / lay-out bestanden
- Lever ontwerpen als gelaagde photoshop PSD-bestanden aan, waarbij alle lagen een betekenisvolle naam krijgen
- Maak voor de beste resultaten een ontwerp voor elke pagina of elk paginatype dat op de site nodig is
- Het beste is om naast de PSD-bestanden ook PDF-bestanden aan te leveren
- Als je slimme objecten of gekoppelde bronnen gebruikt, vergeet deze dan niet bij te sluiten bij het verzenden van de bestanden
- Stel kleuren in de RGB-modus in, en geef voor specifieke kleuren voor de tekst, enz. de HTML / hex-kleur op
- Voor mobiele / responsieve ontwerpen (formaat wordt aangepast voor telefoon en tablet), lever je ontwerpen aan voor de pagina's in deze formaten, of we gebruiken standaard breekpunten om de grootte van de site op een standaard manier weer te geven
- Standaard breedtes:
- Desktop: 1170 px
- Tablet (liggend): 992 px (bureaublad zou kunnen worden gebruikt voor tabletlandschap, maar er kunnen problemen zijn met menugevoegdheden, brede elementen op de pagina, enz.)
- Tablet (staand): 768 px
- Telefoons: 768px
- Standaard hoogte:
Die bestaat er niet echt. Apparaten zijn er in alle maten, scrollen van pagina's zijn tegenwoordig de norm en het is niet aan te raden om in een specifieke hoogte te ontwerpen. Als je de hoogte wilt beperken, zorg er dan voor dat je jouw Photoshop-bestanden op de juiste manier in grootte indeelt en laat ons dit weten zodat we er rekening mee kunnen houden. - Resolutie:
maximale schermresolutie is 96 dpi / ppi op Windows en 72 dpi / ppi op Mac, alles daarboven werkt, maar als afbeeldingen moeten worden opgeblazen of geprint, is een hogere resolutie vereist. (als je tijd hebt en meer wilt weten, kijk dan eens op: https://en.wikipedia.org/wiki/Dots_per_inch#Computer_monitor_DPI_standards
Lettertypes
- Geef de grootte op in pixels
- Houd je aan webveilige lettertypen (die de meeste mensen op hun computer hebben), of voor een grotere variëteit aan de Google-lettertypen, die in alle browsers https://www.google.com/fonts zullen werken. Als je geen lettertypen gebruikt waartoe iedereen toegang heeft, zullen sommige mensen de site niet zien zoals je wilt dat deze wordt gezien.
https://www.typetester.org/ heeft een geweldige site waar u websafe en google fonts kunt bekijken en vergelijken.
Pictogrammen
- Voor pictogrammen (startknoppen, sociale media, e-mailpictogrammen, enzovoort) raden we aan de Font Awesome-bibliotheek te gebruiken (https://fontawesome.com)
- Je kunt afbeeldingen gebruiken voor pictogrammen, maar de pictogrammen vuit het lettertype Awesome laden sneller en schalen erg mooi
Afbeeldingen
- Als we afbeeldingen moeten plaatsen, lever deze dan uitgesneden aan. Het liefste hebben we webgeoptimaliseerde png-bestanden voor illustraties en jpg-bestanden voor foto's. We ontvangen ook graag het originele bronbestand, voor het geval dat we aanpassingen moeten uitvoeren
Algemeen
- Lever een branding- en stijlgids mee met daarin de volgende zaken: lettertypefamilie, lettergroottes, kleuren, lettertype stijlen, dwz: titel, ondertitels, hoofdinhoud, links en knoppen, geordende lijsten, ongeordende lijsten (opsommingstekens), waarschuwingen, accordeons, formuliervelden, enz.
Inhoud
- Als je ook wilt dat wij de teksten plaatsen, lever die dan aan in Word-bestanden (of andere losse tekstbestanden), waarbij elke pagina duidelijk wordt aangegeven, evenals de positie op de pagina waar de tekst moet komen te staan als het onduidelijk is (bijvoorbeeld als een pagina bijvoorbeeld drie verschillende tekstgebieden heeft, laat ons dan weten welk stukje tekst naar welk gedeelte gaat)
Op deze webpagina kun je nog meer goede tips voor het aanleveren vinden: https://tmpworldwide.github.io/uid/photoshop-guidelines/
Mocht je vragen hebben of opmerkingen, neem dan contact met ons op. We stemmen graag alles zo goed mogelijk met je af.