HTML5 adopted by W3C

by Yang Yang on May 11, 2007

News for the web development community: The new W3C HTML Working Group has voted to adopt the HTML5 draft specification comprising the Web Apps 1.0 and Web Forms 2.0 specifications developed and copyrighted as far by major browser companies Mozilla Foundation, Apple Inc., and Opera Software ASA under the umbrella of WHAT-WG, or Web Hypertext Application Technology Working Group, which includes Google, the Mozilla Foundation, Opera Software, Apple Inc. as its key contributing groups.

Some official infomation:

To summarise, the W3C will:

  • Adopt the WHAT-WG “HTML 5” (Web Applications 1.0 and Web Forms 2.0) as the current working draft, which will now be subject to review and development by the W3C HTML Working Group
  • Release a version of HTML which will be called “HTML 5”

The group editors will be:

What does this mean for webmasters?

  • The approved path for HTML development has shifted from XHTML 2.0 to HTML 5, indicating that HTML 5 may well not be as XML as XHTML 2.0.
  • The development process of HTML 5 is still in its early stages, and we are unlikely to see HTML 5 published before 2010.

Additional resources for HTML5

  1. WHAT-WG resources: FAQs, blogs, forums and more on HTML5.
  2. HTML5 elements and attributes remapped: including global attributes, event handling attributes and those defined in Web Applications 1.0 as well as Web Forms 2.0.
  3. HTML5, XHTML2, and the Future of the Web talks about HTML5 and XHTML2 as different means to create the future of the Web.
  4. Improve your forms using HTML5 displays the new functionalities to enhance your forms with HTML5.
  5. X/HTML 5 Versus XHTML 2: the competition and differentiation explained.
  6. (X)HTML5 Conformance Checking Service: HTML5 validator.

{ Comments on this entry are closed }

Free Web Template: My Dear Lounge

by Yang Yang on May 8, 2007

I’m glad to introduce you to yet another template by me, My Dear Lounge! It’s templated with PHP, so should be easier to customize than the previous pure HTML template Nickl, which I have now translated from Chinese to English and put online along with the most current MDL. Check them out here and here! Some of the screenshots and related information are available below.

My Dear Lounge

  1. Name: My Dear Lounge
  2. Author: Yang Yang
  3. License: CC 3.0
  4. Preview: http://www.kavoir.com/templates/mdl/
  5. Requirement: PHP required
  6. Download: http://www.kavoir.com/download/mdl.zip

My Dear Lounge, the free web template!

Overview of the raw design that is previously intended for one of my Chinese website, vism.cn, now suspended as a result of time shortage. ūüôĀ

My Dear Lounge head

Head navigation and logo. The logo is an original PNG backgrounded, so you can adapt it as you want in any graphic editor that swims with PNG. See more logo design inspirations.

My Dear Lounge foot

The footer.

Nickl

  1. Name: Nickl
  2. Author: Yang Yang
  3. License: CC 3.0
  4. Preview: http://www.kavoir.com/templates/nickl/
  5. Requirement: Any web hosting will suffice
  6. Download: http://www.kavoir.com/download/nickl.zip

Nickl, the free web template in HTML!

Nickl is released in GPL the last time you saw it, should you had any chance of stumbling upon this post. After a few revisions and the thorough translation, I now release it under a CC 3.0.

People I learned from

I’m still a rookie designer, so I learn and imitate a lot from other veteran designers at present. They are so great that I don’t know when I could become as proficient as they are now! My thanks goes to the following designers and developers when I’m making these 2 templates:

  1. Cameron Moll: He’s just too talented to imitate, I think, his design is always so pleasant to look at. Borrowed one or two colors from his portfolio, hopefully he won’t mind. ūüôā The greatest I believe he is.
  2. WordPress.org: Is it Matt? Or some other developer? Anyway, you can see how my footer nav and links in the paragraphs resemble those of the main nav of wordpress.org. In fact those are quite popular right now, but they started it, did they.
  3. Dan Cederholm: Frequent SimpleBits a lot, and Dan has given me a lot to ponder about.

{ Comments on this entry are closed }

To be honest, I don’t know much about XAML, actually very little. However, after I came across Silverlight, the Microsoft way of Adobe Flash, it really doesn’t matter whether you know much or not. Because we can build very decent bells and whistles for our websites in almost no time with it!

What is Silverlight then?

According to Microsoft,

Silverlight is a cross-browser, cross-platform plug-in for delivering the next generation of media experiences and rich interactive applications (RIAs) for the Web.

While it can do as much, Silverlight differs from Flash in its deployment wherein it is built upon existing technologies like HTML, XML and JavaScript, delivering text-centric solutions compared with Flash’s binary packaging, though you do have to install a small plug-in to perform Silverlight applications, which you can download here. It’s nimble, so easy to spread! Development can be done in a mere text editor, Windows Notepad for instance. It’s very easy, very intuitive and very enjoyable. If you are already well versed in XHTML+CSS+JavaScript development, this should be a piece of cake for you. Go grab it while it’s fresh and delicious!

What is XAML? And in Silverlight?

I hate definitions, so I’ll just cut through to the essence that I have understood. XAML is just XML that Microsoft has developed to describe objects. Silverlight relies on XAML to store and represent visual objects to be displayed and animated on HTML pages. So technically they are no more than text files, nothing to be afraid of. I promise that you will learn very fast to represent things such as canvas, shapes, images, text, media, animations and controls in XAML so as to further silverlight them in your browser.

How exactly to start developing in Silverlight?

  1. Install the Silverlight runtimes for Windows Internet Explorer.
  2. Download the Silverlight 1.0 Beta SDK.
  3. Unzip the package.
  4. Unzip Silverlight_1.0_QuickStarts.zip to a new directory.
  5. In the quickstart directory, you should have quickstart.html, double cilck to open it.
  6. Navigate through “Go to the Silverlight 1.0 Beta QuickStart (offline version)” to the quickstart tutorial.
  7. There you go. Just follow the instructions and you are on your way.

Start the feast!

Quick Facts:

  1. Microsoft is expected to come up with the final release of Silverlight 1.0 this summer.
  2. Silverlight for Linux is likely to be released at the end of 2007.
  3. Silverlight is based upon the great WPF.
  4. According to PC World, Microsoft is expected to announce at MIX 07 that part of its Silverlight technology source code will be released to developers. Adobe had previously announced that it would open source its Flex software development kit (SDK) by the end of this year.

Links and Resources

Official:

  1. Microsoft Silverlight: http://www.microsoft.com/silverlight
  2. Silverlight.net, the community: http://silverlight.net/
  3. Blogs: http://www.microsoft.com/silverlight/blogs.aspx
  4. Forums: http://silverlight.net/forums/
  5. MSDN Developer Center: http://msdn2.microsoft.com/en-us/silverlight/default.aspx

Downloads:

  1. Browser runtimes or plug-in: both downloadable Windows and MAC OS X versions. Or you can visit this page to automatically install it.
  2. Silverlight 1.0 Beta SDK, Silverlight 1.1 Alpha SDK: quickstarts, documentations, code samples and more.

Learn:

  1. MSDN Silverlight: http://msdn2.microsoft.com/en-us/library/bb188743.aspx
  2. Whitepapers: provides a good overview of Silverlight.
  3. Quickstarts: designed to help you become rapidly productive in performing common developer tasks.

Tools:

  1. Silverlight Tools Alpha for Visual Studio codename “Orcas” Beta 1: an add-on to the Beta 1 release of Visual Studio codename “Orcas” to provide tooling for Microsoft Silverlight 1.1 Alpha. It provides a Silverlight project system for developing Silverlight applications using C# or Visual Basic.
  2. SWF2XAML: an Adobe/Macromedia Flash to XAML conversion tool.
  3. Adobe Illustrator XAML Export: a freely available plug-in that enables Adobe¬ģ Illustrator¬ģ to export WPF and WPF/E compatible XAML.

Services:

  1. Windows Live Silverlight Streaming: 4GB of free hosting offered to Silverlight developers and content publishers.
  2. Silverlight Streaming SDK: http://dev.live.com/silverlight

