Persoonlijke Informatie Filters

Op 18-04-2011 aangemaakt door Cees Rijken in de rubriek(en) Design & Layout

0

Aangezien informatie nog steeds goud waard is, zullen naar mijn idee fabrikanten zich steeds meer gaan richten op verwerkingsmechanismen voor deze informatie. En dan met name de personificatie daarvan.

Hoe bedoel ik dat? Op dit moment trekken consumenten informatie naar zich toe (pull). Of dat nu is via de televisie, de radio, de bibliotheek of (met name) het Internet. De Nederlanders die hun dag beginnen met de homepage van NU.nl, zijn inmiddels niet meer op 1 hand te tellen.

Zou het niet mooi zijn, als je als consument filters aan kon geven in de gewenste informatie? Maar dan wel filters, die zo diep gaan, dat je alleen maar bruikbare wetenswaardigheden overhoudt. Dus niet lid zijn van een nieuwsbrief of geabonneerd op een RSS feed, waarvan uiteindelijk slechts 20% interessant blijkt te zijn. Nee, een intelligent filter waarmee je uiteindelijk alleen de juiste 20% overhoudt; dus bijvoorbeeld wel informatie over het koningshuis, maar niet over de huisdieren van Willem Alexander.

Deze persoonlijke informatiefilters (of: PIF’s) zorgen ervoor dat op een door de consument te bepalen tijdstip het “verzamelen” van informatie uit vooraf geselecteerde bronnen begint. Als dit (bijvoorbeeld nachtelijke) proces is afgelopen, wordt de uiteindelijke informatie op de persoonlijke opslag van de consument aangeleverd (push), zodat deze met 1 druk op de knop dit tot zich kan nemen.

Apparaten waarop deze PIF’s geinstalleerd kunnen worden, lopen uiteen van mobiele telefoons via tablets tot aan televisie en radio. Je kunt op elk gewenst moment jouw toegespitste pure informatie tot je nemen. Zou het niet mooi zijn als je wakker wordt en jouw nieuws van de dag wordt voorgelezen over je geluidsinstallatie?

PHP variabelen vervangen door code

Op 14-04-2011 aangemaakt door Cees Rijken in de rubriek(en) Codeklopperij

0

De meeste templates engines die je op het Internet vindt, maken gebruik van de fopen en/of de file_get_contents functie. Dit werkt in principe hartstikke goed, behalve als je in je template zelf ook variabelen gebruikt, b.v. <title><?php echo $GLOBALS["applicatienaam"]; ?></title>. Deze functies lezen namelijk het bestand in als tekst en interpreteren derhalve geen “dynamische tags”. Het bovenstaande ECHO statement wordt daarom letterlijk geinterpreteerd i.p.v. geparsed.

Ik zocht een template engine die gebruik maakt van een dynamisch template EN waarbij ik zowel HTML/tekst als PHP code kan vervangen. Aangezien ik dat niet kon vinden (misschien niet lang genoeg gezocht), heb ik besloten er zelf een te maken. Onderstaande code is erg simpel en derhalve een “work in progress”…

index.php

<?php

//aanroepen van de functie-include

require_once (”function.template.php”);

//vullen van tijdelijke variabele, waarbij PHP code escaped moet worden!!

$pcontent = “<b>hier begint php: </b>”;

$pcontent .= “<?php”;

$pcontent .= ” echo ”cees”;”;

$pcontent .= ” ?>”;

//aanroepen van de functie met pagetemplate.php als template file

generateOutput(”page.template.php”,array(”pagecontent” => $pcontent));

?>

page.template.php

<html>

<title><?php echo "Dynamische titel (uit database OF globals-var etc.)"; ?></title>

<body>

hieronder gaan we de variabele "pagecontent" vervangen....

<?php echo $pagecontent; ?>

</body></html>

 

function.template.php

<?php

function templateEval($content)

{

ob_start();

$content = str_replace('<'.'?php','<'.'?',$content);

eval('?'.'>'.trim($content).'<'.'?');

$content = ob_get_contents();

ob_end_clean();

return $content;

}

function generateOutput($file,$data=array())

