HTML: Disabling Text Selection

Being able to disable the selection of text can be very helpful, for numerous reasons. You can disable the selection of most of the text on a page, only allowing the parts that are important. Or, you can completely disable selection, which can help prevent plagiarism of your original work.

So how do you work this magic?

You can do it pretty easily with HTML and CSS. However, it's not as easy as just entering a tag or command. Text selection enabling or disabling commands differ depending on the browser being used by the viewer. In order to make sure that you block selection from all browsers, you need to include vendor prefixes with each line of code. (A vendor prefix is a short piece of code that is required by certain commands depending on the browser.)

I borrowed the following code and vendor prefixes from http://basicuse.net.

.no-selection {  
-webkit-touch-callout: none;   
-webkit-user-select: none;  
-khtml-user-select: none;
-moz-user-select: none;   
-ms-user-select: none;   
user-select: none; }

So, in order to disable text selection, all you have to do is paste that code in between the <style> tags at the beginning of your webpage. Then, just apply the "no-selection" class to anything you don't want selected.

This sentence, for example, cannot be selected or copy-and-pasted.

Website... Review? Share? Basic Use

I wanted to share this interesting website with you guys. Although I haven't seen enough of it to give an actual review, it looks very cool.

Here, there are a bunch of cool things you can do with simply HTML5 and CSS3.

Website Reviews: Khan Academy

Khan Academy is a website that offers many free online lessons. Lessons are interactive, and usually feature someone talking while an animation or video plays.

The format of Khan Academy is simple and easy-to-use. The website can be translated into a variety of languages.

Subjects taught include math, science, economics and finance, arts and humanities, computer programming and science, test preparation, and some third-party related content.

Personally, I have not tried learning with all of the subjects. I have done a ton of computer programming, in fact I've completed nearly all of their computer programming courses, and I must say that, for me, anyway, it is very easy to understand. If you don't get it, you can always go back and watch the interactive video again. You can't do that with a real life lecture.

Their math courses are less impressive, but still helpful.

I only did one lesson in their science courses. They are interesting, but heavily biased towards the theory of evolution being true -- not too appealing if you have a Creationist viewpoint.

Khan Academy is a helpful resource, especially in the area of computer programming and computer science. However, in some cases, it's a lot like trying to learn in the public schools -- all of the content is taught the same way to everyone. Happily, with Khan Academy, you can opt out of taking any courses.

Website Design: Rule of Thirds

In photography, there's this thing called the Rule of Thirds.

Wikipedia defines the Rule of Thirds as:

The rule of thirds is a principle of the Golden ratio with broad application as a "rule of thumb" or guideline which applies to the process of composing visual images such as designs, films, paintings, and photographs.^[1] The guideline proposes according to the principle of the Golden section search that an image should be imagined as divided into nine equal parts by two equally spaced horizontal lines and two equally spaced vertical lines, and that important compositional elements should be placed along these lines or their intersections.^[2] Proponents of the technique claim that aligning a subject with these points creates more tension, energy and interest in the composition than simply centering the subject.

This rule also applies to web design!

For example, if you're designing a web layout, you could place the focal point (the thing on the layout that you want the visitor's eye to be immediately drawn to) on one of the intersections of the Rule of Thirds for maximum effect. Similarly, instead of centering a background image, you could place the center of the image on one of the Rule of Thirds lines or intersections.

Incorporating the Rule of Thirds into your web designs will make your designs more visually interesting, as opposed to simply centering everything.