Screencasts:

  1. Using Silverlight Brushes for Color, Gradient and Video
  2. Using the Silverlight Downloader Object
  3. Basic Keyboard Input with Silverlight
  4. Adding Ink Support to a Silverlight-based Application
  5. 2D Geometries in Silverlight
  6. Building Video Overlays with Silverlight
  7. Creating a Video Scrubbing Control with Silverlight
  8. Using Silverlight for Full Screen Experiences
  9. Silverlight Event Handling with JavaScript
  10. Animating and Clipping Video with Silverlight
  11. Creating Vector Art for Silverlight with Expression Blend
  12. Animating Vector Art for Silverlight with Expression Blend Part I
  13. Animating Vector Art for Silverlight with Expression Blend Part II
  14. Animating Raster Art for Silverlight with Expression Blend
  15. Using Expression Blend to Control Silverlight Media Playback
  16. Delivering Parameterized Silverlight Content with ASP.NET
  17. Delivering Parameterized Silverlight Content with PHP
  18. Delivering Parameterized Silverlight Content with Java
  19. Using AJAX to Dynamically Update Silverlight Content
  20. Creating a Video Playlist with Silverlight and ASP.NET
  21. Overlaying HTML and Silverlight Content
  22. Real-Time Data Update with Silverlight and Web Services

Fun:

  1. How Did We Come Up With Silverlight
  2. Community gallery: http://silverlight.net/community/communitygallery.aspx

In-depth readings:

  1. A Guided Tour of Windows Presentation Foundation: http://msdn2.microsoft.com/en-us/library/aa480221.aspx
  2. Silverlight resources on ZDNet: http://updates.zdnet.com/tags/Silverlight.html
  3. Silverlight at Techboo.com: http://silverlight.techboo.com/

XAML:

  1. XAML Overview: http://msdn2.microsoft.com/en-us/library/ms752059.aspx
  2. XAML.net: http://www.xaml.net/
  3. Inside XAML: http://www.ondotnet.com/pub/a/dotnet/2004/01/19/longhorn.html
  4. XAMLdev: http://xamldev.com/
  5. XAML Resources: http://www.codeproject.com/dotnet/xamlresources.asp

WPF:

  1. Windows Presentation Foundation: http://msdn2.microsoft.com/en-us/library/ms754130.aspx
  2. WPF@MSDN: http://msdn2.microsoft.com/en-us/netframework/aa663326.aspx
  3. WPF at Wikipedia: http://en.wikipedia.org/wiki/Windows_Presentation_Foundation
  4. WPF Community: http://wpf.netfx3.com/
  5. WPF Resources: http://wpf.netfx3.com/files/default.aspx

{ Comments on this entry are closed }

Updated: Nickl, in addition to another template My Dear Lounge have been added to Kavoir Mag template section now. Check them out here and here. More hand-made easy-to-use templates are on their way! ūüôā

I named it Nickl! It’s just comprised of 4 pages, 6 images and 1 stylesheet that I have fabricated for my resume. Really simple and plain design. I now release it in public domain and you are granted the rights to use it in whatever way your enjoy.

Nickl, the free web template!

Download it here. Be happy! ūüôā

{ Comments on this entry are closed }

Blogger, WordPress and Movable Type Compared

by Yang Yang on April 3, 2007

Updated: Comparison table updated by the announcement of MT4.

Okay, before it all begins, I’d like to do a small playful research that would give us some preliminary knowledge. According to Google, up to the time this comparison post is being compiled, we have,

  • “powered by Blogger” – 30,800,000 results!
  • “powered by WordPress” – 71,800,000 results!
  • “powered by Movable Type” – 1,220,000 results!

So, WordPress is undoubtedly the most popular among the three. Done, let’s proceed.

Blogger is my virgin choice for a blog platform, later abandoned though, for its annoying way of scrambling HTML markup. But don’t – it’s just my personal obsession to keep everything in control. Anyway. Used it for quite a while before switching to WordPress that I have, as you can see, installed for Kavoir Magazine, and Movable Type for one of my Chinese blogs. They are all awesome. Here I’m going to compare the 3 platforms as far as I know them. Hope this would be of some use to those who just started in blogging and confused by an excessive bunch of options.

