1. Week 11 Further Web Design Concepts and Tools FTP, CMS, Wordpress and Responsive Web Design

2. File Transfer Protocol (FTP) FTP is the acronym for File Transfer Protocol. As the name suggests, FTP is used to transfer files between computers on a network. You can use FTP to exchange files between computer accounts, transfer files between an account and a desktop computer, or access online software archives. FTP is used to upload your completed website to a web server.

3. How To Use FTP Graphical FTP clients Graphical FTP clients simplify file transfers by allowing you to drag and drop file icons between windows. When you open the program, enter the name of the FTP host (e.g., ftp.empire.gov ) and your username and password. Some common FTP programs includes Cyberduck, WinSCP, FileZilla and Cute FTP. Web browser FTP Often your web host may offer a web browser based service to connect to FTP addresses. Using a web browser for FTP transfers makes it easy for you to browse large directories and read and retrieve files. Your web browser will also take care of some of the details of connecting to a site and transferring files. While this method is convenient, web browsers are often slower and less reliable than graphical FTP clients. Command line FTP If you are feeling really nerdy Windows, Mac OS X, and Linux also have built-in command line clients.

4. Exercise 1:Using an FTP Client Links: http://cyberduck.ch/ https://filezilla-project.org/ http://www.cuteftp.com/ http://winscp.net/eng/index.php

5. Content Management Systems: A Content Management System (CMS) is a bundled or stand-alone application to designed create, manage, store and deploy content on Web pages. CMS features vary widely from system to system. Simple systems showcase a handful of features, while other releases offer more complex and powerful functions. Most CMS include Web-based publishing, format management, revision control, indexing, search, and retrieval tools. Popular content management systems include: Wordpress ( http://wordpress.org/ )http://wordpress.org/ Weebly ( http://www.weebly.com/ )http://www.weebly.com/ Concrete 5 ( http://www.concrete5.org/ )http://www.concrete5.org/ SquareSpace ( http://www.squarespace.com/ )http://www.squarespace.com/

6. Wordpress: WordPress is a powerful semantic publishing platform, and it comes with a great set of features designed to make your experience as a publisher on the Internet easy. It was developed in 2003 as a blogging system, but has since developed into the most popular CMS used today. Wordpress Themes: Wordpress uses themes to ‘skin’ or alter the layout and design of a wordpress site. A WordPress Theme is a collection of files that work together to produce a graphical interface with an underlying unifying design for a weblog. These files are called template files.template files A Theme modifies the way the site is displayed, without modifying the underlying software.

7. Exercise 2: Installing Wordpress 1. Download the latest release of WordPress. Download 2. Unzip the downloaded file to a folder on your hard drive. 3. Follow the MDIM Guide found on the class blog.

8. Responsive Web Design: Responsive web design is a concept/web design approach aimed at crafting sites to provide an optimal viewing experience— that is easy reading and navigation with a minimum of resizing, panning, and scrolling, across a wide range of devices (from desktop computer monitors to mobile phones). One way to make a design “responsive” is to use fluid, percentage-based layouts which scale as the viewport shifts. This approach, coupled with media queries that target common device sizes, will give you the best shot at building a robust responsive design that both looks great and behaves as you expect across a multitude of devices.fluid, percentage-based layoutscommon device sizes http://www.w3.org/TR/css3-mediaqueries/ http://css-tricks.com/css-media-queries/ EXAMPLES: http://styletil.es/ http://stuffandnonsense.co.uk/

9. Responive web Design Themes with Wordpress http://codex.wordpress.org/Using_Themes http://codex.wordpress.org/Using_Them http://themetrust.com/ http://inspiredm.com/10-best-new-free-and-responsive-wordpress-themes/