Showing posts with label HTML. Show all posts
Showing posts with label HTML. Show all posts

Sunday, May 17, 2015

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.

Tuesday, April 14, 2015

HTML: Deprecated HTML5 Tags

A deprecated tag is a tag that is no longer in standard HTML use. Although deprecated tags may still be recognized by certain browsers, newer browsers will probably not accept such tags and will display them incorrectly, so it's better to avoid using them if you can.

These tags are deprecated in HTML5 only, as far as I know. You may want to do your own research if you are looking for XHTML or HTML4 tags.

All of these tags' functions are better handled with CSS:
  • <acronym>
  • <applet>
  • <b> (Replaced by <strong>)
  • <basefont>
  • <big>
  • <center>
  • <dir>
  • <font>
  • <frame>
  • <frameset>
  • <i> (Replaced by <em>)
  • <isindex>
  • <noframes>
  • <tt>
As stated earlier, some of these tags, such as <b> or <i>, will still be recognized in modern browsers. Others, like <frameset> <noframes> and <frame> are totally deprecated and, as far as I know, do not work in any modern browsers.

Regardless of the state of the tag, totally deprecated or still being phased out, it's best to avoid using inferior tags and use their modern counterparts instead, which are often CSS attributes.

Wednesday, April 8, 2015

Software Review: Microsoft Expression Web 4

I've been reading up on web design and programming lately. One of the books that my mom checked out of the library for me (thanks, Mom) was a fairly old book (written in 2007, to be precise) that talked about creating web pages.

The book was written for complete beginners with no coding experience, so instead of teaching the reader how to code with HTML, the book recommended one of two popular WYSIWYG ("What You See Is What You Get", a type of webpage creating software) editors, Adobe Dreamweaver or Microsoft Expression Web.

I'd already looked into Adobe Dreamweaver, and, well... let's just say that its price was way too expensive for my limited teenage budget. I expected that Microsoft Expression Web would be similarly priced, but I decided to check it out anyway.

I was pleasantly surprised to find that Microsoft stopped producing updates for the Expression software in 2010, and they now release Expression Web 4 to anyone -- for free!

So I went and downloaded the software, and spent some time playing around with it.

Sadly, it's not very good.

On one hand, it will save you a lot of hand-coding time by creating the elements for you. On the other hand, it's really difficult to use.

Trying to move around the elements on the screen is difficult. At first, they refuse to move, then they zip to the other side of the page. Dropping an element in the wrong place will cause it to disappear. Worse, the CSS seems to be faulty. Fixed elements move around in the preview webpage.

I'll give it this, the interface is simple enough, and it has the capacity to create a lot of different elements. But, what with the glitches and problems, I can see why it was discontinued.

It's possible that I just didn't spend enough time trying to learn this software, and I might mess around with it some more. But unless I find out otherwise, I'll have to give this software a mediocre rating.

If you wish to download the software anyway, you can download it for free here: http://www.microsoft.com/en-us/download/details.aspx?id=36179

Disclaimer: I am not being paid to write this review.

Saturday, April 4, 2015

HTML: Basic Formatting Tags

HTML (or HyperText Markup Language) is the language used to build most websites. Here, I will teach you how to use some of the most basic tags of HTML to spice up webpages.

Tags are the building blocks of HTML. They are written in this format: <[tag]> (e.g. <img>). Most tags have an opening and closing tag, and the content is written in between the tags. The closing tags are the same as the opening tags, except with a slash first. (e.g. <body> [insert content here] </body>)

Here are some of the most basic HTML tags. You can use some of these tags in comments on websites, emails, etc. Look around to see if your website has a list of supported HTML tags. Some of these tags can be used to produce the same results. If one of the tags doesn't work on a specific website, try the other one.

The <strong> tag, which stands for strong.

<strong> This is an example of bold text. </strong> = This is an example of bold text.

The <em> tag, which stands for emphasis.

<em> This is an example of emphasized text. </em> = This is an example of emphasized text.

The <u> tag, which stands for underline.

<u> This is an example of underlined text. </u> =  This is an example of underlined text.

The <s> tag, which stands for strikethrough.

<s> This is an example of strike-through text. </s> = This is an example of strike-through text.

There are, of course, many more HTML tags than this, but since I'm only writing about the most basic formatting tags right now, I won't go into those right now.

When you actually write webpages, you will want to use CSS if you plan to add a format to the entire document (bold text, for example). Using the <em> or <strong> tags to do that would be an abuse of the HTML tags.

Still, if you wanted to highlight just one passage, using the HTML formatting tags would be the way to go. These tags also work on some websites where CSS styling isn't supported, but HTML is, deviantART, for example.