Blogger

Website: http://www.blogger.com
Sign up: http://www.blogger.com/signup.g
Free Hosting: http://www.blogspot.com/

Blogger rocks at its simplicity. It’s awfully easy to use, good for novice bloggers, and has a few advanced functionalities that WordPress and Movable Type holds proud of stripped away. Another reason for its popularity is that it supposedly gets quicker to be indexed by Google because Google owns it.

The control panel is clean and straightforward, templates are freshly baked and can be rearranged in a drag’n’drop manner. If you prefer hosting the blog archives with BlogSpot rather than storing them to your own FTP server or web space, you don’t have to worry about the code at all. Either no need to install anything before starting to blog, you just concentrate on the writing. Multiple authors are also supported.

A narrow top banner with search is arbitrary for advanced templates capabilities, though.

Cost: None
Launch Time: 5 – 10 minutes
Technical Presumption: None

WordPress

Website: http://wordpress.org/
Download: http://wordpress.org/download/
Free Hosting: http://wordpress.com/

Mostly used as a lightweight CMS(Content Management System), WordPress is the favorite dish of millions of tech geeks. Its open source nature has made the app a huge community world wide. Hundreds of thousands of people passionately contribute to the platform, building a major library of themes and plugins that greatly enhance and publicize the software. Almost all web hosting companies now strive to provide WordPress in one click installs because a considerable part of customers now rely on WordPress for online blogging.

In terms of features, WordPress is more sophisticated than Blogger, therefore expectedly a little harder to maintain, requiring some knowledge of web developing. But it’s still easy to install, taking no more than 3 steps in the browser. Moreover, multiple blogs are available through a derivation, WordPress MU (Multi-User), which you can download here.

Choosing WordPress is simply choosing a community, not just a platform like Blogger.

Cost: None
Launch Time: 10-15 minutes
Technical Presumption: Some

Movable Type

Website: http://www.movabletype.com/
Download: http://www.movabletype.com/download.html

Movable Type, on the other hand, as a typical commercially powered and supported blogging platform backed by Six Apart, catering to enterprise needs, emerged itself quite early. Serious businesses, enterprises, and professionals tend to impress their audience with the maturity and stability of Movable Type. A single user license for non-commercial use can be acquired free, though.

Movable Type has inherent support for multiple blogs, mutiple authors, plugins, templates, widgets and tags. Trackbacks, which has now been one of the technological standards of every blog platform, is incepted by Movable Type, too. One of the major differences Movable Type has with WordPress is, that WordPress relies on PHP to serve blog entries while Movable Type outputs static web pages every time the author posts a new entry or build the site manually. Moreover, modules in Movable Type templates, as a means of content function, well facilitate customization.

Paid licenses is the reason why Movable Type appears not so popular as the other 2 in the research above, which really doesn’t mean much. IT IS, a very admirable blogging platform.

Cost: None with Single User Personal License
Launch Time: 30 minutes or more
Technical Presumption: Some+

A Simple Sum-up

Functionality Blogger WordPress Movable Type
Comments Yes Yes Yes
Trackbacks Yes (Backlinks) Yes Yes
Categories No Yes Yes
Tags Yes (Labels) Yes Yes
Pings Yes Yes Yes
Feed RSS / Atom RSS / Atom RSS / Atom
Widgets Yes Yes Yes
Search Yes Yes Yes
Plug-in/Add-on No Yes Yes
tdemes/Templates Yes (Exclusive) Yes Yes
Edit templates online Yes Yes Yes
Number of blogs Unlimited 1 Varies with licenses
Non-blog pages No Yes Yes (Version 4)
Visitor registration/login Yes Yes Yes
User levels Yes Yes Yes
IP/User/URL banning No Yes Yes
Multiple autdors Yes Yes Yes
Image uploading Yes Yes Yes
File uploading No Yes Yes
Save witdout posting Yes Yes Yes
Private post No Yes Yes

