Hacker News new | past | comments | ask | show | jobs | submit login
Show HN: The Cross Browser Handbook (crossbrowserbook.com)
22 points by dherken on Nov 29, 2012 | hide | past | favorite | 12 comments



Congrats on launching the book!

The landing page looks really familiar...[1] It's fine, but next time please ask before borrowing my code and designs.

Good luck with the launch. I hope you sell a lot of copies.

-Nathan

[1] http://nathanbarry.com/app-design-handbook


How embarrassing :D That happens if one get's the courage to create a book by reading all your blogposts...

I'm sorry...


No worries, I've made my share of mistakes. Glad to hear my posts were helpful and inspiring. I really do hope your book does well!


Thanks!


Did you make some changes?

What I'm seeing doesn't look that much like the other guy's page...


Please go through and compare the two pages section by section and by the end of the page I think you'll see that the design is not just inspired by Nathan's page, but an unattributed derivative work.


Are we talking about the same thing?

http://www.crossbrowserbook.com/

and

http://nathanbarry.com/app-design-handbook/

???

Can you list a few items that you think are unique on the original site? I'm really struggling here.


It looks pretty identical to me ....


What this intentional?


Looks pretty promising.

Would be helpful if you could expand on the code templates and code workshops, since it effectively costs double the price of just the book.

Best of luck.


Seems very promising!

A few samples or demo code would be great though. Just to check how basic/intermeditate/advance code and concepts are.


Some accessibility, usability, SEO and compatibility issues you might want to take a look at:

- Check out your favicon, it doesn't work in IE8, perhaps due to non-standard size, mime-type or non-ico format.

- Strip out the inline CSS.

- The Gothic font has no solid baseline in IE8. The individual letters jump up and down 2-3 px. Perhaps a Fontsquirrel issue?

- The social media buttons hug the browser toolbar. In some browsers there is just a few pixels between clicking Tweet and clicking a bookmark.

- Add alt-attributes to all images, empty if decorative. Specifying width and height will help with rendering or when the images won't load.

- Test your site with noscript. The fall-back font isn't sized properly and lacks enough line-height, so sentences overlap and lay-out breaks.

- Did you forget to style your footer? It uses the browser standard Times New Roman font for me.

- Declare (UTF-8) charset at the document level.

- <a name="foo"> for internal anchors is obsolete.

- Add spacing between links and words: "$129<span>Buy It</span>" or else without styling or for screenreaders it will read: "$129Buy it"

- If you want to support older browsers lack of PNG alpha support, simply bake your PNG's with the website background, convert to 8-bit or add PNG alpha support with javascript or .htc

- Specify canonical or make sure your site serves only one unique page per URL: non-www and www redirects, remove or add trailing slashes, "index" added to the URL's or without, use lowercase in your URL's (both uppercase and lowercase letters return the same page). A combination of the above can result in 256+ different URL's returning the same page.

- Encode spaces or replace them with dashes, for example when linking to your sample chapter PDF.

- http://www.crossbrowserbook.com/Knowledge/index renders differently in different browsers (whitespace near the end). It also lacks a header or footer, so no way to return: visitor trap. On that page a spelling error "startet".

- Consider using summary, <thead> and <tbody> for relational tables, like the browsersupport tables. No alt-attribute on the browser logo's makes this table unusable for the vision impaired.

- Facebook button is in German.

- Study your pagetitles and see if you can target them more. Consider adding the site title. Consider adding a meta description. Consider adding a sample chapter as HTML content to the website. Consider supporting Chrome Frame and future versions of IE (<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />).




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: