Download
1 / 9
90 likes | 185 Vues
CSW 131 Free MS Software (MSDNAA) MS Visual Web Developer W3 / Mozilla Code Validators Uploading Your Website. Summer 2013 Prepared by Prof. B . INDEX. Download & Install.
E N D
CSW 131 Free MS Software (MSDNAA)MS Visual Web DeveloperW3 / Mozilla Code ValidatorsUploading Your Website Summer 2013 Prepared by Prof. B. INDEX
Download & Install • Visual Web Developer (VWD) is a web page and site development and management environment, enabling easy uploads to WCU’s server. • Just ONE of Microsoft’s program that are similar to Adobe Dreamweaver • FREE Microsoft programs available to WCU students currently enrolled in at least one computer science course • This program is loaded on the UNA 141 PCs • Optional: link to download VWD for use on your own PC is on the class website “Hot!” page and slide 9. • This program requires a Windows OS • If you choose to keep it, you must register the product (free) Back to Summary (and Index)
Starting the Program & Opening a Web Site • Select Start | All Programs | Microsoft Visual Web Developer 2010 Express Edition • Insert your flash drive • Click File | Open Web Site… • Click Class_work folder in your flash drive | Open Back to Summary (and Index)
Working with a Web Page in a Web Site • In Solution Explorer open index.html within ch05 in your Class_workfolder • To show line numbers: • click Tools | Options | General, check Line numbers, then click OK • Note the color coding: some examples are: • <tags> • selector{property:value; • notation / comments • general text • At the bottom of the VWD screen, click: • Split to see both code & WYSIWYG • Design for WYSIWIG view only • An approximation only; testing is still needed! • Source for code only • Try the buttons at the bottom of the screen Back to Summary (and Index)
Adding a New Web Page in a Web Site • Within Class_work, Chapter 05,click File | New File… • From Add New Item window select HTML Page, name it test.htm (or test.html – be consistent), then click AddORRight-click the top level under Solution Explorer, and select Add New Item, then select HTML page • Notice the new page has been added to your folder and the default Source code to start has been inserted. • Experiment with this file • When done you can delete it within Solution Explorer • Right click test.htm (or test.html) • Click Delete • Click OK Back to Summary (and Index)
Creating a New Web Site • Create a folder on your flash drive for websites, e.g.,csw131\websites • From within VWD program click File | New Web Site… • From New Web Site window, with Visual Basic highlighted under Installed Templates, select ASP.NET Empty Web Site, name it TestWebon your flash drive, e.g.,CSW131\Websites\TestWebthen click OK • You can add new web pages per the previous slide and delete web.config, which is not needed. Back to Summary (and Index)
Validating Your Code • With Mozilla, w3.org has a number a free tools. We can check our web pages for proper (X)HTML code at: • http://validator.w3.org/ And check for proper CSS code at: • http://jigsaw.w3.org/css-validator/ • Go to the 1st link, click the By file upload tab, use the Browse… to select index.html from index.html within ch05 in your Class_workfolder, then click the Check button. • Errors and warnings (if any) will appear. Use VWD to editline 2:<html xmlns="http://www.w3.org/1999/xhtml"> and on a new line after </title> type <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />, save and recheck. • Next try the 2nd link for both index.html and styles.csswithin ch05 in your Class_workfolder. Selecting and checking files works as above. • Again, errors and warnings (if any) will appear and you can make any needed changes within VWD, Save, then Check again. • Note: Using UTF-8encoding “internationalizes” your website. Back to Summary (and Index)
Copying a Web Site to Your WCU Server Location • Within VWD, and E:\csw131\project\(your web site open), in Solution Explorer(top right of screen), click Copy Web Site icon • Click the Connect icon • Click the FTP Site icon • Server: ftp://fl123456@roadrunner.cs.wcupa.edu/e.g., fl is for Fran Lowe followedby a WCU student ID number • Username:fl123456 • Password: fl123456 (may needto be entered twice) • Click Open button and MAKESURE html_public is selected on right • Highlight files & folders to uploadon left side of screen • Click right arrow symbol and pages are uploaded • See web site online: http://roadrunner.cs.wcupa.edu/~fl123456 • Note:These uploads may ONLY be done WHEN ON CAMPUS!Note2: Create uploading.txt withyour server & URL information; Now! 3 1 2 4 5 Back to Summary (and Index)
Summary (and Index) • WCU CSC students can get free MS software (slide 2). • VWD is a web page and site development and management environment, enabling easy uploads to WCU’s server (slide 2). • VWD is loaded on UNA 141 PCs, is easy to use (slide 3), and can be downloaded freefor use on any Windows PC. • Coding is color keyed (slide 4) • Three coding environments (slide 4) are: • Source (code only) • Design (WYSIWYG) • Split (both code & WYSIWYG)WYSIWYG is an estimated appearance: always test! • Creating new web pages (slide 5) or websites (slide 6). • Validate your XHTML & CSS with W3.org tools (slide 7). • Uploads to WCU’s server are easy (slide 8), but may only be available when on campus.
