WHELP! geeft advies over ontwerp, bouw en zoekmachine optimalisatie van je website. Ben je hier voor de eerste keer? Start dan bij het 4-stappenplan voor een eigen website.

tools

Screenshots maken met InstantShot

InstantShot! Als je op een Mac screenshots wilt maken, dan is te doen met de ingebouwde screenshot mogelijkheden van Mac OSX. Maar voor wat geavanceerdere screenshots is het handig om hiervoor een ander programma te gebruiken: InstantShot.

Instantshot installeren en gebruiken
1) Download het programma van de website van DigitalWaters en installeer het in je Program Files.
2) Als je het programma hebt opgestart verschijnt er een klein icoontje in de menubalk.
3) Er zijn nu verschillende manieren waarop je screenshots kunt maken: schermen of delen van schermen. Het bestandsformaat waarin je afbeeldingen kunt opslaan is helaas wat beperkt: tiff, jpg en png.

Screenshot van nu.nl

Meer lezen
Liever een ander programma gebruiken? Lees mijn artikel over 5 programma's om screenshots te maken.

» lees de rest van dit artikel

Geplaatst op 02.01.08 | Tinyurl: http://tinyurl.com/cehsml | Reageer!
Tags: | Categorie: tools

Teksten vormgeven met CSS Text Wrapper

Een ding waarin websites sterk verschillen met bijvoorbeeld kranten is de mogelijkheid om teksten op te maken. Als een bezoeker een breder beeldscherm heeft dan jijzelf kan een tekst er opeens heel anders uitzien. Als je je teksten compleet uitvult (met het CSS kenmerk justify) kan dit leiden tot witte gaten in je teksten. Vandaar dat ik teksten altijd links uitlijn. Laatst kwam ik een website tegen waarmee je eenvoudiger de uitlijning van je teksten kunt vormgeven.

Teksten vormgeven met CSS Text Wrapper
Met CSS Text Wrapper kan je de uitlijningen van je teksten een beetje beinvloeden. Bezoek de website, speel wat met de hulplijnen en de Text Wrapper maakt de nodig code voor je waarmee deze extra touch meegeeft. Fraai? Over smaak valt niet te twisten (of wel)?

» lees de rest van dit artikel

Geplaatst op 30.12.07 | Tinyurl: http://tinyurl.com/b82ea5 | Reageer!
Tags: | Categorie: tools

Je CSS stylesheets eenvoudig tweaken met Firebug

Tijdens de ontwikkeling van een website kan het maken van een stylesheet een tijdrovende bezigheid zijn: eerst een stylesheet opzetten, wijzigingen opslaan en die vervolgens bekijken in je browser. Bij elke wijziging het opnieuw uitvoeren. Ik ga er overigens even vanuit dat je geen pakket gebruikt met een WYSIWYG editor (zoals Dreamweaver). Met de Firebug plugin voor Firefox kan je jezelf veel tijd besparen. Het werkt eenvoudig: inspecteer onderdelen van je pagina, pas ze aan in je browser en – als het je bevalt – pas je code aan.

Inspecteer onderdelen van je pagina
Als je Firebug geïnstalleerd hebt, klik dan met je rechtermuisknop op een onderdeel dat je zou willen wijzigen. Ik neem even als voorbeeld de website van nu.nl. Stel je wilt in het onderstaande gedeelte de link naast de foto wijzigen. Klik met je rechtermuisknop op de link en kies 'inspect element' uit het menu.

Firebug - CSS inspecteren

 
» lees de rest van dit artikel

Geplaatst op 27.08.07 | Tinyurl: http://tinyurl.com/7q9xcs | 4 reacties
Tags: | Categorieën: ontwerp, tools

Een kijkje achter de schermen met XRAY

Als je snel wilt kijken wat de CSS code is van een deel van je pagina, maak dan gebruik van XRAY van Westciv. Een handig hulpmiddel om even een kijkje in je CSS te nemen.

XRAY installeren
XRAY laat zich installeren als een booklet. Dit is een klein stukje javascript dat je met een bookmark kunt starten. Het werkt heel eenvoudig:
1) Zet het ergens op je favorieten werkbalk.
2) Zoek de site op die je wilt onderzoeken.
3) Klik op je bookmark.
4) Klik daarna op een element in de pagina dat je wilt inzien.

Het effect ziet er als volgt uit:

XRAY

Alternatieven
Ben je op zoek naar meer informatie en meer mogelijkheden? Gebruik dan een FireFox plugin: FireBug of Webdeveloper.

» lees de rest van dit artikel

Geplaatst op 08.08.07 | Tinyurl: http://tinyurl.com/9gsdmq | Reageer!
Tags: | Categorieën: bouw, tools

De snelheid van je website meten met Pingdom Tools

Pingdom Tools - snelheid van een object Een plek waar ik graag kijk voor nieuwe ontwikkelingen is de website van Ajaxian. Hier zie je de laatste mogelijkheden ten aanzien van AJAX. Zo stuitte ik op een webpagina waarmee je de snelheid van je pagina kan testen per object in je pagina: Pingdom Tools.

Waarom het nuttig is je site op snelheid te testen
Het nadeel van het ontwikkelen van je eigen website is dat je dit meestal doet met een snelle computer en snelle verbinding. Het is dan moelijk om te ervaren hoe snel je website echt is. Bovendien heb je na je eigen bezoeken informatie in de cache van je browser, waardoor je ook een vertekend beeld krijgt.
Pingdom doet in feite je browser na die voor de eerste keer je website bezoekt. Zo weet je beter hoe je eigen site echt inlaadt.

» lees de rest van dit artikel

Geplaatst op 25.06.07 | Tinyurl: http://tinyurl.com/blvusp | 1 reactie
Tags: | Categorieën: statistieken, testen, tools
Domeinnaam vrij?

  • Test via Byte op .nl, .eu, .be, .com, .net, .org, .biz, .info, .de, .co.uk, .tv, .nu, .cn en .name
RSS