You are on page 1of 19

LA WORLD WIDE WEB

Web o la web, la red o www de World Wide Web, es


bsicamente un medio de comunicacin de texto,
grficos y otros objetos multimedia a travs de Internet,
es decir, la web es un sistema de hipertexto que utiliza
Internet como su mecanismo de transporte o desde otro
punto de vista, una forma grfica de explorar Internet.

La web fu creada en 1989 en un instituto de investigacin


de Suiza , la web se basa en buscadores y el protocolo de
transporte de hipertexto (hypertext transport protocol
(http)). La mayora de los documentos de la web se crean
utilizando lenguaje HTML (hypertext markup language).
Es importante saber que web o www no son sinnimo de
Internet, la web es un subconjunto de Internet que consiste
en pginas a las que se puede acceder usando
unnavegador. Internet es la red de redes donde reside toda
la informacin.
En informtica, la World Wide Web (WWW) o Red
informtica mundial1 comnmente conocida como la
web, es un sistema de distribucin de documentos
o
hipermedios interconectados y accesibles va Internet.Con
un navegador web, un usuario visualiza sitios
web compuestos de pginas web que pueden
contener
texto,
imgenes,
vdeos
u
otros
contenidos multimedia, y navega a travs de esas pginas
usando hiperenlaces.

La web se desarroll entre marzo de 1989 y diciembre


de 19902 3 por el ingls Tim Berners Lee con la ayuda del belga Robert Cailliau mientras trabajaban
en el CERN en Ginebra, Suiza, y publicado en 1992. Desde
entonces, Berners-Lee ha jugado un papel activo guiando el
desarrollo de estndares Web (como los lenguajes de
marcado con los que se crean las pginas web), y en los
ltimos aos ha abogado por su visin de una Web semntica.
Utilizando los conceptos de sus anteriores sistemas de
hipertexto como ENQUIRE, el ingeniero britnico Tim BernersLee, un cientfico de la computacin y en ese tiempo de los
empleados del CERN, ahora director del World Wide Web
Consortium (W3C), escribi una propuesta en marzo de 1989
con lo que se convertira en la World Wide web

Las Reglas de la estructura de una direccin WEB


