H2.cjk { font-family: "Microsoft YaHei"; font-size: 14pt; font-style: italic; font-weight:

Podobne dokumenty
Responsywne strony WWW

Wykład 5_2 Arkusze stylów dziedziczenie. Technologie internetowe Zofia Kruczkiewicz

plansoft.org Zmiany w Plansoft.org

PROGRAMOWANIE. WNPiD UAM, Programowanie, inż. Piotr Jabłoński

Kaskadowość stylów określa pierwszeństwo w oddziaływaniu na te same elementy strony różnych stylów.

XHTML Budowa strony WWW

LABORATORIUM 2 WSTĘP DO SIECI TELEINFORMATYCZNYCH

Wykład 6 Skrypty typu JavaScript. Technologie internetowe Zofia Kruczkiewicz

Powiatowy konkurs recytatorski. Wpisany przez Administrator środa, 4 września Poprawiony środa, 4 września 2013

Young Programmer: HTML+PHP. Dr inż. Małgorzata Janik, Zajęcia #2

używane skróty: HTTP - protokół do transferu tekstu, hipertekstu, zbiorów binarnych URL - jednolity lokalizator zasobów

Komunikacja w XXI wieku. Wpisany przez Ma gorzata Jastrz ska

Tablica zawierająca odniesienia do znajdujących się w dokumencie obiektów typu Anchor.

Technologie Informacyjne

Zastosowanie kaskadowych arkuszy stylów (CSS - Cascading Style Sheets) w technologii JavaServer Faces

Witryny i aplikacje internetowe

CSS - layout strony internetowej

Cel ogólny lekcji: Wprowadzenie do tworzenia stron WWW w języku HTML. Wprowadzenie pojęć: strona WWW, język HTML, dokument HTML.

HTML (HyperText Markup Language)

Podstawy (X)HTML i CSS

Ćw.4 Dokumenty HTML Przy pomocy języka znaczników opisać można strukturę witryny internetowej, postać i wygląd jej elementów.

Przedmiot: Grafika komputerowa i projektowanie stron WWW

Lab.1. Praca z tekstem: stosowanie arkuszy stylów w dokumentach OO oraz HTML/CSS

Norton Sec.3.0 STD PL CARD 1U 1Dvc 1Y Model : Norton Sec.3.0 STD PL CARD 1U 1Dvc 1Y ram sp. j.

Dzięki arkuszom zewnętrznym uzyskujemy centralne sterowanie wyglądem serwisu. Zewnętrzny arkusz stylów to plik tekstowy z rozszerzeniem css.

Referat z przedmiotu Technologie Internetowe SPIS TREŚCI

<!DOCTYPE HTML PUBLIC " //W3C//DTD HTML 4.01 Transitional//EN" "

Znaczniki języka HTML

Podstawy HTML i CSS. Wydział Matematyki, Informatyki i Ekonometrii Uniwersytet Zielonogórski

Mailingi HTML. Specyfikacja techniczna

Hyper Text Markup Language

Projekty z Technologii Informacyjnych

Demo:</span></strong><span style="font-family: Arial; mso-bidi-font-weight: bold;"> przeznaczony do test, mamy mo liwo tworzenia projekt i programowan

Można też ściągnąć np. z:

Zaawansowana Pracownia Komputerowa - Ćwiczenia. Krzysztof Miernik

Można też ściągnąć np. z:

Dokument hipertekstowy

HTML (HyperText Markup Language) hipertekstowy język znaczników

Danuta ROZPŁOCH-NOWAKOWSKA Strona Moduł 4. Przykład 1. Przykład 2. HTML 4.01 Transitional).

<body> <div style="max-width: 900px; margin: 0 auto;">

Wprowadzenie do HTML

SZKOLENIE SANITARNE PRZYGOTOWANIE ZW OK

WITRYNY I APLIKACJE INTERNETOWE

Ćwiczenia laboratoryjne nr 8 Podstawy języka XML.

KASKADOWE ARKUSZE STYLÓW (Cascading Style Sheets)

Przykład integracji kalkulatora mbank RATY na platformie IAI

Wprowadzenie do HTML, CSS, JavaScript, PHP. Kurs