{

foreach ($data as $key => $value)

{

$$key = templateEval($value);

}

include($file);

}

?>

Ik heb de code bewust even non-objectgeorienteerd gemaakt, maar een en ander is natuurlijk makkelijk in classes in te delen. Ik ga ervan uit dat alle built-in PHP functies goed geinterpreteerd worden door de templateEval-functie, maar denk eraan: dit is een eerste, ruwe versie….

Gratis fonts

Op 14-04-2011 aangemaakt door Cees Rijken in de rubriek(en) Design & Layout

0

Het Internet wemelt van de freeware fonts, dus onderstaande lijst moet als “een beginnetje” worden beschouwd. De lijst is zoals altijd in willekeurige volgorde.

Aanvullingen zijn welkom, maar probeer je te beperken tot sites die echt (gratis!) fonts bevatten en niet:

  • alleen maar links naar andere sites met fonts
  • wemelen van de advertenties en/of popups

jabroo.com

Meer dan 20000 (!) gratis fonts: http://www.jabroo.com/

urbanfonts.com

Enorme collectie gratis fonts en dingbats: http://www.urbanfonts.com/free-fonts.htm

discoverfonts.com

Gebruik de index aan de rechterkant, zodat je weet dat je een gratis font download. De site bevat nl. ook commerciële fonts: http://www.discoverfonts.com

dafont.com

De fonts zijn ingedeeld in thema’s en kennen verschillende licentiemodellen. Hele ruime voorraad: http://www.dafont.com

fonts101.com

Beetje rommelige site, maar wel meer dan 18000 (!) gratis fonts: http://www.fonts101.com

searchfreefonts.com

13000 gratis fonts en veel artikelen over typografie: http://www.searchfreefonts.com

1001freefonts.com

Fonts voor de PC en voor de Mac, ingedeeld in categorieën en met zoekmogelijkheid: http://www.1001freefonts.com

fontshop.com

Heeft naast een berg downloadable fonts ook een applicatie genaamd FontStruct, waarmee je zelf fonts kunt maken: http://fontstruct.fontshop.com/gallery

lettertype.net

Een Nederlandstalige site met een ruime selectie gratis en commerciële fonts: http://lettertype.net/gratis-lettertypes-a-0.html

highfonts.com

Veel fonts en veel links naar andere font websites: http://www.highfonts.com/freefonts.aspx

blambot.com

Een kleine collectie comic-book-achtige fonts: http://www.blambot.com/fonts.shtml

larabiefonts.com

Let op: commerciële en gratis fonts staan door elkaar aan: http://www.myfonts.com/browse/foundry/larabie/

bvfonts.com

Geen enorme hoeveelheid, wel heel aparte fonts: http://www.bvfonts.com/fonts/fonts.php?show=free

fontdiner.com

Een kleine collectie retro fonts: http://www.fontdiner.com/silver2.html

acidfonts.com

6000 gratis fonts en links naar allerlei font applicaties: http://www.acidfonts.com/

fontsy.com

Mooie vormgeving en meer dan 4500 gratis fonts: http://www.fontsy.com/

eternalfonts.com

Meer dan 5000 fonts in rubrieken ingedeeld: http://www.eternalfonts.com/

fontvillage.com

Meer dan 6000 gratis fonts voor PC en Mac: http://www.fontvillage.com/

fontfreak.com

Voor een kleine bijdrage kun je hier ook alle gratis fonts in 1x downloaden: http://www.fontfreak.com/main.htm

fontface.com

1000 fonts en snel groeiende, volgens eigen zeggen: http://www.fontface.com/

fontreactor.com

Niet allemaal gratis, dus let op de “readme” bij elk font: http://www.fontreactor.com/fonts/

dailyfreefonts.com

Met de mogelijkheid om je eigen tekst in meerdere fonts tegelijk te previewen: http://www.dailyfreefonts.com/

beautifulfonts.com

Grote collectie Windows fonts: http://www.beautifulfonts.com/

fontshack.com

Grote collectie en wekelijks updated: http://www.fontshack.com/

fontmaniac.com

Grote hoeveelheid, alfabetisch gesorteerd: http://www.fontmaniac.com/

