SnippShot is a free online code snippet collector tool. The snippets are stored online and since it is web based, you can access them from any computer, platform and browser without the need to install any additional software. The interface is ultra-minimalistic which makes it really easy, simple and quick to use, you can even start using it without reading any instructions.

SnippShot video tutorial

How to use SnippShot

That’s simple! It is what you see in the image: a big textarea on the right, a list on the left and a text box at the top left.

Creating a code snippet

Type in at the top left box and press Enter.

Editing/Saving a snippet

Edit the code and it will be saved real-time. No need to press any buttons, close the window and it will be saved for the next time (when you edit the code this will turn red, wait 1 second until it turns black again).

Loading a snippet

Just click on it, the code will load on the right panel.

Searching for a snippet

Type in at the top left box to search automatically as you type .

Renaming a snippet

Double click the name in the list and a window will let you change it.

Deleting a snippet

Double click the name in the list and rename it to nothing. Confirm.

SnippShot Bookmarklet

What makes SnippShot really handy is the use of its bookmarklet. At the right top of the app there is a link called “snippshot”. Drag and drop it to your bookmarks folder to create a Bookmarklet. Then click on it whenever you want and SnippShot will appear in a window, you can resize it the size you want.

No account required

Oh, and what’s best of all is that you don’t even need to register, just to own a Google Account.

Some technical details

• There’s just one server request per action
• SnippShot loads really fast because it doesn’t use any images at all (it uses CSS3 for all the website styling and even an embedded Base 64 image in the style sheet for the favicon)
• and it works really fast because everything is loaded dynamically through AJAX and JSON/XHTML calls, no apparent loading times when using it

The user interface is just what you see in the screen: no menus, no links. The user experience can be described as click and type.

Modern compliant browsers should see the beautiness of CSS3. As HTML5 support increases SnippShot will progressively upgrade to it.

To avoid server overload and keep the service quick they are limiting each snippet code to 64kb and a limit of 100 per user (more than enough, I am currently using 78 and can’t think of anything else to note down). They accept donations to eventually upgrade the server and increase the limits and add new functionalities.

Check SnippShot now

The website is snippshot.com and it is completely free. Check it out and let us know what you think.

snippshot.com

Here’s a check-list of terms that every Web Designer or Developer should know. It’s not an extensive tutorial with long definitions, just a list to check how much you know. The purpose of this post is basically intended for non-native English speakers that work in English design agencies so some of the words you’ll see here are really basic (although frequently used while at work).

Some of the definitions are made by me keeping them short and strictly to the point, some are from Wikipedia. The Learn more links to the Wikipedia article or sometimes to another website I found had more accurate information than Wikipedia.

(I’m working on it but published it prematurely since a friend needs it urgently, please search the words not still defined in Google. I’m also planning on translating the words into Spanish. Any help/feedback or corrections are truly appreciated.)

Job titles description

1. Graphic Designer: A graphic designer that does designs for things that need to be printed (posters, magazines, vouchers) or other digital pieces. Learn more
2. Web Designer: A graphic designer that specializes in designing websites. Learn more
3. Web Developer: A programmer that codes websites, converting static images to full-featured coded pages with interaction features. Learn more
4. Content Editor: A writer that creates articles, news or posts for a website. Learn more
5. Freelancer: Someone that works on short-term contracts (one week to six months but can be more or less). Usually from home but can work in the client’s office. Learn more
6. Project Manager: Learn more

Project Management vocabulary

1. Branding: The application of marketing techniques to a specific product, product line, or brand. Learn more
2. Specifications (especificaciones): Learn more
3. Deadline (fecha límite): Time when a milestone needs to be finished. Learn more
4. Milestone: The end of a stage that marks the completion of a work package or phase. Learn more
5. Target (objetivo): An objective that needs to be met. Learn more
6. Agile Development: An intense but really effective work methodology. Learn more

Graphic Design vocabulary

1. Mockup: (Esbozo) Learn more
2. Wireframe: Learn more
3. Assets: Files used during the creation of something.
4. Copy: The text that goes in a web page.

Frequently used adjectives in web design

1. Intuitive: Learn more
2. Edgy:
3. Minimal: Simple, with the fewest objects as possible and using white space in a smart way.
4. Sleek:
5. Trendy:
6. ‘Make it pop‘: Just ignore that.

Web Design vocabulary

Web Development vocabulary

1. Update (actualizacion): Part of a software that includes fixes and tweaks.
2. Upgrade (mejora): Bigger than an update, has major changes to the code.
3. Alpha release: Really early version of a product, barely functional and not thoroughly tested.
4. Beta version: The next stage in development of a product.
5. Local Server (): The server in your computer or Intranet with private access.
6. Development Server (): The server used to develop websites.
7. Staging Server (): The server used to test websites, also known as Testing Server or Environment.
8. Production Server (): The server that is published to the Internet and publicly viewable, also known as Live Server.
9. Bug: Error in the code.

Business vocabulary

1. Project Plan: Learn more
2. Salary raise (aumento de sueldo).
3. Promotion (aumento de rango, promoción)
4. Job title: (título de la profesión)
5. 60K pa: 60,000 pounds per annum (year). Learn more
6. Preview: Learn more
7. Purpose: Learn more
8. Outsource: To ask for an external company to take care of a part of a project or work. Learn more
9. Circa (aproximadamente): around, approximately. Learn more
10. Cold call: a business call to someone who doesn’t know you.

Parts of a website

1. Header (cabecera): The top part of a website that repeats along all the pages in the site. Usually composed by a logo and main heading.
2. Menu (menú): Learn more
3. Body (cuerpo, contenido): Learn more
4. Sidebar (barra lateral): Learn more
5. Footer (pie de página): Learn more
6. Quote (cita): Some text that someone wrote, normally stating an opinion on a product or service. Learn more
7. Heading (título): Learn more
8. Post (artículo): Learn more
9. Nips (trocito de texto): Small pieces of text.
10. Banner: A graphic advertisement in a website. Learn more
11. Front page (página principal): Learn more
12. Sitemap (mapa del sitio): A site map is a list of all the pages a web site has, it is accessible to crawlers or users. Learn more
13. ToS: Terms of Service. Learn more
14. Logo (logotipo): Learn more
15. Tagline (Eslogan): A tagline is a variant of a branding slogan. Learn more
16. Strapline (Eslogan): Secondary sentence attached to a brand name. Learn more
17. CTA (botón de acción): Call-to-Action. Se refiere al boton xxx Learn more
18. Theme (): A design for a website. Learn more
19. Template (plantilla): Sometimes used as a synonym for Theme. Sometimes means
20. Testimonial (): Someone’s personal experience with a product or service. Learn more
21. ROI: Return On Investment. Learn more
22. Pro-Rata: Learn more
23. Contract (contrato temporal): Learn more
24. In-house (interno): Something done for the company. Learn more
25. FY10: For year 2010. Usually used to refer for previsions and planning on that year. Learn more
26. Q3 (tercer cuatrimestre): Third Quarter. Three months. Q1 is January to March, Q2 is
27. UI (interfaz de usuario): User Interface. What the user sees and interacts with. The placement of buttons, links, text, forms… Learn more
28. Drop down (menú desplegable): Learn more
29. Radio button: Learn more
30. Checkbox (casilla): Learn more
31. Textarea (caja de texto grande): Learn more
32. RGB (Rojo, Verde y Azul): Red Green Blue. A way of writing colours for screen displays. The amount of colour for each. From 0 to 255 (like 255.0.0 would be pure red, 0.0.0 would be black, 255.255.255 is white). Learn more
33. Hexadecimal: A way of writing colours usually for websites. Learn more
34. CMYK: Cyan, Magenta, Yellow, K. A way of writing colours for printed media. Learn more
35. Web Safe colors: Traditional color palette used tune ago when screens could display limited colors and these looked different in every screen. It is not necessary to stick to web safe colors nowadays. Learn more
36. CAD: Computer Assisted Design. Used by architects and engineers to produce 2D and 3D graphics of models, buildings, etc. Learn more
37. Web 2.0: A new way of Internet were users have much more importance and can not only read content but rate, comment and participate. Learn more
38. Social network: Learn more
39. Professional network: Learn more
40. Bookmarking network: Learn more
41. Front-end: Designs the user interface with its buttons, images, boxes… and animations.
    Languages used: HTML, CSS, JavaScript, jQuery…
42. Back-end: Programs the coding and sets up the database.
    Languages used: PHP, MySQL, ASP, ASP.Net, Python, ColdFusion, ActionScript…
43. WWW: World Wide Web. The Internet. Learn more
44. FTP: File Transfer Protocol. A protocol to upload and download files from a server. Learn more

Office talk

1. ASAP: As soon as possible.
2. ATM: At the moment.
3. IMHO: In my honest opinion.
4. LOL (jajaja): Laughing out loud.
5. TY: Thank you.
6. TA: Thank you.

Techy Vocab

