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 CS6 new and improved features - fluid grid layout, CSS3 transitions, Live View, Multiscreen Preview, mobile development, and Business Catalyst site integration
- Adobe Dreamweaver CS6 video tutorials
- Free/Open Source
- Amaya: a free open-source editor/browser from W3C; WYSIWYG is basic
- BlueGriffon: a free basic editor with Gecko rendering, requires commercial add-on for CSS
- KompoZer: based on Nvu, latest version is from 2007
- Nvu: a free open-source editor for Linux, Windows and Macintosh
- Adobe Dreamweaver
- Web page HTML/code editors for Windows
- Microsoft Visual Studio:
large commercial tool for software development (3GB)
- Visual Studio 2012 release candidates (10GB)
- Microsoft Visual Web Developer Express: free version of Microsoft Visual Studio for ASP.NET Web applications using Visual Basic, C# and HTML (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)
- Microsoft Visual Studio: large commercial tool for software development (3GB)
- Linux text editors (the following are installed on our Web servers)
- Internet Explorer Developer
- Developer Toolbar (Internet Explorer 7)
- F12 Developer Tools (Internet Explorer 8+ )
- Change Browser or Document mode to IE7-9, compatibility view or quirks mode, validate HTML, CSS, feeds or links, inspect HTML or CSS, disable images or CSS, resize, color picker
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
- Web Developer - Validate HTML, CSS, feeds or accessibility
- Link Checker - Checks validity of links on any page
- Spell Checker - Check spelling of a published Web page
- Total Validator - Check HTML (even XHTML5), accessibility, links, spelling, and CSS.
- 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