Rss Feed

  1. Modelo OSI

    segunda-feira, 24 de junho de 2013

    O modelo OSI (Open System Interconection) é um modelo conceitual que caracteriza e padroniza as funções internas de um sistema de comunicações por meio de seu particionamento em camadas (layers) abstratas. Esse modelo foi definido pela ISO (International Organization for Standarition). 

    O modelo conceitual OSI é dividido em 7 camadas lógicas. São elas:



    Camada Física: Também conhecida como PHY, é responsável por fornecer a mecânica elétrica, meios funcionais para estabelecer as conexões entre as entidades de enlace.

    Camada de Enlace: Fornece a comunicação para o TCP e UDP, o método inclui o estabelecimento manutenção e liberação da comunicação. Também é responsável por detectar erros que ocorrem na camada física. O IEEE dividiu o Enlace em 2 sub-camadas: o Logical Link Control (LLC) e o Medium Access Control (MAC).

    Camada de Rede: Fornece os meios funcionais e procedurais para o modo sem conexão (UDP) ou modo conectado (TCP). Fornece também entidade de transportes independentes de roteamento e considerações de relay. Por exemplo: um roteador IP não se incomoda de rotear uma mensagem de email ou uma conversação por voz.

    Camada de Transporte: Tem como objetivo o fornecimento de uma transferência de dados transparente entre as entidades da sessão, liberando-as de detalhes desnecessários. Essa camada garante a conformidade com QoS (Quality of Service).

    Camada de Sessão: Fornece os meios necessários para cooperação das entidades da camada de Apresentação para organizar e sincronizar seu diálogo e gerenciar a troca de dados. A sessão inclui comunicação entre as entidades e define as regras nas quais a comunicação ocorre. As sessões são criadas, a comunicação acontece e as sessões são destruídas ou finalizadas.

    Camada de Apresentação: Fornece uma representação da informação comunicada ou referenciada pelas entradas da camada de aplicação. Fornece também a gestão da sintaxe e conversão para serviços da encriptação.

    Camada de Aplicação: Contém protocolos de alto nível, com os quais os aplicativos conversam. Por exemplo: o Microsoft Outlook precisa conversar com o Simple Mail Transform Protocol (SMTP) para conseguir transferir as mensagens.

    Postado por Unknown às 21:08 | Marcadores: | 0 comentários | |

  2. Javascript: Linguagem de programação, desenvolvida pela Netscape Inc. Reside dentro de documentos HTML e fornece níveis de interatividade com páginas web que não podem ser obtidas com HTML simples.

    AJAX: “Asynchronous JavaScript and XML” – É a união do Javascript ao XML, essa junção faz com que informações sejam carregadas de forma assíncrona. Usar Ajax no desenvolvimento de serviços web permite que a cada novo dado inserido em um formulário, por exemplo, seja enviado ao servidor e validado quase que simultaneamente, trazendo uma resposta para o cliente antes que ele tenha enviado de fato essa informação.

    ASP: “Active Server Pages” – É um framework cliente / servidor criado pela Microsoft. Tem como principal objetivo a criação de páginas dinâmicas e interativas, usando principalmente a conexão com banco de dados. Os scripts (que rodarão no lado servidor) são adicionados direto nas páginas HTML, mas uma vez que uma página tenha codificação ASP, deve ter sua extensão alterada para .asp.

    PHP: Uma linguagem de programação que permite a criação de sites dinâmicos, inteiramente ligados à banco de dados, o que possibilita envios e atualizações de informação por intermédio de sistemas administrativos, formulários ou outras aplicações. É executado diretamente no servidor, trazendo a informação no próprio html, a vantagem é que o código não é exposto ao cliente.

    Python: Uma linguagem de programação orientada a objetos. Suas características mais marcantes são: uma semântica dinâmica e um mecanismo modernizado para tratamento de erros e execuções. Seu modelo de desenvolvimento é comunitário, o que permite que vários programadores possam contribuir, entretanto é gerenciado pela organização Python Software Foundation.

    Ruby on rails: Um framework de desenvolvimento web escrito na linguagem Ruby. Esse framework tem como função a criação de aplicações web de forma mais descomplicada, é bastante dinâmico e comparado a outras linguagens de programação, permite que muitas coisas sejam feitas com menos código.

    .NET: Uma plataforma de programação cuja principal funcionalidade é rodar diversas linguagens. Desenvolvida pela Microsoft, qualquer código gerado em .NET pode ser executado em qualquer dispositivo que possua o framework dessa plataforma graças ao chamado CLR (Common Language Runtime), que é uma aplicação similar à uma maquina virtual.

    XML: “Extensible Markup Language” – É uma linguagem de marcação para criação de documentos com dados organizados. É classificada como extensível porque permite definir os elementos de marcação e traz consigo uma sintaxe básica que pode ser usada para compartilhar informações entre diferentes computadores e aplicações.

    Postado por Unknown às 19:34 | Marcadores: | 0 comentários | | Local: Embu - São Paulo, República Federativa do Brasil

  3. Site pessoal

    segunda-feira, 10 de junho de 2013

    http://btl.vv.si/torres-web/

    Postado por Unknown às 19:51 | Marcadores: , , | 0 comentários | |

  4. Tutorial CSS

    segunda-feira, 3 de junho de 2013

    As "Media Types" foram criadas para o CSS com o objetivo de aumentar a acessibilidade do site por diversos meios, sejam eles: celulares, tablets, computadores e até mesmo telas de televisores.
    Entretanto, as páginas muitas vezes não são necessárias apenas para visualização, como também para impressão, nesse caso  utilizamos os "media types" para facilitar ao navegador a identificação de qual dispositivo está acessando aquele site no momento.
    Tipos de medias que podem ser aplicadas:

    all: Com a definição do media, esse é o tipo padrão;
    aural: Para sintetizadores de som;
    braille: Para dispositivos táteis;
    embossed: Para impressoras em braille;
    handheld: Estilos para celulares de baixos recursos visuais;
    print: Para impressão;
    projection: Para projeções de slides, por exemplo.
    Screen: Para qualquer dispositivo de telas coloridas;
    tv: Para televisores.

    Os dois "media types" mais utilizados são:
    Screen: Para telas de dispositivos, sejam eles móveis ou não;
    Print: Para impressoras, geralmente para dar uma boa qualidade para a página que pode ser impressa. 

    Exemplo de sintaxe do screen:
    <!DOCTYPE>
    <html>
    <head>
    <link rel="stylesheet" type="text/css" a href="estilo.css" media="screen">
    <title>Exemplo de utilização do screen</title>
    </head>
    <body>
                                    <section>
                    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam cursus. Morbi ut mi. Nullam enim leo, egestas id, condimentum at, laoreet mattis, massa. Sed eleifend nonummy diam. Praesent mauris ante, elementum et, bibendum at, posuere sit amet, nibh. Duis tincidunt lectus quis dui viverra vestibulum. Suspendisse vulputate aliquam dui. Nulla elementum dui ut augue. Aliquam vehicula mi at mauris.
                                    </section>
    </body>
    </html>

    Exemplo de sintaxe voltado aos dispositivos de impressão:
    <!DOCTYPE>
    <html>
    <head>
    <link rel="stylesheet" type="text/css" a href="estilo.css" media="print">
    <title>Exemplo de utilização do screen</title>
    </head>
    <body>
                                    <section>
                    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam cursus. Morbi ut mi. Nullam enim leo, egestas id, condimentum at, laoreet mattis, massa. Sed eleifend nonummy diam. Praesent mauris ante, elementum et, bibendum at, posuere sit amet, nibh. Duis tincidunt lectus quis dui viverra vestibulum. Suspendisse vulputate aliquam dui. Nulla elementum dui ut augue. Aliquam vehicula mi at mauris.
                                    </section>
    </body>
    </html>

    Segundo o InfoWester, seguem umas dicas para páginas de impressão:

    * Definir todas as cores em tons de cinza;
    * Sublinhar os links, e de preferência imprimir seus endereços;
    * Escolher uma fonte serifada para os textos, que é mais fácil de ser lida no papel, já que foi criada para isso;
    * Definir as unidades de texto em pontos, e não em pixels;
    * Remover elementos não essenciais, como menus, barras laterais e, dependendo do caso, anúncios publicitários;

    * Quando aplicável, destacar o endereço do site e o autor do texto.

    Postado por Unknown às 20:26 | Marcadores: , | 0 comentários | |

  5. Efeito Cascata e Herança:

    “O Efeito Cascata do CSS é controlado pela especificidade e pela herança das propriedades.” (EIS, Diego) http://tableless.com.br

    O CSS (Cascading Style Sheet), já nos sugere através de seu nome, que o código e suas folhas são no estilo cascata, mas o que isso significa?
    O Estilo Cascata é uma forma de organização de todo o código CSS, uma parte importante do Estilo Cascata é a Herança de seus elementos. Essa forma de organização divide os elementos em dois tipos: ‘elementos pai’ e ‘elementos filhos’, de forma que, ao dar determinada característica para algum elemento, outros elementos que dependem deste primeiro herdarão essa característica, dessa forma você poupa tempo e não tem a necessidade de ficar procurando vários elementos espalhados pelo código quando quiser fazer alguma alteração específica no estilo do seu site.

    Exemplo:
    div{
    color: red;
    }

    /*Foi criada uma div e lhe atribuí a cor vermelha, no HTML eu incluí um texto dentro de uma tag <p> que foi inserida dentro da <div>. Automaticamente esse texto adquiriu a cor vermelha, este fato decorreu da herança de propriedade do CSS.*/

    Exemplo prático:

    Veja no html:










    Veja no CSS:











    Resultado na tela do navegador:









    Mas existem também propriedades que não são herdadas pelos filhos, geralmente são propriedades que estão relacionadas a formatação de caixa, por exemplo: height, width, margin, padding e por aí vai.


    Especificidade:

    A especificidade define os detalhes dos elementos, por exemplo, ao definir no body as propriedades font-family, font-size e font-color, essas propriedades são herdadas por todos os elementos do arquivo. Com isso o texto ficará padronizado, entretanto, suponhamos que você queira diferenciar em algum aspecto algumas palavras que estão em ênfase no seu texto, a especificidade entra aí.


    Exemplo:
    No documento html eu adicionei uma passagem do grande texto “Lorem Ipsum”, decidi enfatizar algumas palavras que são cognatas do nosso português.
    Utilizando somente o <em>, as palavras que estiverem dentro dele aparecerão em itálico.











    Usei então o CSS para especificar que as palavras que estiverem entre a tag <em> terão o background amarelo.










    Resultado: Além de ter ficado em itálico, as palavras ainda ficaram com um efeito de marca-texto, algo mais detalhado que o convencional. A especificidade está aqui pra adicionar detalhes singelos, mas que gerem boas alterações visuais na página, em muitos casos isso facilitem a leitura.

    Link e @import:

    A tag link e o @import são duas formas distintas que tem o mesmo objetivo: carregar um estilo css para uma ou mais páginas de um site.
    Esses dois métodos, embora tenham a mesma finalidade, não têm as mesmas vantagens.
    Link: A tag link do HTML vai dentro da tag <head> e é melhor interpretada pelos browsers e isso gera maior um desempenho.

    Exemplo de sintaxe:
    <head>
    <link rel=”stylesheet” type=”text/css” a href=”estilo.css”>
    </head>

    @import: Diferente do link, é um código CSS e deve ser colocado entre as tags <style> que vão dentro do <head> do seu documento HTML, dessa forma, o CSS é inserido de forma embutida, embora esteja em um arquivo externo, para cada página é necessário criar um @import.

    Exemplo de sintaxe:
    <head>
    <style>
                @import url(estilo.css);
    </style>
    </head>

    Fonte de pesquisa: http://www.tableless.com.br

    Postado por Unknown às 19:29 | Marcadores: , | 0 comentários | |