1. HTML: The language in which websites are coded. It is not a programming language but a markup language. Learn more
2. HTML5: The new version of HTML. xxx Learn more
3. Flash: Learn more
4. ActionScript: Learn more
5. FLV: Flash Video. A video format commonly used by web streaming services liek YouTube, Vimeo… Learn more
6. Quicktime: Learn more
7. RealPlayer: Learn more
8. Java: Learn more
9. Silverlight: Like Flash but made by Microsoft instead of Adobe. Learn more
10. CSS: The style sheet of the websites that define colors, background images, font sizes and families, etc. Learn more
11. JavaScript: A website programming language often used to enhance websites with animations, drop-down menus, etc. Learn more
12. jQuery: A JavaScript framework that makes JavaScript much easy and faster to code. Learn more
13. AJAX: A JavaScript technology that sends and receives information in a web site without refreshing the whole page (Facebook uses it a lot). Learn more
14. PHP: A website programming language. Very popular. Learn more
15. Cross-browser: Learn more
16. ASP: Learn more
17. ASP.NET: Learn more
18. Perl: Learn more
19. Production Server: Learn more
20. Development Server: Learn more
21. Apache: A web server software that can be installed in Windows, Linux, OSX and Unix. Learn more
22. IIS: A web server software from Microsoft and for Windows only. Learn more
23. Linux: (correctly written as GNU/Linux) Learn more
24. Unix: Learn more
25. OSX: The newest version of the Apple Mac operative system. Learn more
26. Chrome: An internet browser from Google. It’s fast and simple. Learn more
27. Safari: An internet browser from Apple. It’s simple and the default browser on Macs. Learn more
28. Firefox: An internet browser from Mozilla. It has lots of features and addons that help web developers and designers. It is slow and memory consuming. Learn more
29. IE: Internet Explorer. An internet browser from Microsoft. Version 6 doesn’t follow the web standards and it is a nightmare for web developers. IE7 is better but still not compliant and IE8 is quite compliant. Learn more
30. W3C: World Wide Web Consorcium. A non-profit organization that focuses on standarisation of the WWW. Learn more
31. Ruby: Another programming language. Learn more
32. RoR: Ruby on Rails. Means Ruby coding powered by a Rails server. Learn more
33. SQL: A database language. Learn more
34. MySQL: A variation of SQL optimized for websites running PHP. Learn more
35. Framework: Learn more
36. Creative Commons: Learn more
37. Copyright: Copyright is the set of exclusive rights granted to the author or creator of an original work. Learn more
38. Cookie: Learn more
39. Variable: Learn more
40. Session: Learn more
41. LAN: Learn more
42. WLAN: Learn more
43. WAN: Learn more
44. IP address: Every device that connects to the Internet has one (computers, web servers, mobile phones, printers…) Learn more
45. Hostname: Learn more
46. DNS: Learn more
47. Domain name: Learn more
48. SEO: Search Engine Optimization. Tricks and practises to improve websites so that target specific keywords in a search engine and appear first in the results. Learn more
49. SEM: Search Engine Marketing. Learn more
50. SERP: Search Engine Page Results. Learn more
51. Conversion:When a user ends a process (like visiting an informational website and buying from it). Learn more
52. Affiliate: A company that gives comissions to other companies. Learn more
53. PPC: Pay per click. Learn more
54. Google Adwords: A way to advertise. Learn more
55. Google Adsense: A way to show ads and earn money. The main difference to other advertising systems is that shows relevant ads based on the website content or what the user searched. Learn more
56. Google Analytics: Learn more
57. WordPress: A very popular and easy to use blog system. Learn more
58. CMS: Content Management System. Learn more
59. Blog: Learn more
60. Microblog: Learn more

Popular websites

1. Twitter: A real-time microblogging tool. Learn more
2. LinkedIn: A professional network to publish your work experience, offer job positions, etc.
3. Stumble Upon: Learn more
4. Digg: Visit site
5. Meneame: The spanish version of Digg. Learn more
6. Design Float: A Digg for web developers and designers. Learn more
7. Delicious: A bookmarking network. Learn more
8. Reddit: Learn more
9. Flickr: Learn more
10. DeviantArt: Learn more
11. Behance: Learn more
12. Posterous: A blogging system that automatizes everuthing and everyone can post content very easily and quick. Learn more
13. Tumblr: Like Posterous but being even more simpler (but maybe even more powerful). Learn more
14. Vimeo: Like YouTube but for artists and creatives. Higher quality videos.
15. Engadget:
16. NetTuts:
17. MakeUseOf:
18. Lifehacker:
19. Stack Overflow: Questions and Answers for programmers
20. W3Schools: Online tutorials for web development.

Advanced techy vocab

1. Localhost: The hostname of the current computer, device or server. Learn more
2. 127.0.0.1: The IP address of the current computer, device or server. Learn more
3. DoS: A denial of service attack, the most common and easy attack to web servers. It exhausts the server by sending tons of resource consuming requests. Learn more
4. XSS: Cross Side Scripting. Learn more
5. SQL injection: Learn more
6. Phishing: A fraudulent verbatim copy of a website that pretends to be the real one but gathers personal information such as passwords from users. Learn more
7. RegEx: Regular Expressions. A kind of coding that can extract and interact very accurately with text (detect valid e-mails, extract data from code…). Learn more
8. Microformats: Learn more
9. MVC: Model-View-Controller.
10. OOP: Object Oriented Programming.