Other Excellent Blog Engines / Platforms

  1. Textpattern : Another PHP blog engine that’s easy to install, featuring lots of saucy plugins and templates.
  2. TypePad : Paid professional blog service.
  3. Drupal : An open source content management system (CMS) that can be used as personal blog system.
  4. ExpressionEngine : Another CMS able to power personal blogging.
  5. VOX : An integrated publishing console intended for hypermedia communication, where you can fully explore the possibility of text posts, photos, videos, audio and more in one. It’s free.
  6. LiveJournal : A community of independent bloggers.
  7. Flickr : Well, most of us might not agree that this is a blog system. Why not? It’s picture logging, isn’t it?

More Opinions

  1. Movable Type vs. WordPress, My Opinion, a professional and comprensive analysis of the 2 platforms by BusinessLogs.
  2. Comparison of WordPress and TypePad by Emily Robbins who has used both extensively for over a year.
  3. Choosing a Blog Platform from Darren Rowse’s ProBlogger.net which gives no review but urges bloggers to define their own goals choosing a blogging system. You may also enjoy his Blogging for Beginners.
  4. Blog software comparison chart at Online Journal Review presents a comprensive comparison of technical capabilities among 8 different platforms.
  5. Are you using the right blogging tool? by Susannah Gardner. Missing quite some famous blog softwares.
  6. Blogging Cheatsheets, PDFs that map out the interfaces of major popular blogging platforms Blogger, TypePad, WordPress and Movable Type. Assembled and created by Andy Wibbels.

{ Comments on this entry are closed }

Xenu‘s the program(for windows) I’m talking about. I’ve tried a bunch of link checkers including those pretentiously online ones. This is the one that’s really working to solve your problem. And free!

Download it from here, or you might also want to check its page for FAQs and other instructions.

Install and run it. “File” -> “Check URL…”, then configure the starting point of your website, usually this could be your website URL, and click OK. You are now on it.

Xenu

Done! You are asked if you want a report or not. Of course. And Xenu opens it in the form of a web page. It then prompts you for an orphan check on your FTP site, simply ignore it by clicking Cancel. Ok, you should be in front of the report page now.

Other decent web-based link checkers include:

  1. W3C Link Checker: only the specified page is checked, no hopping interpagely.
  2. SiteOwner.com Link Checker: the famous Microsoft bCentral toolkit, one page at a time.
  3. Link Valet: a link checker since long long ago, in a galaxy far far away … It gives you the answer after all the checking is done, so be patient while your browser’s loading like forever.
  4. The hawknest Basic Link Check: one page at a time, and neatly presents only the faulty links.
  5. 2bone Link Checker: very fast link checker, you can choose to receive results in a single page or dozens of pages.
  6. Ranks.nl Link Checker : a modification of W3C Link Checker.

Aside from these online link checkers, you can also find a FireFox addon, LinkChecker to do the job for you. It checks all links on the page you are visiting and distinguish them with different colors to tell which ones are broken.

{ Comments on this entry are closed }

Aboslutely!

If you are a total rookie in manipulating web pages, never having the chance to know how web pages work and wanting to learn about it or even trying to spin some out. Listen to this. Everything here you are told, in this naive article, is pure gold. And everything else, other than those on this site, is pure rubbish! Don’t listen to them, they are stupid.

OOOOkay, a good starter. Now let’s get down to work, assuming that you know how to navigate around the web using a computer and what are web pages.

  1. All web pages on this planet are text files, which you can create or read by any normal text editors like Windows Notepad or Notepad++. However, unlike the memo you put down as a plain text file on your computer desktop this morning, a web page needs more standardized text called HTML to tell what’s what.
  2. Open your favorite text editor, type these in just as they appear:<html>
    <head>
    <title>The Donkey Reloaded</title>
    </head>
    <body>
    <h1>The Donkey Reloaded</h1>
    <p>I have a donkey.</p>
    <h2>Donkey lazes</h2>
    <p>He is very lazy.</p>
    <h2>Donkey doodles</h2>
    <p>He once drawed a circle while he was working.</p>
    <h2>Donkey heehaws</h2>
    <p>And he seemed quite satisfied with his masterpiece.</p>
    </body>
    </html>

    Nonononono, stop copying and pasting! Do it yourself and type them onto the screen with your bare hands!
  3. Cool! Save this text file, name it whatever you please, but make sure it has the extension of .html. Now open it in your favorite browser. See, you made it! Your first web page!