2200freefonts.com

Niet geteld, dus ik weet niet of 2200 het aantal betekent: http://www.2200freefonts.com/

typenow.net

Een kleine selectie film- en muziekfonts: http://www.typenow.net/themed.htm

showfont.net

Volgens eigen zeggen meer dan 10000 gratis fonts: http://www.showfont.net/

free-fonts.biz

Nederlandstalig, gratis en commerciële fonts: http://nl.free-fonts.biz/home.html

creamundo.com

9800 opmerkelijke fonts en dingbats: http://www.creamundo.com

typetester.org

Geen opsomming van fonts, maar wel heel handig. Op typetester.org kun je verschillende fonts met elkaar vergelijken: http://www.typetester.org/

richardsprojects.co.uk

Met de font-picker kun je de verschillende fonts op je eigen PC met elkaar vergelijken: http://richardsprojects.co.uk/products/font-picker/

typechart.com

Wil je zien hoe verschillende fonts zich gedragen in je browser en meteen de bijbehorende CSS downloaden? Kijk dan op: http://typechart.com/

Voorbereidingen iDeal Basic (ING)

Op 14-04-2011 aangemaakt door Cees Rijken in de rubriek(en) Webwinkelen

0

Voordat jouw iDeal account (of dat van je klant) wordt geactiveerd om “in het echie” betalingen te ontvangen, zijn er een aantal stappen die je moet volgen. Onderstaand verhaal gaat uit van iDeal Basic als betaalmodule en PHP als programmeertaal.

1. sleutel

Log in op de iDeal produktie omgeving (dashboard) en upload jouw geheime sleutel. Meestal staat er al een geheime sleutel klaar (b.v. onder de tab “Configuratie”) en hoef je alleen op de “Upload”-button te drukken. Vervolgens zie je een groen vinkje verschijnen.

2. notificatie

Hier kun je ervoor kiezen om de notificaties van de betalingen via email of via XML te ontvangen. Ontvangen via XML heeft zo zijn voordelen. Lees daarom ook de iDeal XML post.

Je kunt hier ook je de URL’s opgeven waar bezoekers terecht moeten komen na een transactie. Dat betekent dat ze in ieder geval op de knop “naar winkel” moeten drukken. Wat gebeurt er als ze dat niet doen? Ook hierover meer in de iDeal XML post.

Afhankelijk van het resultaat komen ze vervolgens uit bij de hier opgegeven success URL, fout URL of annuleer URL. Je kunt deze ook in je code definiëren. Kies je daarvoor, dan worden de URL’s in je dashboard genegeerd.

Je kunt voor de 3 verschillende resultaten een en dezelfde URL gebruiken, maar met een verschillende querystring (b.v. “betalingsresultaat.php?result=success”) om dan vervolgens in je code deze querystring uit te lezen.

3. herhalen

Herhaal bovenstaande 2 stappen in de test omgeving.

4. testbetalingen

De bank verwacht dat je vervolgens 7 proefbetalingen in de testomgeving doet, van 1 euro tot en met 7 euro. Hiermee boots je 7 verschillende situaties na:

  1. Success: de betaling is helemaal goed verlopen, je komt terecht op de success URL
  2. Cancelled: de betaling is door de bezoeker afgebroken, je komt terecht op de annuleer URL
  3. Expired: de betaling is verlopen, je komt terecht op de fout URL
  4. Open: de betaling staat nog open, je komt terecht op de fout URL
  5. Failure: de betaling is mislukt door bijvoorbeeld te weinig saldo, je komt terecht op de fout URL
  6. Directory Request: de lijst van gelieerde banken wordt opgehaald. Eigenlijk vindt deze test al plaats zodra je de testbetaling van 1 euro hebt gedaan.
  7. Format error: de data of het formaat daarvan is niet goed, je kunt nu niet op de knop “naar winkel” drukken en blijft in de iDeal betaalmodule

Wat de bovenstaande termen precies inhouden is op dit moment niet zo heel belangrijk. Je moet je derhalve niet af laten schrikken door waarschuwingen (in rood) tijdens het uitvoeren van de testbetalingen. Dat is juist de bedoeling.