Polite sentences

Interviews

• Excuse me, I have an appointment with Mr. Smith.

Top image by Stephen Mitchell

El colegio es un montón de habitaciones donde te sientas unas 2,000 horas o así y tratas de memorizar cosas. Estas 2,000 horas se reparten en 4 años. Pasas el resto del tiempo durmiendo, de fiesta y tratando de ligar.

Básicamente, aprenderás dos tipos de cosas en el colegio:

1. Cosas que necesitas saber en tu futura vida (2 horas).
2. Cosas que no necesitas saber en tu futura vida (1,998 horas).

Lo mejor son esas cosas que aprendes en las asignaturas que acaban en -ología, -osofía y demás. La idea es que memorices todas estas cosas, luego las escribas en pequeños exámenes, y más tarde las olvides. Si fallas en olvidarlas, acabas siendo profesor y tienes que quedarte en la escuela para el resto de tu vida.

Después de primaria, necesitas escoger una dirección, que es la que más intentas memorizar y en la que más acabas olvidando la mayoría de las cosas. Aquí va un muy buen consejo: Asegúrate de escoger una especialidad que no implique “realidades” ni “respuestas correctas”. Esto significa que no debes especializarte en Matemáticas, Física, Biología, Química o Geología porque implican hechos concretos. Si por ejemplo te especializas en Matemáticas, un día estarás en clase y el profesor te dirá: “Define el coseno integral de la raíz cuadrada de un romboide de eje binario y extrapola el resultado a cinco vértices significativos.” Si no sales con la respuesta exacta que el profesor tiene en mente, suspendes.

Lo mismo pasa con Química: Si escribes en tu libro de examen que el Carbono con el Hidrógeno forman el roble, tu profesor the cateará. Él quiere que escribas la misma respuesta que él y los demás químicos han acordado. Los científicos son muy temperamentales con esto.

Así que deberías escoger materias como Lengua, Filosofía, Psicología o Sociología (asignaturas en que nadie realmente entiende de lo que se habla y que no implica ningún hecho real.

Atendí a clases en todas estas asignaturas así que os daré unas breves pautas:

Filología

Implica escribir redacciones acerca de libros largos que has leído a trozos el día antes de clase. Aquí va un consejo para tener buenas notas en las redacciones: Nunca digas nada acerca del libro que nadie con sentido común diría. Por ejemplo, supongamos que estás leyendo Moby Dick. Nadie con sentido común diría que Moby Dick es una ballena grande y blanca ya que el libro se refiere a una ballena grande y blanca casi 11,000 veces. Así que en tu redacción, tienes que decir que Moby Dick es en realidad la República de Irlanda. Tu profesor, quien está harto de leer redacciones y a quien nunca le gustó Moby Dick, pensará que eres enormemente creativo. Si puedes encontrar interpretaciones lunáticas de simples historias, aprobarás con buena nota.

Filosofía

Se trata básicamente en sentarse en una habitación y decidir que no existe tal cosa como la realidad y cuando acaba la clase ir a comer. Escoge Filosofía si tomas muchas drogas.

Psicología

Trata de hablar sobre ratas y sueños.

Los psicólogos están obsesionados con las ratas y los sueños. Una vez estuve un semestre entero entrenando a una rata a apretar pequeños botones en una secuencia determinada, y luego enseñar a mi compañero de piso a hacer la misma cosa. La rata aprendió más rápido. Mi compañero de piso es ahora doctor. Si te gustan las ratas o los sueño, y más que eso, si sueñas con ratas, deberías escoger Psicología.

Sociología

Por simple falta de inteligibilidad, la sociología es la asignatura número uno. Me senté durante cientos de horas en cursos de Sociología y a leer escritos de sociología, y nunca leí ninguno que tuviera una explicación coherente. Esto es porque los sociólogos quieren que se les considere científicos, así que dedican la mayoría de su tiempo a convertir simples y obvias observaciones a jerga científica.
Si planeas escoger Sociología, tienes que aprender a hacer eso. Por ejemplo, supón que has observado que los niños lloran cuando caen al suelo. Deberías escribir “La observación metodológica sobre las tendencias comportamentales sociométricas en individuos prematuros indica que existe una relación causal entre el tropismo y las formas de comportamiento lacrimológico.” Si puedes escribir más como eso unas 50 o 60 páginas obtendrás una sustentosa subvención del gobierno.

Adaptación al castellano por Xavi Esteve.
Fuente original en inglés: The Truth About College.