Hello friends, how are they, I hope well ...
tutorial Here I bring a very interesting and many people are going to fall more than good ...
The theme is: "How to make web pages Macromedia Dreamweaver 8 "( http://i169.photobucket.com/albums/u..._boy17/1-1.jpg )
the end of this tutorial, we can make a basic html page (first part) and frameworks (second part).
Requirements:
have installed Dreamweaver 8, Picture editor (read: paint, paint.NET, photoshop, paint shop pro, etc..) To make or edit your images, banners or necesario.En this tutorial we will make these two types Pages: http://i169.photobucket.com/albums/u..._boy17/6-1.jpg
http://i169.photobucket.com/albums/u..._boy17/7- 1.jpg
Begin!
1. Open Dreamweaver 8 and we will see the welcome screen ( http://i169.photobucket.com/albums/u..._boy17/2-1.jpg ).
2. On the menu that are at the center ( http://i169.photobucket.com/albums/u..._boy17/3-1.jpg ) we see the options that gives the program: open, create and build from . ( http://i169.photobucket.com/albums/u..._boy17/4-1.jpg ).
3. First let's see a basic html page ... then choose "create new", html.
4. After loading, we found our development environment ( http://i169.photobucket.com/albums/u..._boy17/5-1.jpg ).
5. In a basic html page We can do many things, such as inserting images, and writing, we can add a special format that we write, color the page, etc.. To make the page you want to do, is something cesillo. We define the black color as the background and inserted two images of black background and a flash button.
6. To set the color to the page, we know that is a property, then, makes us think that we should find the properties of the page. ( http://i169.photobucket.com/albums/u..._boy17/8-1.jpg ). Otherwise we can button to the page or move the eyelash that was in the lower right.
7. Within this sale of property have the options such as: Source page (the font used in it), size (referring to the font size), Color of text (we all know that is), Background Color ( same as above), Wallpaper (hurts to say), repeat (this property tells you if you want to repeat the image in various ways ( http://i169.photobucket.com/albums/u225/Zero_boy17/10- 1.jpg) not to repeat: do not repeat it, just a look, repeat: I repeated the whole page, repeat x: te repeated in the x-axis, but at the top, and repeat: I repeated on the left side of the sheet.) margin (left, right, top and bottom): determine the margins of the page.
8. Since we want a black page, just select the background color for pantalla.Hay two ways to work the html: through charts or normal (read, make a single image with others, letters, etc. .)
We are going to make a basic html page, the two forms ... with tables and images (banners).
9. Let's make a table title. How do we create? We go to the Insert menu and then select "Table" ( http://i169.photobucket.com/albums/u...boy17/11-1.jpg ). After We will table settings ( http://i169.photobucket.com/albums/u...boy17/12-1.jpg ). If we look, we see the properties of it: rows, columns, wide ... header, etc. Then we left and, if needed.
10. We accept ... and we stay like this: http://i169.photobucket.com/albums/u...boy17/13-1.jpg
11. If we write in the table, you can align left, right or center, but there is one thing, if you leave the table as well, so will appear on the page, so modify the properties of it: http:// i169.photobucket.com/albums/u...boy17/14-1.jpg . Clarified, selected when the cursor puts the edge in rojo.Para not appear in the table, change the values \u200b\u200bof "edge" and equal to 0.
12. To create the page title ("Fumolijup - Herrera") and listed in the center, write in it, the text block and headed to the "Text", we seek the "align" and choose "center" ( http://i169.photobucket.com/albums/u...boy17/15-1.jpg ).
13. If we change the source, just choose the same menu, only "source" ( http://i169.photobucket.com/albums/u...boy17/16-1.jpg ). Si deseamos cambiar el tamaño de la fuente, solo desplegamos la barra de propiedades y cambiamos el tamaño: http://i169.photobucket.com/albums/u...boy17/17-1.jpg . Si quieres cambiarle el color de la letra, cambias su propiedad hay mismo: http://i169.photobucket.com/albums/u...boy17/18-1.jpg Ahora vamos a hacer la parte del centro. Esta haremos con una imagen. Obviamente, dará un poco más de trabajo ya que hay que hacer que ese banner o imagen tenga las características de la página en sí; es decir, color negro del fondo, que no sea ni tan ancha ni tan alta…etc. Ya hice la imagen y así queda: http://i169.photobucket.com/albums/u...boy17/19-1.jpg Am I clear?
14. When we insert any image, go to the Insert menu and choose "image" ( http://i169.photobucket.com/albums/u...o_boy17/20.jpg ). Obviously, we ran a couple of rows for that would not be as tight in the title.
15. We will this when dialogue: ihttp: / / i169.photobucket.com/albums/u225/Zero_boy17/21.jpg We accept our image.
16. We find this: http://i169.photobucket.com/albums/u...o_boy17/22.jpg
17. To be in the center, as we have done previously, select and change its properties: http://i169.photobucket.com/albums/u...o_boy17/23.jpg And look this: http://i169.photobucket.com/albums/u...o_boy17 / 24.jpg Now for the bottom, in the flash button. There is need to have Flash 8, set aside, only if you want to export a flash for your Web.
18. We go to button "flash" which is below the menus "site" and "window" ( http://i169.photobucket.com/albums/u...o_boy17/25.jpg ). Choose the option "flash button ( http://i169.photobucket.com/albums/u...o_boy17/26.jpg .)
19. We will run into this window will be as an assistant to create the button ( http://i169.photobucket.com/albums/u...o_boy17/27.jpg ). The only thing to note is that the style is the type of button that you are taught to "sample." The link (or hyperlink) is the link to the page you want to load when you press the button. Fate is like you going to open (this applies to frames). Another thing ... you must define the background color, in this case: black. Then another window will aceptar.Te accessibility, if you want, fill the data or not.
With this we have completed our Welcome, in a basic html.
Now the second part, we will work on Home Page (home page) with frames.
1.To the left, find the "frameset" ( http://i169.photobucket.com/albums/u...o_boy17/28.jpg ). You click on it.
2.Te the following window: http://i169.photobucket.com/albums/u...o_boy17/29.jpg
3.In the center of it, it shows possible sets available ah pick your pleasure.
4.Encojemos the three frames that fit our target ( http://i169.photobucket.com/albums/u...o_boy17/30.jpg ). And then "create"
you will get a window that is titled "Accessibility Options" which helps us to relate the frames.
Then we met our three frames we wanted ( http://i169.photobucket.com/albums/u...o_boy17/31.jpg ).
Like we did for the basic HTML, understood to add color, tables, images, applies here.
5.Ahora insert the banner at the top. Place the cursor in the framework, in this case will be higher and we went to the Insert menu, choose "image" We all find the picture protocol, and then accept. For us it is just the image, we must put the value of 0 (zero) on the left, right, top and bottom, so that the image does not look bad to us from somewhere: ( http://i169.photobucket .com/albums/u..._boy17/9-1.jpg ).
We must look like this: http://i169.photobucket.com/albums/u...o_boy17/32.jpg
6.Now; we are the same for the center frame, but this time, we can not put an image, remember that there are going to write, are you understanding what I mean? Place, then a picture that is repeated, that is, you have to put an image Background: http://i169.photobucket.com/albums/u...o_boy17/33.jpg
7.For the left frame, we set a background color. Place the cursor in the frame. As we will change are the attributes or properties, we obviously have to go there. In the Properties window frame, just change the color or you can just put an image, all to taste. For purposes of the tutorial, provides only color, but I say it is a matter of taste. In the end we should look like: http://i169.photobucket.com/albums/u...o_boy17/34.jpg
Now, when we extend in under the center, downward, we are not going to run the right frame. It can be done both frames stay the same size, but you have to make the user feel comfortable when visiting the page, what does this mean? That each time the user having to change the topic on the page, you will need to reload the page. So we left him, so that each time the user has to change the topic, information is loaded into the same frame. This is efficiency. Am I explaining what you want to convey? Yes? ... Yes?
Later, I'll add another tutorial to insert flash on our site You put here.
I hope this helps a lot.
Anything, I'm willing to help.
Have fun! Saellvertu
!
Z
1.To the left, find the "frameset" ( http://i169.photobucket.com/albums/u...o_boy17/28.jpg ). You click on it.
2.Te the following window: http://i169.photobucket.com/albums/u...o_boy17/29.jpg
3.In the center of it, it shows possible sets available ah pick your pleasure.
4.Encojemos the three frames that fit our target ( http://i169.photobucket.com/albums/u...o_boy17/30.jpg ). And then "create"
you will get a window that is titled "Accessibility Options" which helps us to relate the frames.
Then we met our three frames we wanted ( http://i169.photobucket.com/albums/u...o_boy17/31.jpg ).
Like we did for the basic HTML, understood to add color, tables, images, applies here.
5.Ahora insert the banner at the top. Place the cursor in the framework, in this case will be higher and we went to the Insert menu, choose "image" We all find the picture protocol, and then accept. For us it is just the image, we must put the value of 0 (zero) on the left, right, top and bottom, so that the image does not look bad to us from somewhere: ( http://i169.photobucket .com/albums/u..._boy17/9-1.jpg ).
We must look like this: http://i169.photobucket.com/albums/u...o_boy17/32.jpg
6.Now; we are the same for the center frame, but this time, we can not put an image, remember that there are going to write, are you understanding what I mean? Place, then a picture that is repeated, that is, you have to put an image Background: http://i169.photobucket.com/albums/u...o_boy17/33.jpg
7.For the left frame, we set a background color. Place the cursor in the frame. As we will change are the attributes or properties, we obviously have to go there. In the Properties window frame, just change the color or you can just put an image, all to taste. For purposes of the tutorial, provides only color, but I say it is a matter of taste. In the end we should look like: http://i169.photobucket.com/albums/u...o_boy17/34.jpg
Now, when we extend in under the center, downward, we are not going to run the right frame. It can be done both frames stay the same size, but you have to make the user feel comfortable when visiting the page, what does this mean? That each time the user having to change the topic on the page, you will need to reload the page. So we left him, so that each time the user has to change the topic, information is loaded into the same frame. This is efficiency. Am I explaining what you want to convey? Yes? ... Yes?
Later, I'll add another tutorial to insert flash on our site You put here.
I hope this helps a lot.
Anything, I'm willing to help.
Have fun! Saellvertu
!
Z