Hoe voer je deze 7 testcases uit? Download daarvoor dit PHP-script. Dit script is getest met zeven succesvol verlopen testtransacties bij de ING bank. Er zijn 3 variabelen in het script, die je moet aanpassen aan jouw eigen situatie:

$bankUrl: dit is de URL van jouw (klants) iDeal Basic test dashboard
$key: de geheime sleutel die je in stap 3 hebt aangemaakt (d.w.z. de TEST sleutel!)
$merchantID: dit heb je van de bank (of van je klant) gekregen

Upload nu het script naar je server en roep het op in je browser. Vul het bedrag ’1′ in en druk op de submit-button. Je ziet een overzicht van hetgeen je gaat versturen. Druk nogmaals op de submit-button. Nu volgt een iDeal-scherm. Kies hier voor “Issuer Simulator” bij de optie “Selecteer uw bank”.

Druk vervolgens op “Betalen”. Tijdens elke test krijg je een melding “Controleer uw merchantReturnURL“. Dit kun je negeren door op “Bevestigen” te drukken. Uiteindelijk krijg je de melding dat de betaling successvol is en druk je op de knop “naar winkel”.

Herhaal deze procedure voor de bedragen 2, 3, 4, 5 en 7. In theorie mag je het bedrag 6 (de Directory Request-test) overslaan, omdat die al plaatsvindt zodra je de eerste test (van 1 euro) doet. Het kan echter geen kwaad om ook de betaling van 6 euro te doen.

5. controle

Je kunt nu in de test omgeving kijken of de 7 tests zijn geslaagd. Vervolgens is het een kwestie van afwachten tot de test omgeving gesynchroniseerd wordt met de produktie omgeving. Dat duurt even. Zodra in het test dashboard de tab “Activering” grijs is geworden (niet meer aanklikbaar), ben je klaar om echte betalingen te ontvangen.

XML notificatie voor iDeal Basic (ING)

Op 14-04-2011 aangemaakt door Cees Rijken in de rubriek(en) Webwinkelen

0

Zodra er via iDeal Basic afgerekend gaat worden, verlaat de bezoeker jouw website om naar de iDeal website van de aangesloten bank te gaan. Jij wilt uiteraard het resultaat van de betaling in combinatie met het juiste ordernummer in de database terugzien, om te weten of je deze klant daadwerkelijk moet gaan leveren. Hieronder staan 2 manieren om dit voor elkaar te krijgen (uitgaande van PHP als programmeertaal).

sessie

Je kunt het ordernummer in een sessie zetten en de status van de betaling uitlezen via de return URL die je in het iDeal Dashboard OF in je code hebt opgegeven. Als je voor je success URL, je fout URL en je annuleer URL dezelfde pagina gebruikt, maar met een verschillende querystring, dan gebruik je deze querystring in combinatie met de sessie. Voorbeeld:

  • Je maakt een uniek ordernummer (van bijv. 12 karakters) aan:
    $_SESSION["ordernumber"] = substr($GLOBALS["order_prefix"].mt_rand(),0,12);
  • Dit stuur je mee naar iDeal als (verplicht!) hidden veld:
    <input type="hidden" name="purchaseID" value="<echo $_SESSION["ordernumber"]; ?>">
  • De return URL’s die je hebt opgegeven zijn bijvoorbeeld:
    idealbetaling.php?result=success“, “idealbetaling.php?result=failure” en “idealbetaling.php?result=cancelled
  • In het script idealbetaling.php lees je uiteindelijk $_SESSION["ordernumber"] in combinatie met $_GET["result"] uit, om daarmee je database te updaten

Er zijn 2 absolute nadelen aan deze methode:

  • sessies kennen timeouts: als de klant besluit zijn bestelling pas af te rekenen, nadat hij een heel lange lunchpauze heeft gehad, dan is de inhoud van $_SESSION["ordernumber"] leeg.
  • als de klant na de afronding van zijn betaling NIET op de knop “Naar winkel” drukt, maar zijn browser afsluit, dan komt hij niet op de return URL terecht.

xml notificatie

