File Extensions

A file extension is a group of letters that appear as a suffix to a file name and help you determine the type of file and what programs can be used to open that specific file. By default, Windows 7 and Mac OS operating systems hide all file extensions.

When you design a website, it is crucial to know what files you will be uploading or downloading, so you need to set your computer to be able to see the file extensions.

When you don't see file extensions, it is also a big security risk since a common technique virus authors use is disguising an .exe file as .jpg, .doc, or .txt when it's actually an executable file (.exe) making you run and install a malicious program. The bad guy may send you a virus "pictures-of-janet.jpg.exe", if your file extension was hidden, you would not realize the file was .exe since you only see the name of the file as "pictures-of-janet" and once you realized what you did, it's too late.

How to show file extensions on the mac OS

1. Click "Finder" from the top menu and then select "Preferences" from the drop-down menu.
   
2. Click the "Advanced" tab in the Finder Preferences window.
   
3. Check the box next to "Show all file extensions."
   

How to selectively show or hide file extensions on mac os

If you'd rather not see them all, or want to hide some and show others, you can also show or hide file extensions on a per file basis.

1. Select a file and hit Command + i to bring up the "Get Info" window
2. Click the arrow alongside "Name & Extension:" to expand the options, and check or uncheck "Hide extension"
   

How to show file extensions on windows 7

1. Open Windows Explorer, you can do this by opening up any folder or you can just click Start --> User Name.
2. Click "Organize", scroll down and click "Folder and search options".
3. Click the "View" tab. Scroll-down until you see "Hide extensions for known file types", and un-check the box next to it.
4. Click "OK" and now your file extensions will no longer be hidden.

Show file extensions on Windows XP

1. Open Windows Explorer, you can do this by opening up any folder or My Computer icon on the desktop.
2. Click on "Tools" and select "Folder Options" in the menus.
   
3. Click on the "View" tab.
4. Scroll-down until you see "Hide extensions for known file types" and un-check the box.
5. Click the "OK" button.
   

Common File Extensions

• .xml -- Extensible Markup Language file
• .htm or .html -- Hypertext Markup Language file

Instructor Notes:
XML is a markup language like HTML, designed to carry data and not to display data. XML is designed to be self-descriptive and it's a W3C Recommendation.

HTML is about displaying information, while XML is about carrying information.

• .xhtml -- Extensible Hypertext Markup Language file
• .css -- Cascading Style Sheet
• .asp -- Active Server Page
• .js -- JavaScript file
• .jar -- Java Archive file
• .php -- Hypertext Preprocessor file
• .sql -- Structured Query Language Data
• .db or .dbf -- Database file
• .mdb -- Microsoft Access Database file
• .vb -- Visual Basic Script file
• .exe -- Windows Executable file
• .app -- Mac OS application
• .doc or .docx -- Microsoft Word document
• .rtf -- Rich Text Format file
• .txt -- Plan text file
• .wpd -- WordPerfect document
• .wps -- Microsoft Works processor document
• .ppt or .pptx -- PowerPoint presentation
• .csv -- Comma Separated Values file
• .key -- Keynote presentation
• .xls or .xlsx -- Microsoft Excel Spreadsheet file
• .xlr -- Works Spreadsheet file
• .pdf -- Portable Document Format file
• .wma -- Windows Media Audio file
• .wmv -- Windows Media Video file
• .flv -- Flash video file
• .swf -- Shockwave Flash movie file
• .mp4 -- MPEG-4 video file
• .rm -- Real Media file
• .vob -- DVD Video Object file
• .mov -- Apple QuickTime movie file
• .psd -- Adobe Photoshop file
• .ai -- Adobe Illustrator file
• .bmp -- Bitmap Image file
• .gif -- Graphical Interchange Format file
• .jpg -- JPEG Image file
• .png -- Portable Network Graphic
• .pspimage -- PaintShop Pro Image file
• .tif -- Tagged Image file

Instructor Notes:
We will go more in depth about image files in the later module.