Webdesign

Webdesign - tools.

Zoals een timmerman een goed stuk gereedschap nodig heeft om efficient en professioneel te werken, zo heeft ook een webontwerper / webdesigner de juiste tools nodig.

Het onderstaande overzicht bevat naast links naar validatieprogramma's, HTML-editors, diverse handleidingen en fotobewerkingsprogramma's ook een klein overzicht aan handige hulpprogrammaatjes.

Webdesign - HTML en CSS tools

  • Validatie - fouten opsporen
  • Editors
    • 1stPage 2006 goede, gratis HTML editor.
    • AceHTML 5 Freeware uitstekende teksteditor met hele handige functies, zoals: het vervangen van tekst in meerdere documenten en een ingebouwde HTML validator.
    • Arachnophilia tekst-gebaseerde HTML-editor. Versie 4.0.
    • Developers Pad
    • HTML Beauty ++
    • HTML-Kit een zeer goede gratis HTML editor met uitstekende ondersteuning voor XHTML en XML.
    • Matrix Y2K: uitgebreide HTML editor van een Nederlandse maker. Daarom is er natuurlijk ook een Nederlandse vertaling aanwezig voor dit programma. Met de file manager kan makkelijk gebladerd worden naar bestanden die je wilt bewerken. Ook is er syntax highlighting en is HTML tidy aanwezig. Een prima programma.
    • NotePad een uitstekende gratis editor, met handige functies als: het vervangen van een tekenreeks in meerdere documenten, het opslaan van alle geopende documenten in hun respectievelijke formaat... etc. met een duidelijke User Interface. Een aanrader dus!
    • Tip! NoteTab Light wederom een uitstekende gratis editor, met veel handige functies als: het vervangen van een tekenreeks in meerdere documenten, het opslaan van alle geopende documenten in hun respectievelijke formaat... etc. en een duidelijke User Interface. Een aanrader dus!
    • SNS HTMLedit
    •  
  • Apple Macintosh editors

Webdesign - handleidingen

  • HTML CSS
    • Handleiding HTML Een prima handleiding met voorbeelden voor HTML en CSS. Hoewel wat academisch opgezet is deze handleiding zeker een aanrader, al was het alleen maar als naslagwerk en het feit dat deze handleiding in het Nederlands is.
    • De Webmees Als u een uitvoerige handleiding zoekt voor zowel HTML, CSS alsook voor tips voor het toepassen van Javascript, Flash etc. bent u bij de Webmees aan het juiste adres.
    • WDG CSS reference Een prima naslagwerk voor CSS stijlregels.
    • WDG Toegankelijkheidstips Eigenlijk meer een naslagwerk voor toegankelijkheid, maar mag zeker niet ontbreken in dit lijstje.
  • Zoekmachine optimalisering

Webdesign - toegankelijkheid / accessibility

  • Diverse testprogramma's voor toegankelijkheid
    • Stichting Bartiméus Accessibility Alles over toegankelijkheid van internet en software. Hoe toegankelijk is uw website? Test het met een aantal programma's online. Bekijk uw website ook eens zoals een zoekmachine deze ziet: Lynx-viewer.
    • Vischeck Bevat uw website wel genoeg contrast tussen tekst en achtergrond? Zie hoe uw website er uitziet voor iemand die 'kleurenblind' is met Vischeck.
    • Cynthia Says Test uw website op toegankelijkheid volgens de 508 en WCAG standaarden.
  • Browser simulatie programma's
    Bij de toegankelijkheid van een pagina behoort natuurlijk ook de mogelijkheid uw webpagina te bekijken in diverse ander browsers. Was Internet Explorer jarenlang oppermachtig, wordt het vandaag de dag steeds belangrijker dat uw site ook in andere browsers goed werkt en er goed uitziet.
    • iCapture Uw mooi opgemaakte pagina funktioneert in Internet Explorer, dat is al heel wat denkt u. Toch? Nou, bekijk uw website eens zoals een browser als Safari, gemaakt voor de Apple Macintosh hem laat zien. Wellicht kan het toch nog beter! Gratis en online!
  • Browsers
    Daarnaast is het natuurlijk verstandig gebruik te maken van andere browsers dan IE op uw computer. Niet alleen vanwege de vele veiligheidsrisico's die IE met zich meebrengt, maar ook om te testen hoe uw pagina er in die browsers uitziet.
    • FireFox Een prima alternatief voor IE. Gratis te downloaden en zonder problemen naast IE te installeren.
    • Opera Na jarenlang slechts tegen een vergoeding verkrijgbaar te zijn geweest, is ook Opera nu gratis te downloaden. Het kent vele handige funkties waaronder bijvoorbeeld het bekijken van uw site op een formaat waarop PDA's deze vertonen (shift-F11). Ontdaan van alle opsmuk en erg smal.