Een nettere manier om het ordernummer (oftwel: purchaseID) te vangen is via xml notificatie. iDeal stuurt een XML bericht naar een door jouw opgegeven pagina. In dit bericht staan zowel het ordernummer als het resultaat van de betaling. Helaas kunnen de iDeal helpdesken je niet altijd vertellen wat een dergelijke bericht inhoudt.

Na lang zoeken, vond ik uiteindelijk een pagina op Whelp.nl van Theo Bakker, die mij een heel stuk op weg heeft geholpen.

  • Download dit bestand, pas het aan met de juiste database verbinding en upload het naar jouw webserver.
  • Login op het iDeal Dashboard en geef onder de “Configuratie”-tab aan dat je notificatie via XML moet plaatsvinden. In het veld “notificatie URL” verwijs je naar het script dat je zojuist hebt geupload.
  • Bij elke betaling die gedaan wordt, stuurt iDeal nu een ruw XML bericht naar de notificatie URL, die daar automatisch de status en het purchaseID uitpeutert en inleest in jouw database.

Het script is in een live situatie getest. Mocht je problemen tegenkomen, laat het even weten.

Zoeken naar (stock)foto’s

Op 14-04-2011 aangemaakt door Cees Rijken in de rubriek(en) Design & Layout

0

http://www.everystockphoto.com

Everystockfoto doorzoekt verschillende bronnen (oa. stock.xchng) en toont bij de zoekresultaten altijd welke licentie van toepassing is. Erg fraaie Web 2.0 vormgeving. Zie http://www.everystockphoto.com/.

http://picturesandbox.com

Okee, de weergave van de zoekresultaten komt een beetje overweldigend over en het zoeken zelf blinkt ook niet uit door snelheid, maar feit blijft dat Picturesandbox een prachtige functionaliteit levert. Zie http://picturesandbox.com/.

http://www.photoree.com

Volgens eigen zeggen: “the image bookmarking and recommendation system”…Vereist een login, op basis waarvan “jouw” favorieten worden vastgeteld, door meerdere website te doorzoeken. Zie http://www.photoree.com/photos/start.

Gratis stockfoto’s

Op 14-04-2011 aangemaakt door Cees Rijken in de rubriek(en) Design & Layout

0

Iedere designer is weleens op zoek naar gratis illustraties voor zijn/haar ontwerp, en komt dan via Google op allerlei sites terecht, die gratis lijken te zijn, maar helaas…Hieronder is geprobeerd een willekeurige opsomming te maken van foto-websites waar je niet je creditcard hoeft te trekken en die geen specifiek onderwerp hebben.

Betekent “free” op deze sites dan ook echt altijd helemaal gratis en voor niks? Niet altijd! Zonder uitgebreid in te willen gaan op de diverse licensiemodellen die er bestaan, moet je er altijd achter zien te komen of de originele fotograaf of site het goed vindt dat jij zijn kunstwerk voor jouw (commerciele) project gebruikt. Lees daarom altijd goed de voorwaarden van de desbetreffende website door, voordat je aan het downloaden slaat!

Wil je door meerdere websites tegelijk of op kleur zoeken? Kijk dan ook even naar deze post en deze post

Aanvullingen op onderstaande lijst zijn welkom! Helaas heb ik wel de comments moeten sluiten, vanwege onophoudelijke Russische spam….

http://www.sxc.hu

Volgens eigen zeggen is stock.xchng de “leading free stock photography site” (meer dan 350.000 foto’s!). Ook veel tutorials. Een (gratis) account is ook hier vereist. http://www.sxc.hu/.

http://www.flickr.com

Met meer dan 4000 uploads per minuut door fotografen over de hele wereld, lijkt Flickr groter dan stock.xchng. Behalve foto’s (in diverse formaten), ook video’s. http://www.flickr.com/.

http://www.woophy.com

Via de homepage van Woophy kun je een locatie over de hele wereld kiezen, waarbij vervolgens foto’s van een fotograaf uit die plaats getoond worden. http://www.woophy.com/photo.

http://www.photocase.com

Wederom een foto-community. Mooie foto’s, mooie vormgeving. http://www.photocase.com/en/photobrowser.asp.