Selectores
Cualquier elemento HTML es un posible selector CSS1. El selector es
simplemente el elemento que est conectado a un estilo particular.
Por ejemplo, el selector en:
P { text-indent: 3em }
es p .
Selectores de clases
Por ejemplo, un autor puede querer mostrar el cdigo de color
diferente dependiendo del idioma:
code.html { color: #191970 }
code.css { color: #4b0082 }

Selectores ID
Los selectores ID son asignados individualmente con el
propsito de una definicin en trminos 'por elemento'.
Este tipo de selector debera ser usado con moderacin
debido a sus inherentes limitaciones. Un selector ID se
asigna mediante el uso del indicador

"#" para preceder un nombre. Por ejemplo, un #svp94O {


text-indent: 3em }
Esto sera referenciado en HTML por el atributo ID:
P ID=svp94O>Texto con sangra 3em</P>selector ID

Selectores de contexto
Los selectores de contexto son simples cadenas de dos
o ms selectores simples separados por espacio en
blanco. A estos selectores se les pueden asignar
propiedades normales y, debido a las reglas del orden
de cascada, tendrn precedencia sobre selectores.

Propiedades
Se asigna una propiedad a un selector a fin de manipular
su
estilo.
Ejemplos
de propiedades incluyen color, margin, y font.
Valores
El valor de declaracin es la asignacin que recibe la
propiedad. Por ejemplo, la propiedad color podra recibir
el valor red (rojo).
simples.

Agrupamiento
A fin de disminuir declaraciones repetitivas dentro de
hojas de estilo, se permite el agrupamiento de selectores
y declaraciones. Por ejemplo, todos los encabezados en
un documento podran tener idnticas declaraciones
mediante un agrupamiento:
H1, H2, H3, H4, H5, H6 { color: red; font-family: sansserif }
Herencia
Prcticamente todos los selectores que estn anidados
dentro de selectores, heredarn los valores de
propiedades asignados al selector exterior, salvo que se
modifiquen
de
otra
manera.
Por
ejemplo,
un color definido por BODY tambin ser aplicado al
texto en un prrafo

Comentarios
Los comentarios se indican dentro de hojas de estilo
con las mismas convenciones usadas en la
programacin C. Una muestra de comentario CSS1
tendra el siguiente formato:
/* LOS COMENTARIOS NO PUEDEN ANIDARSE */
Seudo-clases y seudo-elementos

Las reglas con seudo-clases o seudo-elementos toman


la forma
selector:seudo-clase { propiedad: valor } o
selector:seudo-elemento { propiedad: valor } Las seudoclases y seudo-elementos no deberan especificarse con
el atributo CLASS de HTML. Las clases normales pueden
usarse con seudo-clases y seudo-elementos

Seudo-clases Ancla (Anchor)

Las seudo-clases puede asignarse al elemento A para


mostrar enlaces, enlaces visitados y enlaces activos en
forma diferente. El elemento ancla puede asignar a la
seudo-clase link (enlace), el estado de visitada, o activa.
Un enlace visitado puede definirse para representar un
color diferente e inclusive un diferente tamao y estilo
de fuente.
La hoja de estilo de muestra podra lucir as:
A:link
{ color: red }A:active { color: blue; font-size:
125% }A:visited { color: green; font-size: 85% }

Seudo-elemento Primera lnea


Con frecuencia, en artculos de peridicos, como los
del Wall Street Journal, la primera lnea de texto de un
artculo se muestra en negrita y con todas las letras en
maysculas. CSS1 ha incluido esta capacidad como un
seudo-elemento. Un seudo-elemento first-line puede usarse
en cualquier elemento de nivel de bloque (como P, H1, etc.).
Un ejemplo de un seudo-elemento first-line sera: P:first-line
{font-variant: small-caps; font-weight: bold }
Seudo-elemento First letter
El seudo-elemento first-letter se emplea para crear letras
capitales y otros efectos. La primera letra de texto dentro de
un selector asignado se representar de acuerdo al valor
asignado. Un seudo-elemento first-letter puede usarse en
cualquier elemento de nivel de bloque. Por ejemplo:
P:first-letter { font-size: 300%; float: left } creara una letra
capital tres veces mayor que el tamao normal de fuente.

Orden de Cascada

Cuando se usan varias hojas de estilo, puede haber un


conflicto sobre cual controla a un selector en particular.
En estas situaciones, debe haber reglas para definir la
regla de la hoja de estilo que prevalecer. Las siguientes
caractersticas determinarn el resultado de hojas de
estilo que se contraponen.
! important
Puede establecerse una regla como importante al
especificar ! important. Un estilo designado como
importante prevalecer sobre estilos contradictorios de
similar nivel. Asimismo, ya que tanto el autor y el lector
pueden especificar reglas importantes, la regla del autor
primar sobre la regla del lector en casos de
importancia. Una muestra del uso de la sentencia!

Origen de las reglas (del autor frente a las del lector)


Como ya se mencion, tanto los autores como los lectores
tienen la capacidad de especificar hojas de estilo. Cuando
hay un conflicto entre reglas, las reglas del autor
prevalecern sobre las reglas del lector de similar peso.
Tanto las hojas de estilo del autor como las del lector
primarn sobre las hojas de estilo incorporadas del
navegador.
Los autores deberan ser cautelosos con el empleo de
reglas ! importante ya que primarn sobre las
reglas ! importante del lector. Un usuario puede, por
ejemplo, necesitar de grandes tamaos de fuentes o colores
especiales debido a problemas de visin, y tal usuario
querr
declarar
que
ciertas
reglas
de
estilo
sean ! importante, ya que algunos estilos son vitales para
que
pueda
leer
una
pgina.
Cualquier
regla ! importante prevalecer sobre las reglas normales,
por lo que se aconseja a los autores usar reglas normales
casi exclusivamente para asegurar que los usuarios con
necesidades especiales de estilos puedan leer la pgina.

Reglas de selector: Calculando especificidad

Las hojas de estilo tambin pueden primar sobre hojas


de estilo en conflicto basndose en su nivel de
especificidad, donde un estilo ms especfico siempre
prevalecer sobre uno menos especfico. Simplemente
es cuestin de contar para calcular la especificidad de
un selector.

Cuente el nmero de atributos CLASS en


el selector.
Cuente el nmero nombres de etiquetas
HTML en el selector.
atributos ID en el selector

Finalmente, escriba los tres nmeros en orden exacto


sin espacios ni comas para obtener un nmero de tres
dgitos. (Nota: puede necesitar convertir los nmeros a
una base mayor para terminar con tres dgitos.) La lista
final de nmeros que corresponden a selectores
determinar fcilmente la especificidad, donde los
nmeros ms altos priman sobre los ms bajos. La
siguiente es una lista de selectores ordenados por
especificidad:
#id1

{xxx} /* a=1 b=0 c=0 --> especificidad = 100 */

UL UL LI.red {xxx} /* a=0 b=1 c=3 --> especificidad = 013


*/
LI.red
LI

{xxx} /* a=0 b=1 c=1 --> especificidad = 011 */


{xxx} /* a=0 b=0 c=1 --> especificidad = 001 */

Orden de especificacin
Para hacerlo sencillo, cuando dos reglas tienen el
mismo peso, prima la ltima regla especificada

Qu es un hipervnculo?
Un hipervnculo es un enlace, normalmente entre dos pginas web
de un mismo sitio, pero un enlace tambin puede apuntar a una
pgina de otro sitio web, a un fichero, a una imagen, etc. Para
navegar al destino al que apunta el enlace, hemos de hacer clic
sobre l. Tambin se conocen como hiperenlaces, enlaces o links.
Normalmente el destino se puede saber mirando la barra de
estado del navegador cuando el ratn est sobre el hipervnculo.
Dependiendo de cual sea el destino , hacer clic en un hipervnculo
puede hacer que ocurran varias cosas. Si el destino es otra pgina
web, el navegador la cargar y la mostrar, pero si el destino es un
documento de Word, el navegador nos dar la posibilidad de abrir
una sesin de Word para visualizarlo o de guardar el archivo.
Por lo tanto, podemos usar los hipervnculos para conducir a los
visitantes de nuestro sitio web por donde queramos. Adems, si
queremos que se pongan en contacto con nosotros, nada mejor que
ofrecerles un hipervnculo a nuestro correo electrnico.

Tipos de hipervnculos.
Existen varios tipos de hipervnculos. Vamos a ver los
ms usados.
Hipervnculo de texto: Un hipervnculo de texto es un
enlace que se encuentra asociado a un texto, de forma
que si hacemos clic sobre ese texto, navegamos dnde
indique el hipervnculo. Por defecto, cuando creamos un
hipervnculo de texto, el texto aparece subrayado y en
un color distinto al del texto normal, de forma que el
visitante sepa que existe ese enlace. Si volvemos a la
pgina despus de visitar el enlace, este aparecer con
otro tono tambin. Aunque es interesante diferenciar el
hiperenlace, es posible que no queramos que aparezca
as.

Hipervinculo de imagen: Un hipervnculo de imagen es


un enlace que se encuentra asociado a una imagen, de
forma que si hacemos clic sobre esa imagen,
navegamos dnde indique el hipervnculo. Por defecto
cuando creamos un hipervnculo de imagen, la imagen
aparece rodeada de un borde con un color llamativo
para que el visitante sepa que existe ese enlace.
Por otra parte, los hipervnculos pueden referirse a
pginas del mismo sitio web o de otros sitios web.
Hipervnculo local o interno: Un hipervnculo local o
interno es un vnculo a una pgina que se encuentra en
el mismo sitio web (sitio local). As, para referirnos a ella
tan solo basta con poner la ruta o direccin en el disco
duro. Si se encuentra en la misma carpeta, basta con
poner
su
nombre.
Por ejemplo, supongamos que tenemos un vnculo
desde esta pgina a otra llamada curso que est en la
carpeta access . El vnculo sera: access/curso.htm

Hipervnculo externo : Un hipervnculo externo es un


vnculo a otro sitio web en Internet (sitio externo). Es un
vnculo a cualquier otro lugar fuera del sitio actual. Cuando
ponemos un vnculo externo, escribimos la direccin
completa de la pgina incluido http://www...
Hipervnculo a una direccin de correo electrnico: Un
hipervnculo a una direccin de correo electrnico es un
vnculo que contiene una direccin de correo. Al pulsar en
l, automticamente se abre el programa de correo que
tenga el usuario instalado para poder escribir a esa
direccin de correo. Existen diferentes clases de rutas de
acceso a la hora de definir los vnculos.

Referencia absoluta: Conduce a una ubicacin externa al


sitio en el que se encuentra el archivo. La ubicacin es en
Internet, es decir toda la url identificativa del archivo en la
red. Los hipervnculos externos siempre deben tener una
referencia absoluta. Por ejemplo: "http://www.ecomur.com".
Los hipervnculos internos pueden tener referencia
absoluta o relativa.

Referencia relativa (al sitio o al documento): La


referencia relativa al sitio conduce a un archivo situado
dentro del mismo sitio que el documento actual
partiendo del directorio raiz y al documento conduce a
un archivo situado dentro del mismo sitio que el archivo
actual, pero partiendo del directorio en el que se
encuentra el actual.
Referencia a una parte de un documento: Conduce a un
punto dentro de un documento, ya sea dentro del actual
o de otro diferente. Primero debemos definir un punto de
fijacin, anclaje o marcador. El punto se define dentro de
un documento con el cursor en el lugar exacto a travs
del men Insertar , opcin Anclaje con nombre (DW) o
Marcador
(FP).
Despus colocar el vnculo:" #nombre_anclaje" (misma
pgina)
"
nombre_documento#nombre_anclaje"
(distinta
pgina).

You might also like