So WTH does these weird-looking tags doing in there, like <html> and <p>? Follow me to investigate in them one by one below.

  • <html> : indicates that this is a HTML file, or static web page, and things followed or embraced in it are HTMLized(HTML tagged) content.
  • <head> : makes room for the head section of a HTML file.
  • <body> : makes room for the body section of a HTML file.

Up to here, we know that every web page consists of 2 essential parts, the head part and the body part, which, are indicated respectively by the <head> tag and the <body> tag.

  • <title> : indicates the title of this page that is usually displayed on the caption of the browser window.
  • <h1> : means Header 1, or the 1st header or headline that governs the overall story of the page.
  • <h2> : means Header 2, or the 2nd header that governs part of the overall story of the page.
  • <p> : indicates a paragraph, the main text flow should go in here. Web pages live with content, die with bullshit. And content goes in <p>. So it is pretty much the essence of every web page.
    Browsers render 2 paragraphs wider apart than they do with 2 lines within one paragraph. Using <p> makes your pages pretty.

In fact, there are as much as 4 more headers, namely h3, h4, h5, h6 at your control. Well-structured web pages cannot go without them. Use them wisely, so you are a good web page creator.

More things you may have noticed:

  1. None of the tags have the privilege to go without a corresponding closing tag. E.g. Every <p> has to end with a </p>. That’s right! Every tag in a web page closes in this manner, that is:
    <p>…</p>
    <h4>…</h4>
    wherein ellipsis are the placeholders of text content in between them.
  2. Certain tags can only be placed in certain tags. E.g. <title> tag can only be positioned within the <head> section, and either an error occurs or things don’t go as expected if you put it in the <body> section. It’s the same with <hx> and <p>, they are never supposed to appear in the <head> section.
  3. Tags pile up like they box(seal, or completely envelope) each other. Small boxes are boxed by medium boxes, medium boxes by big boxes, and big boxes by a single gigantic box that is <html>. There’s no such thing as:
    <h1>a header<p>a paragraph</h1> goes.</p>

This is it! You are on your way to becoming a great web designer! Cheers!

{ Comments on this entry are closed }

More and more web hosting providers are offering SSH(Secure Shell) access to their customers now, if you are one of them, put this advantage to good use will make your online life a lot easier. Don’t worry, we are just going to deal with just a few more than 15 shell commands, pretty much those used most frequently, with the most favored switch options by most people.

We have assumed that you are normally computer- and internet- literate, at least aware of directories and files that facilitate the organization of data on computers, knowing what it is like to travel within a file system tree structure.

First off, you are to log in to the host with your SSH privilege by means of a SSH client, like Putty. Download and launch it on your local machine. The interface should look like this:

SSH client

Enter the host name or IP address supplied by your hosting provider in the Host Name box and click Open.