http://www.stockvault.net

Uitgebreid, inclusief tutorials en artikelen. Geen account vereist. http://www.stockvault.net.

http://www.freerangestock.com

Account vereist, anders bevatten de foto’s een watermerk. http://www.freerangestock.com/.

http://www.deviantart.com

Deviantart bevat niet alleen foto’s, maar ook waanzinnige mooie digital art (interfaces, iconen, wallpapers etc). Neem even de tijd om op je gemak te bladeren. http://browse.deviantart.com/resources/stockart/?order=9#.

http://www.freedigitalphotos.net

Erg mooie foto’s, erg mooie vormgeving. Geen account benodigd. http://www.freedigitalphotos.net/.

http://www.photogen.com

Geen enorme voorraad en veel (Google Ad-Sense) advertenties. (Gratis) account vereist voor downloaden. http://www.photogen.com/free-photos/.

http://www.pixelperfectdigital.com

Voornamelijk afhankelijk van bijdragen van individuele fotografen. Ook illustraties en digital art afbeeldingen beschikbaar. http://www.pixelperfectdigital.com/free_stock_photos/.

http://www.freephotosbank.com

Overzichtelijke gerangschikt, hoewel de voorraad niet recentelijk lijkt aangevuld. Een account aanmaken is niet nodig. http://www.freephotosbank.com/.

http://www.webphotomart.com

Bevat niet alleen foto’s, maar ook clipart. Geen account nodig. http://www.webphotomart.com/.

http://www.freepixels.com

Rommelig en onoverzichtelijk. Wel mooie foto’s. http://www.freepixels.com/.

http://www.morguefile.com

Niet enorm veel foto’s, wel mooi vormgegeven. Geen account nodig. http://www.morguefile.com/archive/.

http://www.public-domain-photos.com

5000 foto’s, 8000 cliparts. http://www.public-domain-photos.com/.

http://www.freejpg.com.ar

Helaas (alleen?) spaanstalig. http://www.freejpg.com.ar/.

http://www.unprofound.com

Het zoeken op kleur lijkt niet helemaal goed te werken, maar Unprofound is gegroeid uit een prive verzameling, dus sowieso een vermelding voor een dergelijk sympathiek initiatief. http://www.unprofound.com/.

http://www.vintagepixels.com

Gericht op oudere foto’s, leuke site. http://www.vintagepixels.com/.

http://www.dreamstime.com

Let op: Dreamstime heeft ook een niet-gratis gedeelte. http://www.dreamstime.com/free-photos.

http://www.studio25.ro

Overzichtelijk en duidelijk. Account vereist. http://www.studio25.ro.

http://www.kavewall.com

Lage resoluties gratis, hoge resoluties niet. http://www.kavewall.com/stock/.

http://www.pixelio.de

Bijna 300000 afbeeldingen in 148 categorieen. Duitstalig. http://www.pixelio.de/.

http://www.fotodatenbank.com

Kleine voorraad, wel de moeite waard. Duitstalig. http://www.fotodatenbank.com/.

http://www.freeimages.co.uk/

De vormgeving is niet geweldig, maar er valt genoeg te zien. Geen account vereist. http://www.freeimageslive.co.uk/search/imagesearch.cgi.

http://www.diwiesign.com

Particuliere collectie met een industriele inslag. http://www.diwiesign.com/index.php?page=stockphotos.

http://pdphoto.org

Lijkt op iemands prive collectie, maar is zeker de moeite waard. http://pdphoto.org.

http://www.photorogue.com/

Heel leuk initiatief: iemand doet een verzoek en aangesloten fotografen maken en/of sturen de foto’s compleet kostenloos. http://www.photorogue.com/.

Afbeeldingen bij de kleuren van uw website

Op 14-04-2011 aangemaakt door Cees Rijken in de rubriek(en) Design & Layout

0

Heeft u de kleuren voor uw nieuwe of herziene website bepaald? U kunt met onderstaande website foto’s of afbeeldingen vinden in dezelfde kleurschakeringen.

Imageafter

