BWD Lab-1 en
BWD Lab-1 en
BWD Lab-1 en
2. To create the new project, in the dialog we have to set the following parameters:
• Project name: unique name of the project(e.g. Lab01)
• Location: the location on the hard drive where the project will be created (you must have
write permissions to the directory, e.g. My Documents)
• Project Type: the type of the project. In our case it will be an Empty Project.
3. After that, the main window will appear, consistin of multiple parts:
1. Menus and toolbars - the main menu and toolbars let you carry out various commands.
2. Navigation bar that helps navigate through the project and open files for editing.
3. The status bar - indicates the status of your project, the entire IDE, and shows various warning
and information messages.
4. The editor - here you create and modify the code.
5. WebStorm tool windows - secondary windows that provide access to various specific tasks
(project management, source code search and navigation, running and debugging, integration
with version control systems, etc.).
Form the Project window (by using right mouse button on the project folder name) or by using
the File menu, you can create a new HTML file, give it a name (e.g. index) and choose the type
of the html file (HTML5, HTML or XHTML).
Task 1: Research the functionalities of WebStorm. Create a project with name Lab1. Create a HTML 4
document with name Lab1-1 in the project Lab1, and add the following HTML code.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> Прва лабораториска вежба по Основи на Веб Дизајн</title>
</head>
<body>
<h1>
Веб Дизајн
</h1>
<span>Овој текст е составен од </span><b>здебелени </b>
<em>закосени </em><u> и подвлечени</u><span>букви.</span>
<br />
<hr />
</body>
</html>
Run the document in a web browser, and examine the used HTML elements. Correct the document if
necessary for it to be corrent (e.g. encoding)
Task 2:
Create another HTML4 document, named Lab1.2 in the same project. In this document insert the
following code in the document and using the features in WebStorm, detect and correct the errors in the
document.
<html>
<head>
</head>
<body>
<h1>
Главен наслов на страната
<span>Овој текст се употребува за
</h1>
пронаоѓање на <b> грешките </em> во <u>кодот .</span>
<br//>
<br />
</body>
</html>
Task 3:
Create two HTML pages. The first one should have the following content:
• Title: First page for the task 3
• content: Paragraph with the following text: “In 5 seconds you will be redirected to the next
page!”
After 5 seconds, the user should be redirected to the second page.
The second page should have the following content:
• title: Second page for task 3
You should have two paragraphs that have text description about you. Both pages should have the the
correct meta tags that should enable indexing of search engines, cyrillic text, encoding, Setc.