Supply your SSH account username and password so as to be logged in. Once acknowledged by the remote system, it is ready to accept your commands, and you should be in your home directory which can be referred to as ‘~’ or ‘/home/username’ (username here is a placeholder for your own SSH username) in SSH commands. Now let’s see in detail what you can do in this tiny terminal window.

  1. ls -o : List files and directories in the current directory. 
    ls -ao : List files and directories in the current directory, including hidden ones.
  2. cd [dir-path] : Change to, or change current directory to the directory indicated by [dir-path].
    cd ~ : Change to your home directory, which in most cases would be /home/yourusername.
    cd .. : Change to the parent directory of the current one.
    cd – : Change to the last directory you are in.
  3. pwd : Show the full path to the current directory.
  4. mkdir [dir-path] : Create an empty directory in the specified directory indicated by [dir-path].
  5. rmdir [dir-path] : Delete an empty directory in the specified directory indicated by [dir-path].
  6. rm [file-path] : Delete a file indicated by [file-path]. 
    rm -f [file-path] : Forcibly delete a file indicated by [file-path], that is, without having to confirm before deletion.
    rm -r [dir-path] : Delete a directory indicated by [dir-path] and everything underneath it.
    rm -rf [dir-path] : Delete a directory indicated by [dir-path] and everything underneath it, without having to confirm before deletion.
  7. mv [file-path]/[dir-path] [dir-path] : Move a file or directory indicated by [file-path] or [dir-path] to the directory indicated by the latter [dir-path]. 
    mv [file-path] [file-path] : Rename the file indicated by the first [file-path] to another indicated by [file-path]. Or. Move the first file to a different location and rename it as specified in the second [file-path].
  8. cp [file-path] [dir-path] : Copy the file indicated by [file-path] to the directory indicated by [dir-path]. 
    cp [file-path] [file-path] : Duplicate the same file indicated by [file-path] with another name indicated by the second [file-path]. Or. Copy the first file to another location and rename it as specified in the second [file-path].
    cp -r [dir-path] [dir-path] : Copy a whole directory including everything underneath it indicated by the first [dir-path] to another directory indicated by the second [dir-path].
  9. tar -zxf [file-path] : Extract all things in an archive extensioned with .tar.gz indicated by [file-path] to the current directory. 
    tar -xf [file-path] : Extract all things in an archive extensioned with .tar indicated by [file-path] to the current directory.
    tar -cf [file-path] ([file-path]/[dir-path], … ) : Create an archive indicated by the first [file-path] of the files indicated by [file-path]s or/and directories indicated by [dir-path]s.
  10. gunzip [file-path] : Decompress a zipped file extensioned with .gz to the current directory.
    unzip [file-path] : Decompress a zipped file extensioned with .zip to the current directory.
  11. chmod [xxx] [file-path]/[dir-path] : Change the privileges of a given file or directory indicated respectively by [file-path] and [dir-path] to xxx. 
    chmod -r [xxx] [dir-path] : Change the privileges of a given directory indicated by [dir-path] to xxx.
  12. more [file-path] : Display the content of the given file indicated by [file-path], one screen at a time.
  13. ln -s [file-path] [file-path] : Create a symbol link for the first file, so that everything you do to the symbol link, a.k.a the second fake file, is reflected to the real file, except for when you delete the symbol link, the real file remains intact.
  14. touch [file-path] : Create an empty file indicated by [file-path].
  15. du -sh : Show disk usage of the current directory. 
    du -sh * : Show disk usage of the current directory plus the statistics of all the files and directories underneath it.
  16. grep [text] [file-path] : Search the file indicated by [file-path] with the text in [text].
  17. mysqldump -h [hostname] -u [username] -p [password] [database] > [databasefile.sql] : Dump or backup the selected database on the selected host privileged by selected user identified by corresponding password to a SQL file. 
    mysql -h [hostname] -u [username] -p [password] [database] < [databasefile.sql] : Restore the data in a SQL file to the selected database on the selected host privileged by selected user identified by corresponding password.
  18. clear : Clear the screen so that you feel neat.
  19. exit : Terminate the SSH dialogue and close the Putty window.

Note: When something is specified in brackets, such as [file-path] or [dir-path], it is used to indicate that you must input your desired information here, which, in this case, are the path to a file or a path to a directory respectively. NO brackets in your command.

{ Comments on this entry are closed }

Updated: added a 301 redirect directive.