U kiest een kleur en Imageafter.com kiest bijpassende afbeeldingen uit haar eigen database met uploaded images. Zie http://www.imageafter.com/colors.php.

Idee Labs

Idee Labs zoekt op basis van de kleur die u kiest in de colorpicker, door ruim 10 miljoen afbeeldingen op Flickr.com. Zie http://labs.ideeinc.com/multicolr.

Colorhunter

Colorhunter gaat nog een stapje verder. Je kunt hier in de Flickr.com database zoeken op tag, vervolgens zoekt Colorhunter daar de juiste afbeeldingen bij een genereert een colorpalet. Je kunt ook een eigen afbeelding uploaden. Zie http://www.colorhunter.com/.

Kleuren bepalen voor uw website

Op 14-04-2011 aangemaakt door Cees Rijken in de rubriek(en) Design & Layout

0

U wilt een website, maar u heeft nog keuze kunnen maken met betrekking tot kleuren? Hieronder staan een aantal links die u kunnen helpen om kleurcombinaties te evalueren.

www.ficml.org

Op de website van FicML kunt u gebruik maken van het “4096 Color Wheel” om 7 bij elkaar passende kleuren te kiezen. Het wiel toont meteen de bijbehorende HTML kleurcodes.

kuler.adobe.com

De Kuler van Adobe.com is een online applicatie waar geregistreerde gebruikers hun persoonlijke kleurenschema’s kunnen maken, gebaseerd op voorgeprogrammeerde compatibiliteitsregels of afgaande op hun eigen voorkeuren.

www.colorschemedesigner.com

Bij Colorschemedesigner.com kiest u een hoofdkleur en meteen worden 7 bijpassende kleuren gezocht. U kunt er ook voor kiezen om juist contrasterende kleuren te kiezen, door een ander “scheme” te kiezen.

www.somacon.com

Onderaan deze pagina van Somacon vindt u lange lijst met kleuren en kleurcodes, als een soort waaier die een schilder zou gebruiken.

www.pic2color.com

Heeft u een afbeelding waarbij u passende kleuren zoekt? Dan is Pic2Color een uitkomst. U uploadt een plaatje en deze website vindt bijpassende kleuren.

www.websitetips.com

Met de “Colorblender” van Websitetips.com kunt u 2 kleuren online mengen.

www.colorblender.com

Een soortgelijke tool is de “Colorblender” van colorblender.com, waarmee u uw kleurschema’s direct naar Adobe Illustrator kunt exporteren.

www.morecrayons.com

Met de slider van morecrayons.com kunt u experimenteren totdat u de juiste RGB-waarde heeft gevonden.

www.colortoy.net

Colortoy.net heeft de Flash Color Schemer, u kunt zelf kleurcodes opgeven of eenvoudigweg op “random” drukken.

www.colorjack.com

ColorJack opent met een scherm met allemaal kleurige blokjes. Klik erop en u krijgt suggesties voor kleurcombinaties. Deze zijn vervolgens te exporteren naar de diverse applicaties.

www.colourlovers.com

En lest best: met colourlovers.com kunt u niet alleen (de helderheid van) uw kleuren bepalen, de website bevat ook nog kant-en-klare palettes die in allerlei formaten zijn te downloaden.

Heeft u de juiste kleuren bepaald? Zoek dan de juiste afbeeldingen bij uw kleuren

zoekmachinevriendelijke URL’s

Op 14-04-2011 aangemaakt door Cees Rijken in de rubriek(en) Zoekmachines

0

querystrings naar woorden

Als je de content van je PHP-pagina’s wilt onderhouden via een database, dan zullen de URL’s al gauw het volgende format hebben: “http://www.jouwdomein.nl/index.php?id=23″. Hoewel op deze manier de juiste content wordt weergegeven, is de URL niet echt zoekmachine-vriendelijk.

Google kijkt bijvoorbeeld ook naar de woorden in de URL. Dus we zouden liever een URL hebben met de syntax: “http://www.jouwdomein.nl/tweedehands-grasmaaiers/”, maar dan wel met de content die wordt opgehaald via het databaserecord met ID 23.

met .htaccess

