Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Stuff They Never Taught You At Website School

3,764 views

Published on

This presentation, given at the Edge of the Web, 2009 shows some of the 10-percentaers you can do to make good websites, awesome.

Very code heavy, but aimed at beginner to mid-range coders.

Published in: Technology
  • Be the first to comment

Stuff They Never Taught You At Website School

  1. Stuff you<br />need<br />Preamble:Ruby or go home<br />For Ruby<br />Sinatra<br />http://www.sinatrarb.com/<br />Ruby on Rails<br />http://www.rubyonrails.org<br />For PHP<br />Junior<br />http://github.com/madpilot/junior<br />The World’s smallest PHP Framework†<br />+ Apache (with mod_rewrite)<br />† Probably...<br />
  2. The Setup<br />Junior:World’s smallest PHP framework<br />You will need:<br />A web server that supports URL rewrites<br />PHP 4 (5 is better)<br />
  3. The Setup<br />Junior:The guts<br />You will need:<br />A web server that supports URL rewrites<br />PHP 4 (5 is better)<br />
  4. Friendly URLS<br />Lesson 1: Make your URLs nicer<br />You will need:<br />A web server that supports URL rewrites<br />
  5. Friendly URLS<br />Lesson 1: Make your URLs nicer<br />You will need:<br />A web server that supports URL rewrites<br />
  6. Tags and Abstracts<br />Lesson 2: Dynamic Redirects<br />Moving stuff around?<br />Most would use .htaccess – not happiness<br />Store from URLS and to URS<br />Redirect with 301 Permanent<br />Bask in Google love<br />
  7. Tags and Abstracts<br />Lesson 2: Dynamic Redirects<br />
  8. Tags and Abstracts<br />Lesson 2: Dynamic Redirects<br />
  9. Tags and Abstracts<br />Lesson 3: Auto generate tags and descriptions<br />Google might not care about meta tags anymore, but some sites do. Also useful for internal search...<br />
  10. Tags and Abstracts<br />Lesson 3: Auto generate tags<br />In five easy steps<br />Strip out all the HTML and non-alpha characters<br />Split the all the text into tokens (single words)<br />Strip out common words (stop words)<br />Count the frequency of the remaining words<br />Return the top 10 (or whatever)<br />
  11. Tags and Abstracts<br />Lesson 3: Auto generate tags<br />You will need:<br />A list of stop words<br />
  12. Tags and Abstracts<br />Lesson 3: Auto generate tags<br />You will need:<br />A list of stop words<br />
  13. Tags and Abstracts<br />Lesson 4: Auto generate abstract<br />Most users will just use the first paragraph for descriptions – let’s do it for them<br />Find as many paragraphs as you can, without going over the word count.<br />OR<br />Find as many sentences in the first paragraph as you can, without going over the word count<br />OR<br />Find as many works in the first sentence as you can without going over the word count (and add a ellipses)<br />OR<br />Truncate the world’s longest word (and add a ellipses)<br />
  14. Tags and Abstracts<br />Lesson 4: Auto generate abstract<br />You will need:<br />PHP + Tidy Plugin<br />or<br />Ruby + Nokogiri<br />
  15. Tags and Abstracts<br />Lesson 4: Auto generate abstract<br />You will need:<br />PHP + Tidy Plugin<br />or<br />Ruby + Nokogiri<br />
  16. Search<br />Lesson 5: Adding Search<br />You will need:<br />MySQL with MyISAM<br />or<br />acts_as_indexplugin<br />
  17. Search<br />Lesson 5: Adding Search<br />MySQL has full text search:<br />CREATE TABLE `searches` (<br /> `id` int(11) unsigned NOT NULL auto_increment,<br /> `title` varchar(255) default NULL,<br /> `abstract` varchar(255) default NULL,<br /> `copy` text,<br /> `keywords` varchar(255) default NULL,<br /> `permalink` varchar(255) default NULL,<br /> `entry_id` int(11) default NULL,<br /> `entry_type` varchar(255) default NULL,<br /> `created` datetime default NULL,<br /> `modified` datetime default NULL,<br /> PRIMARY KEY (`id`),<br />FULLTEXT KEY `title` (`title`,`copy`,`keywords`)<br />) ENGINE=MyISAM<br />You will need:<br />MySQL with MyISAM<br />or<br />acts_as_indexplugin<br />
  18. Search<br />Lesson 5: Adding Search<br />You will need:<br />MySQL with MyISAM<br />or<br />acts_as_indexplugin<br />
  19. Search<br />Lesson 5: Adding Search<br />acts_as_indexed :fields =&gt; [ :title, :body, :generate_keywords ]<br />You will need:<br />MySQL with MyISAM<br />or<br />acts_as_indexplugin<br />
  20. Did you mean?<br />Lesson 6: Did you mean?<br />Correct misspelled search terms<br />Split the term into tokens (on spaces)<br />Spell check each token<br />If it is wrong, show the correction<br />Make the corrected string a link<br />You will need:<br />PHP + Pspell<br />or<br />Ruby + raspell<br />
  21. Did you mean?<br />Lesson 6: Did you mean?<br />You will need:<br />PHP + Pspell<br />or<br />Ruby + raspell<br />
  22. Did you mean?<br />Lesson 6: Did you mean?<br />You will need:<br />PHP + Pspell<br />or<br />Ruby + raspell<br />
  23. Clean up<br />Lesson 7: Cleaning up user HTML<br />First thing clients do: Write their copy in Word, then paste it in<br />You tell the client not to cut-and-paste word documents<br />The second thing the client does: Write their copy in Word, then paste it in...<br />Also, RTE’s produce bad code, and each produces different bad code.<br />You will need:<br />PHP + Tidy/HTMLPurify<br />or<br />Ruby + sanitize<br />
  24. Clean up<br />Lesson 7: Cleaning up user HTML<br />You will need:<br />PHP + Tidy/HTMLPurify<br />or<br />Ruby + sanitize<br />
  25. Clean up<br />Lesson 7: Cleaning up user HTML<br />You will need:<br />PHP + Tidy/HTMLPurify<br />or<br />Ruby + sanitize<br />
  26. Shpelling<br />Lesson 8: TinyMCE Spell check<br />This is a TinyMCEplugin.<br />Just need to define two JSON endpoints, and use the same library from the “Did you mean” section<br />You will need:<br />TinyMCE + Pspell or raspell<br />
  27. Shpelling<br />Lesson 8: TinyMCE Spell check<br />You will need:<br />TinyMCE + Pspell or raspell<br />
  28. Shpelling<br />Lesson 8: TinyMCE Spell check<br />You will need:<br />TinyMCE + Pspell or raspell<br />
  29. Uploader<br />Lesson 8: File Uploader<br />Why are they so HARD!? It’s 2009 for god’s sake...<br />There is an apache module. Not so good for shared servers, but it works.<br />You can use a jqueryplugin, to turn normal uploaders into better uploaders<br />Oh, if any Adobe people are here: SORT FLASH UPLOADERS OUT.<br />Also. If there is any W3C people here: LET ME UPLOAD USING AJAX.<br />You will need:<br />mod_upload_progress<br />Some jquerymagic<br />AND NOT PHP<br />
  30. Uploader<br />Caveat: PHP has not happiness<br />You CAN use the APC. It’s pretty flaky.<br />The shared memory fills up, and it breaks. #balls<br />You will need:<br />APC PECL module<br />A lot of patience<br />
  31. Uploader<br />Lesson 8: File Uploader<br />You will need:<br />mod_upload_progress<br />Some jquery magic<br />
  32. Uploader<br />Lesson 8: File Uploader<br />You will need:<br />mod_upload_progress<br />Some jquery magic<br />
  33. Uploader<br />Lesson 8: File Uploader<br />You will need:<br />mod_upload_progress<br />Some jquery magic<br />
  34. Links<br />Sinatra:http://www.sinatrarb.com<br />Junior:http://www.github.com/madpilot/junior<br />Apache Uploader: http://github.com/drogus/apache-upload-progress-module<br />TinyMCESpellchecker for Rails: http://github.com/madpilot/tinymce_spellcheck<br />Acts as Indexed: http://github.com/dougal/acts_as_indexed<br />HTMLPurifier: http://htmlpurifier.org/<br />Sanitize: http://wonko.com/post/sanitize<br />

×