Whatever you wanto call this, a cheat sheet, a real thin manual, or anything, we simplify the use of .htaccess as much as possible and make it do more for you with less hassle.

  1. Unify kavoir.com and www.kavoir.com!
    # Use a 301 redirect from kavoir.com to www.kavoir.com to tell SEs that the 2 domains are the same thing so there's no PageRank leakage.
    RewriteEngine On
    RewriteCond %{HTTP_HOST} ^kavoir\.com [NC]
    RewriteRule ^(.*)$ http://www.kavoir.com/$1 [R=301]
  2. Block spammers!
    # This blocks 218.1.132.177 and *.spammers.com from accessing your site.
    <limit GET POST PUT>
    order deny,allow
    deny from 218.1.132.177
    deny from .spammers.com
    allow from all
    </limit>
  3. Change default page!
    # The order is followed as specified:
    DirectoryIndex default.htm default.php index.html index.php
  4. Enable directory browsing!
    Options +Indexes
    # block a few types of files from showing:
    IndexIgnore *.wmv *.mp4 *.avi
  5. Disable directory browsing!
    Options All -Indexes
  6. Customize error messages!
    ErrorDocument 403 /forbidden.html
    ErrorDocument 404 /notfound.html
    ErrorDocument 500 /servererror.html
  7. Get SSI working with HTML/SHTML!
    AddType text/html .html
    AddType text/html .shtml
    AddHandler server-parsed .html
    AddHandler server-parsed .shtml
  8. Redirect it!
    Redirect oldpage.html http://www.domainname.com/newpage.html
  9. Block visits or leeches from specific referers!
    RewriteEngine on
    RewriteCond %{HTTP_REFERER} site-to-block\.com [NC]
    RewriteCond %{HTTP_REFERER} site-to-block-2\.com [NC]
    RewriteRule .* - [F]
  10. Stop a file from being viewed!
    # mycontacts.txt cannot be accessed by any means:
    <files mycontacts.txt>
    order allow,deny
    deny from all
    </files>
  11. Password-protect a directory!
    See http://thejackol.com/scripts/htpasswdgen.php
  12. Change script extensions!
    # anyfile.kv will be treated like a PHP script:
    AddType application/x-httpd-php .kv
    # anyfile.kvcgi will be treated like a CGI script:
    AddType application/x-httpd-cgi .kvcgi

{ Comments on this entry are closed }

You are powering the web, get noticed today!

by Yang Yang on March 23, 2007

The quickest way to get started on publishing on the web, 8 out of 10 people would agree, is blogging. Blogging is very effective in communicating, especially after¬†the entry into the era of web 2.0. People have come together to urge a global¬†community to form. Ideas are more easy than ever to share and spread. Most bloggers are happy blogging,¬†showing off¬†their personalities, writing for the world to read, and reaching to an audience that’s interested in him or her. Content put online has exploded to its double, triple, and even more. These are exactly the essence of web 2.0. That is.

We power the Web.

Money is being made through blogging, too. A¬†considerable small¬†portion of those who blog are earning a decent living by blogging alone. Yes. Many are full time bloggers, like dear Darren Rowse. Although most of us can’t afford giving up daily job¬†and maintain¬†a career like this, blogging in your spare time does make your life better. And others.

Only connect.

Everyone is unique. Everyone has something to offer to the community. Contribute what you know, help others as you can, and you’ll be rewarded. Web is the best boss I know of as of now. He’s smart, unbiased,¬†knows the answers to almost¬†all¬†your questions; rewards hard work and creativity. Work for him, and you won’t regret it.

Get noticed today, if you don’t have a blog yet, start one! Talk anything you like, your newly bought climbing gear, your annoying little brother or the book you just read. As you keep¬†reading other people’s blogs and writing your own, you will be more clear in where you are heading. What¬†to express, what¬†your blog is going to be like and how to make people excited about what excites you!

Blogging systems I would recommend to first time bloggers,¬†are Google Blogger¬†and WordPress.com. As¬†2 maturely developed blogging systems,¬†they¬†are both free, and justify their¬†incredible popularity with full-fledged¬†features and¬†easy to use¬†functionalities. Signing up is as simple as 3 steps, very probably¬†in 5 minutes, you will be¬†struggling to figure out what to say in your first post that declares your presence to the online world. Don’t panic in case you can rarely¬†put together enough¬†to talk about, and don’t worry about what other people might think of it. It’s normal. However, sticking on it will eventually pay off, both¬†socially and financially.

Just speak out!

Writing is a good way to organize your thought, it keeps you smart along with discussion with other people. Your thoughts are precious. Write them down, and be confident of them. In this way, you grow and your blog develops.

More inspirations:

  1. WordPress Codex: Introduction to Blogging
  2. Start Blogging Online: How To Start a Blog ‚Äď A Complete Beginner‚Äôs Guide
  3. Wikipedia: Blog
  4. M. Sean Gilligan’s Introduction to Blogging
  5. Darren Rowse and his ProBlogger

{ Comments on this entry are closed }