De methode MET .htaccess is het mooiste, maar vereist dat je (bijvoorbeeld via FTP) toegang hebt tot het .htaccess bestand. Aangezien Windows geen bestanden beginnend met een punt ondersteunt, werkt deze methode alleen op Linux/Unix-platformen. Zet het onderstaande in je .htaccess bestand en upload het naar je server:

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*) index.php

Deze code zorgt ervoor dat alle pagerequests worden teruggeleid naar “index.php”. Zet vervolgens bovenin jouw “index.php”:

// URL without mod_rewrite
// apparently the index page is called in a SEO UNfriendly manner...
if (basename($_SERVER['SCRIPT_NAME']) == "index.php" && (int)$_GET["id"] > 0)
{
$wantedID = (int)$_GET["id"];
}
elseif( (int)array_pop(explode('-', $_SERVER['REQUEST_URI']))>0 )
{
// URL with mod_rewrite
// the index page is called with dashes (Google friendly)
// the htaccess redirects it to index.php and the scripts reads the INTEGER value of the last array item...
$wantedID = (int)array_pop(explode('-', $_SERVER['REQUEST_URI']));
}
else
{
// the index page is called without querystring AND without dashes, so we need to use a default value
$wantedID = 777;
}
echo "Querystring for your database is:
";
echo "select * from <table> where ID=".$wantedID;

Deze PHP code zorgt ervoor dat altijd het juiste ID wordt gefilterd. Het eerste if-statement kijkt of de zoekmachine-onvriendelijke manier wordt gebruikt (“index.php?id=23″). Zo ja, dan wordt het ID 23 in een variabele gestopt.

Het tweede if-statement breekt de URL op in een verzameling strings, die worden gescheiden door streeps (dashes). Google ziet deze streepjes namelijk als spaties en zo kun je verschillende losse woorden gebruiken. Vereiste is wel dat de string achter het laatste streepje het juiste ID bevat. Met andere woorden: de URL krijgt de volgende syntax: “http://www.jouwdomein.nl/tweedehands-grasmaaiers-23/”. Ook hier wordt weer ID 23 in een variabele gestopt.

Als niet de zoekmachine onvriendelijke URL wordt opgeroepen en ook niet de vriendelijke, dan wordt “index.php” blijkbaar zonder toevoegingen aangeroepen, logischerwijs vindt dit plaats als de hele domeinnaam wordt aangeroepen (http://www.jouwdomein.nl) zonder extra’s. Om te zorgen dat dan evengoed de juiste content wordt getoond, kun je hier het ID van de homepage als contante neerzetten. In dit voorbeeld is dat ID 777.

WordPress gebruikt deze methode ook en heeft in het admin panel een tool opgenomen om dit makkelijk voor je te regelen (vereist wel dat je .htaccess writable is!). Zie http://codex.wordpress.org/Using_Permalinks.

zonder .htaccess

Als je geen toegang hebt tot het .htaccess bestand, kun je helaas niet de requests herleiden naar “index.php”. Dit betekent dat “index.php” altijd zichtbaar zal blijven in de URL, wat weer tot gevolg heeft dat je geen streepje direct achter “index.php” kunt gebruiken.

“http://www.jouwdomein.nl/index.php-wat-dan-ook” zal namelijk altijd tot een 404 (Not found) melding leiden. Je kunt dat eerste streepje wel vervangen door een forward slash (/). De browser zal dan namelijk denken dat het hier om subfolders gaat.

Met behulp van bovenstaande PHP code kun je dan URL’s vormen in de vorm van “http://www.jouwdomein.nl/index.php/tweedehands-fietsen-23/”). Minder fraai dan de eerste methode, maar nog steeds met zoektermen in de URL….

wanneer handig?

Stel dat je op basis van het pageID verschillende content toont (index.php?pageID=12). Veel statistiekenprogramma’s (w.o. Google Analytics) kunnen geen rapporten genereren op basis van individuele querystrings, terwijl je wel wilt weten wat de specifieke bezoekersaantallen van pagina 12 zijn. Door de querystring te vervangen door een geformatteerde URL, kun je een dergelijke meting een stuk eenvoudiger uitvoeren.