Jump to navigation

Valid HTML - iameven.com

- Even Alander

You will not believe what happened to this guy when he ran his web site through a validator.

I was informed about a couple of errors on my site. For one thing, I moved the logo and forgot to update the path. There was also a couple of title related CSS bugs. On my way to fix them I discovered a whole bunch of other problems.


A screen shot of my two title related css bugs

I choose to call them bugs, but I just didn't acount for a couple of mobile browser cases, leading to less than ideal design. To get around the first one I needed to set a max width on the title text. If you look at my HTML you'll see that I have everything wrapped in a link and various parts are targeted using spans. At least on chrome I'm fixing the overlap by setting display:block and adding a width. It doesn't affect wider views, but helps a lot on small ones.

The other one was a bit more tricky, as I have these links that appear on :hover. I needed to move the whole text as a block out, and then drag it back to the left. My previous version used text-indent which only worked on the first line as seen in the screen shot.


I had defined a whole bunch of redirects, but they didn't work. Turns out I managed to delete them at some point. And since I didn't ever plan to delete them I never thought to re-add them. Looking at code I wrote quickly, years ago, is never much fun, but I do wonder how I got it to work then. They didn't work now. One script parsed a list of paths (from eg. /music/fine-day) and urls/paths (to eg. /fine-day), to break up the first path into sub directories and add a empty html file. The other script took the to parth and did a sync to s3 adding a redirect meta data field. I was able to simplify that quite a bit by just spawning the aws-cli from the first script. Just wait to the file was created then use spawn from the child package. So now the script creates the directories before it tries to write the empty HTML file and spawns that process, meaning I can have it as a part of my publish script. I also added the redirects as info to the 404 page.


I have one. But it didn't work with utf-8, and it was a bit boring. Decided to spice it up a bit by adding some build info.

Valid HTML

Somehow my page did not pass the w3 HTML validator. How was I able to live with that? I somehow trusted myself to write valid HTML and just never bothered to verify I guess. One of the things I was not aware of is that style and script tags do not require a type attribute with the default values, and the validator throws a warning about that. The one blunder I'd done, was to not escape a value in the head section. So if I had quote marks in the ingress they would break the HTML when being added to the meta:description part in the head. While I visited that section I decided to tidy it up a bit. I even added some comments. The other complaint was about missing alt attributes on images. Still haven't gotten around to fixing all of those, so some pages will not validate.


Nothing. Nothing special at least, happened, when I ran the validator. I was a bit surprised.

I've looked at a couple of solutions to pretty print the HTML but nothing came out perfect, so I guess what I have will have to do for now. No Even, you're not going to write a pretty printer for HTML, it will not happen, don't even start, seriously, don't...

  1. iameven.com
  2. : Fragment Identifiers
  3. : Valid HTML
  4. : 2017
  5. : Nostalgia driven web design
  6. : Lynx
  7. : The ssstraight story
  8. : Tetris
  9. : Snake
  10. : Post install
  11. : Re-building this website
  12. : Post stats 2014
  13. : Optimizing for git
  14. : Digging through old files
  15. : Arduino Uno
  16. : Building this website
  17. : Getting myself a logo
  18. : Warm Echo
  19. : Recent events
  20. : WTF, Spotify?
  21. : Numusic and Nuart
  22. : U don't simply uplay
  23. : Playing with time lapse
  24. : WZ
  25. : Fine Day
  26. : Restoring iameven
  27. : Ableton push
  28. : Ghost - Light weight Wordpress
  29. : Everything on the net should be dated
  30. : Euro Offshore container
  31. : Niels Juels street
  32. : Kverneland Næringspark
  33. : Hiking
  34. : Fume Tests
  35. : More Lexi pictures, in Sandveparken
  36. : Trustbuddy
  37. : Lexi visiting the beach
  38. : A Bit Weird
  39. : Weekend trip to Sirdal
  40. : Old sketches
  41. : Håvard's post stats
  42. : Rant about airports
  43. : The Good Old Days
  44. : Beetle
  45. : 206
  46. : Phone sketches
  47. : Noroff 3DDA
  48. : Panorama pictures, Sola and Stavanger