Download presentation
Presentation is loading. Please wait.
1
Summer 2013 Prepared by Prof. B. INDEX
CSW 131 Free MS Software (MSDNAA) MS Visual Web Developer W3 / Mozilla Code Validators Uploading Your Website Summer 2013 Prepared by Prof. B. INDEX
2
Back to Summary (and 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)
3
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)
4
Working with a Web Page in a Web Site
In Solution Explorer open index.html within ch05 in your Class_work folder 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)
5
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 Add OR Right-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)
6
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 TestWeb on your flash drive, e.g., CSW131\Websites\TestWeb then 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)
7
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: And check for proper CSS code at: 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_work folder, then click the Check button. Errors and warnings (if any) will appear. Use VWD to edit line 2: <html xmlns=" 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.css within ch05 in your Class_work folder. 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-8 encoding “internationalizes” your website. Back to Summary (and Index)
8
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: roadrunner.cs.wcupa.edu/ e.g., fl is for Fran Lowe followed by a WCU student ID number Username: fl123456 Password: fl (may need to be entered twice) Click Open button and MAKE SURE html_public is selected on right Highlight files & folders to upload on left side of screen Click right arrow symbol and pages are uploaded See web site online: Note: These uploads may ONLY be done WHEN ON CAMPUS! Note2: Create uploading.txt with your server & URL information; Now! 1 2 3 4 5 Back to Summary (and Index)
9
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 free for 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.
Similar presentations