Webdesign - afbeeldingen maken en bewerken

Webdesign - kleurenwaaiers - kleurcombinaties kiezen

  • Colormatch
    De oude vertrouwde Colormatch. Een simpel en effectief programma dat een 3-tal bij elkaar passende kleuren berekend. Jammer alleen dat niet de volledige functionaliteit ook in Mozilla en FireFox gegeven is.
  • Color Schemer Online
    Online programma dat een kleurenwaaier berekend met 16 kleuren. Naar mijn smaak teveel en sommigen niet passend.
  • Color Scheme Generator 2
    Een zeer uitgebreid programma waarmee kleurcombinaties kunnen worden berekend, omgezet naar pasteltinten, contrastkleuren worden opgegeven en de kleuren zelfs kunnen worden weergegeven zoals visueel gehandicapten deze waarnemen. Tip!
  • Color Blender
    Na twee kleuren opgegeven te hebben, berekend het programma een kleurverloop. Een handig programmaatje, vooral ook doordat de html-pagina lokaal opgeslagen kan worden.
  • Colormatcher
    Een zowel lokaal als online te gebruiken programma dat gebaseerd is op Java. Simpel in gebruik, maar snel irritant door z'n pop-up achtige structuur.
  • Eclipse Palette download from softpedia TIP!

    Een erg handig klein programma dat werkt op bijna alle Windows versies. Snel een kleur kiezen vanaf om het even welk programma, website etc. u ook op het scherm heeft staan? Dan is dit echt een aanrader, het geeft onmiddelijk de kleur in gradaties de rgb-waarde van de gekozen kleur en de mogelijkheid deze te mixen met een andere kleur.

    Eclipse Palette genereert de kleurwaarden in de volgende formaten:

    • HTML #FFFFFF
    • raw 32-bit integer
    • Visual Basic &hFFFFFF
    • Visual Basic RGB(255, 255, 255)
    • C++, C#, Java 0xFFFFFF
  • Degraeve Color palette een handige online-tool om kleuren te destilleren uit een foto. Door simpelweg een foto te uploaden verkrijgt u een set van de hoofdkleuren die zich in de afbeelding bevinden.

Goed webdesign begint bij:

  • Functioneel ontwerp
    Het functioneel ontwerp geeft inzicht in de structuur en opbouw van de te bouwen website. Het is een schematisch overzicht dat de antwoorden van de vragen; "Welke informatie moet erop komen? Welke informatie moet er niet op komen? Voor wie is de informatie bedoeld? Hoe wordt informatie ontsloten en beschikbaar gesteld? Welke techniek wordt gebruikt?" etc. bevat.
  • Webdesign tools
    Links naar handige programma's en tools voor het maken van een goed webontwerp.
  • Webontwerp - toegankelijk bouwen
    Toegankelijk bouwen, ook wel accessibility, wat is dat en waartoe dient het?
  • Webdesign - Inhoud
    Mensen zoeken naar informatie, uitleg over hoe bepaalde zaken werken, wat er gebeurde op een bepaalde datum of simpelweg vermaak in de vorm van verhalen en anekdotes. Als u daarbij in acht neemt dat we in een informatietijdperk leven, begrijpt u waarom inhoud het hart van uw webontwerp is!
  • Webdesign - Tips
    Hoe en waarmee maak je een goed webontwerp en waar moet je op letten bij het bouwen van je website?
  • Webdesign missers
    Miskleunen, missers en doodzonden in webontwerp.
  • Webdesign - Font kiezen
    Welk lettertype - font gebruikt u voor uw website en hoe wordt deze opgegeven.


Webdesign

Categorieën:

Referenties