In the Libraries (for CSU Libraries Staff only)
- Web authoring procedures: FrontPage, Dreamweaver, and Libraries templates
- Drupal authoring procedures
- General tips
- Computer Applications Training handouts (login with your eID; includes Dreamweaver, Photoshop and InDesign)
- Web hosting services provided by Academic Computing and Networking Services
On the Web
- Web development cheat sheets - printable quick references
- Free HTML/Web Editors
- Web page WYSIWYG editors
- Adobe Dreamweaver
- Free/Open Source
- Web page HTML/code editors for Windows
- Microsoft Visual Studio: large commercial tool for software development (3GB)
- Microsoft Expression Web: lower-cost WYSIWYG and code editor; supports PHP, ASP.NET, HTML5 and CSS3 (2GB)
- Microsoft WebMatrix: free (v. 2 release candidate) and simple, manages sites, files, databases and reports; code editor is not WYSIWYG
- Aptana Studio: free
- HTML-Kit: free
- Notepad++: free
- notepad2: free
- TextPad: 30-day trial
- Eclipse and NetBeans are Java editors that can edit HTML and PHP files with suitable plugins.
- WinDiff: find differences between two files (similar to Unix diff command)
- Linux text editors (the following are installed on our Web servers)
- Internet Explorer Developer Center
Firefox add-ons for web developers
- Page diagnostics
- Web Developer -
Adds a menu and a toolbar with various web developer tools.
- View Formatted Source - Displays formatted and color-coded source for each element.
- View Source Chart - Draws a color-coded chart of a Web page's source code
- CSS Viewer - View CSS properties
- IE Tab 2 - Simulate Web browsing through Internet Explorer
- Web Developer - Adds a menu and a toolbar with various web developer tools.
- Page validation
- Site information
- FlagFox - Website physical location, safety checks, translation, validation, etc.
- Designer utilities
- ColorZilla - Advanced Eyedropper, ColorPicker, Page Zoomer and other color tools.
- MeasureIt - Draw out a ruler to get the pixel width and height of any elements
- FireShot - Screen captures
- Stylish - Customize the way a web page displays using user styles.
- Google Chrome
Chrome Developer Tools
- Right-click any element and click Inspect Element to see and edit its HTML and CSS.
- Click the Network tab and refresh to see file sizes and load times of all files for the page.
extensions for web developers
- Web Developer - same tools as the Firefox add-on, but without the toolbar clutter
- Check My Links
- Page diagnostics: Web Developer Checklist, Firebug Lite, YSlow, jsError, HTML5 Outliner, IE Tab or IE Tab Multi
- Site information: SEO for Chrome, Alexa Traffic Rank, PageRank, PageRank Status, IP Address and Domain Info
- Designer utilities: Stylish, Screen Capture, MeasureIt, Page Ruler, ColorPicker, Window Resizer, Alt CSS
- Other Chrome extensions I find indispensable
- Xmarks - cross-browser bookmark synchronizer
- LastPass - cross-browser password manager
- AdBlock - automatically hide all ads on web pages
- Speed Dial 2 - visual bookmarks for new page tab
- Chrome Developer Tools