Tworzenie Stron Internetowych. odcinek 6

Artykuł pochodzi z czasopisma PHP Solutions. Do ściągnięcia bezpłatnie ze strony:

13. Konfiguracja proxy http, smtp, pop3, ftp, ssl

Sierpień 2015 rozwiązanie plik: index.htlm

Programowanie internetowe

Język HTML i podstawy CSS

Dostawa szczepionek dla Samodzielnego Publicznego Zak?adu Opieki Zdrowotnej Gminnego O?rodka Zd

APLIKACJE INTERNETOWE 3 CSS - W Y G L Ą D S T R O N Y I N T E R N E T O W E J

Języki programowania wysokiego poziomu. CSS Wskazówki

Bazy Danych i Usługi Sieciowe

Elementarz HTML i CSS

Inwestycja - kompleks dwóch budynków mieszkalnych wielorodzinnych

Cel ogólny lekcji: Wprowadzenie dodatkowych znaczników. Wprowadzenie odsyłacza, tabeli, listy numerowanej i wypunktowanej.

Czcionki. Rodzina czcionki [font-family]

UCHWAŁA NR 129/7/XX/16 RADY MIEJSKIEJ W IŁOWEJ. z dnia 10 marca 2016 r.

STRONA W W W INACZEJ W3 2 KROK

INSTALACJA I KONFIGURACJA SERWERA PHP.

Wykład 1: HTML (XHTML) Michał Drabik

PODSTAWY PROJEKTOWANIA

W ogólności znaczniki mogą również posiadać atrybuty które pozwalają wpływać i manipulować własnościami znaczników lub przenosić dodatkowe informacje:

HTML jak zrobić prostą stronę www

Laboratorium 1 Wprowadzenie do PHP

Projektowanie aplikacji internetowych. CSS w akcji

CSS pozwala przypisać poszczególnym elementom na. grubość, rozmiar czcionki, kolor tła, odległości między

Laboratorium 6 Tworzenie bloga w Zend Framework

Rys.1. Prosty przykład strony www

O stronach www, html itp..

2. Projektowanie stron WWW podstawowe informacje

Wykład 2 TINT. XHTML tabele i ramki. Zofia Kruczkiewicz

Krok 1: Stylizowanie plakatu

Pozycjonowanie i poruszanie warstw

PORADNIK KODOWANIA: CSS

TWORZENIE STRON WWW. Zasady opisu stron w języku HTML:

Programy dedykowane do edycji stron internetowych dzielą się na dwa rodzaje:

Aplikacje internetowe. Interfejs użytkownika

STRONY INTERNETOWE mgr inż. Adrian Zapała

ZAWSEZ PAMIĘTAMY O KOLJENOŚĆI OTWIERANIA I ZAMYKANIA ZNACZNIKÓW

Bazy danych. dr Radosław Matusik. radmat

CSS - style kaskadowe. Cascadind Style Sheets

Kurs HTML 4.01 TI 312[01]

CSS. Gotowe rozwi¹zania

Tworzenie stron internetowych z wykorzystaniem HTML5, JavaScript, CSS3 i jquery. Łukasz Bartczuk

Specyfikacja Specyfikacja strony szkurlat.pl realizowanej przez Visualteam dla...

Tworzenie Stron Internetowych. odcinek 5

Aplikacje WWW - laboratorium

Wykład 2: Kaskadowe arkusze stylów (CSS Cascade Style Sheets)

Drukarka laserowa monochromatyczna Xerox Phaser 3052 V_NI drukowanie sieciowe Wi-Fi / LAN

Kompresja stron internetowych

TECHNIKI WWW (WFAIS.IF-C125) (zajęcia r.)

Tworzenie Stron Internetowych. odcinek 6

HTML. HTML(ang. HyperTextMarkupLanguage, pol. hipertekstowy język znaczników) język wykorzystywany do tworzenia stron internetowych

Budowa aplikacji wielowarstwowych. Zastosowanie Kaskadowych arkuszy stylów (CSS)

Budowa aplikacji wielowarstwowych. Zastosowanie szablonów

Transkrypt:

Kod konspektu wygenerowany przez OpenOffice Writer <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <META HTTP-EQUIV="CONTENT-TYPE" CONTENT="text/html; charset=windows-1250"> <TITLE></TITLE> <META NAME="GENERATOR" CONTENT="OpenOffice 4.1.3 (Win32)"> <META NAME="CREATED" CONTENT="20170907;21543846"> <META NAME="CHANGED" CONTENT="20170913;18132909"> <STYLE TYPE="text/css"> <!-- @page { size: 21cm 29.7cm; margin: 2cm } P { margin-bottom: 0.21cm } H2 { margin-bottom: 0.21cm; page-break-after: avoid } H2.western { font-family: "Arial", sans-serif; font-size: 14pt; font-style: italic; fontweight: bold } H2.cjk { font-family: "Microsoft YaHei"; font-size: 14pt; font-style: italic; font-weight: bold } H2.ctl { font-family: "Lucida Sans"; font-size: 14pt; font-style: italic; font-weight: bold } A:link { color: #000080; so-language: zxx; text-decoration: underline } A:visited { color: #800000; so-language: zxx; text-decoration: underline } --> </STYLE> </HEAD> <BODY LANG="pl-PL" LINK="#000080" VLINK="#800000" DIR="LTR"> <DIV TYPE=HEADER> <P ALIGN=RIGHT STYLE="margin-bottom: 0.5cm"><FONT SIZE=1 STYLE="font-size: 8pt">Konspekt <SPAN STYLE="text-decoration: none"><span STYLE="font-weight: normal">witryny i aplikacje internetowe Edytory WYSIWYG zalety i wady</span></span></font> </DIV> <P ALIGN=CENTER STYLE="margin-bottom: 0cm"><FONT SIZE=5><B>Konspekt</B></FONT> <P ALIGN=CENTER STYLE="margin-bottom: 0cm"><BR>

<P STYLE="margin-bottom: 0cm"> Przedmiot: Witryny i aplikacje internetowe <P STYLE="margin-bottom: 0cm"> Temat: <U><SPAN STYLE="font-weight: normal">edytory WYSIWYG zalety i wady</span></u> <P STYLE="margin-bottom: 0cm"> Czas trwania: 45 minut <P STYLE="margin-bottom: 0cm"><BR> <H2 CLASS="western">Cele lekcji:</h2> <P> Uczeń powinien wiedzieć:<br> co to jest edytor WYSIWYG,<BR> jakie są zalety tych edytorów,<br> jakie są wady tych edytorów. <H2 CLASS="western">Metody lekcji:</h2> <P STYLE="margin-bottom: 0cm"> Elementy wykładu, dyskusja, prezentacja. <H2 CLASS="western">Środki dydaktyczne:</h2> <P> Tablica, komputer podłączony do internetu, projektor, <H2 CLASS="western">Literatura:</H2> <P STYLE="page-break-before: auto"> Wikipedia, Internet. <H2 CLASS="western">Plan lekcji:</h2> <OL> <LI><P STYLE="margin-bottom: 0.11cm">Podanie tematu lekcji i uświadomienie uczniom celu lekcji. <LI><P STYLE="margin-bottom: 0.11cm">Prezentacja najpopularniejszych edytorów WYSIWYG. <LI><P STYLE="margin-bottom: 0.11cm">Opisanie zalet. <LI><P STYLE="margin-bottom: 0.11cm">Opisanie wad. <LI><P STYLE="margin-bottom: 0.11cm">Podsumowanie. <LI><P STYLE="margin-bottom: 0.11cm">Zakończenie lekcji. </OL> <H2 CLASS="western">Przebieg lekcji:</h2> <LI><P STYLE="font-weight: normal; text-decoration: none"><u>przypomnienie</u>: Co to są edytory tekstu. <LI><P STYLE="font-weight: normal; text-decoration: none"><u>pytanie</u>: Czy ktoś umie rozwinąć skrót WYSIWYG (łisyłig)?

Jest to akronim z angielskiego What You See Is What You Get. W tłumaczeniu na polski znaczy to To Co Widzisz To Otrzymasz.</SPAN></SPAN> Znacie jakieś edytory WYSIWYG?</SPAN></SPAN> Chyba najbardziej znanym edytorem tego typu jest program Adobe Dreamwaver. Inne to Microsoft Expression Web, Microsoft Publisher, Google Web Designer. Edytorów WYSIWYG jest ogrom. Listę ponad 30 edytorów można znaleźć na Wikipedia pod adresem https://en.wikipedia.org/wiki/list_of_html_editors.</span></span> A czy edytory WYSIWYG można jeszcze gdzieś znaleźć?</span></span> Tak. Bardzo często takie edytory pojawiają się w różnego rodzaju CMS'ach. W CMS znajdujemy edytory napisane w javascript, które działają w przeglądarce internetowej, na stronie internetowej. Pomagają nam te edytory napisać tekst i sformatować go tak, jak zwykły dokument np. Word'a czy OpenOffice. Chyba najpopularniejszym edytorem WYSIWYG działającym w przeglądarce internetowej jest TinyMCE. Inne edytory działające w tym środowisku to: Redactor, CKEditor.</SPAN></SPAN> Czy użytkownik tego typów edytorów musi znać HTML, CSS czy Javascript?</SPAN></SPAN> Nie. Użytkownik nie musi znać tych technologii. Znajomość HTML i CSS pomaga, ale nie jest wymagana. Wszystkim zajmuje się edytor.</span></span>

<LI><P><SPAN STYLE="text-decoration: none"><span STYLE="font-weight: normal">czy znacie jakieś inne programy do tworzenia </SPAN></SPAN> Jakie według Was są zalety edytorów WYSIWYG?</SPAN></SPAN> </SPAN></SPAN> <LI><P><SPAN STYLE="text-decoration: none"><span STYLE="font-weight: normal">łatwe i lekkie i przyjemne pisanie stron internetowych,</span></span> <LI><P><SPAN STYLE="text-decoration: none"><span STYLE="font-weight: normal">nieznajomość kodowania w HTML nie jest przeszkodą przy pisaniu stron internetowych.</span></span> Jakie według Was są wady tych edytorów?</span></span> </SPAN></SPAN> <LI><P><SPAN STYLE="text-decoration: none"><span STYLE="font-weight: normal">użytkownik nie może czasem edytować wszystkich parametrów elementu,</span></span> <LI><P><SPAN STYLE="text-decoration: none"><span STYLE="font-weight: normal">niektóre edytory generują bardzo zaśmiecony kod,</span></span> <LI><P><SPAN STYLE="text-decoration: none"><span STYLE="font-weight: normal">nie ma gwarancji, że napisana strona będzie taka sama na wszystkich przeglądarkach wyglądać tak samo. Bardzo często ten sam kod HTML jest interpretowany różnie na różnych przeglądarkach,</span></span> <LI><P><SPAN STYLE="text-decoration: none"><span STYLE="font-weight: normal">nieaktualizowane

lub nie rozwijane już edytory WYSIWYG generują kod niezgodny z najnowszymi normami, przez co mogą występować błędy w wyświetlaniu stron przez przeglądarki.</span></span> A czy znacie jakieś inne programy, które pozwalają na wygenerowanie kodu HTML?</SPAN></SPAN> Takim programem jest na przykład MS Word. Jest w nim możliwość wygenerowania kodu HTML. Innym programem jest OpenOffice Writer. W tym programie również jest możliwość wygenerowania kodu HTML.</SPAN></SPAN> <P><SPAN STYLE="text-decoration: none"><span STYLE="font-weight: normal">na następnych stronach będzie pokazany kod HTML tego dokumentu wygenerowany z OpenOffice Writer i MS Word 2010</SPAN></SPAN> <DIV TYPE=FOOTER> <P ALIGN=RIGHT STYLE="margin-top: 0.5cm; margin-bottom: 0cm"><FONT SIZE=2>Strona <SDFIELD TYPE=PAGE SUBTYPE=RANDOM FORMAT=PAGE>1</SDFIELD> / <SDFIELD TYPE=DOCSTAT SUBTYPE=PAGE FORMAT=PAGE>2</SDFIELD></FONT> </DIV> </BODY> </HTML>