STANDARDY KODOWANIA MAILINGÓW
|
|
|
- Karolina Mazur
- 8 lat temu
- Przeglądów:
Transkrypt
1 STANDARDY KODOWANIA MAILINGÓW
2 Tabela zawartości: I. Dlaczego standardy kodowania mailingów są istotne? II. Budowa nagłówka wiadomości. III. Style kaskadowe CSS. IV. Elementarna budowa szablonu. V. Podsumowanie. 2 I. Dlaczego standardy kodowania mailingów są istotne? Wraz z niepohamowanym rozwojem branży internetowej stale wzrasta konkurencja wśród producentów przeglądarek internatowych, klientów pocztowych jak również stale wyłaniających się serwisów pocztowych. Niestety pomimo rozwiniętej literatury przedmiotu nie wszystkie produkty obecne na rynku, zostały wyposażone w odpowiednio skonfigurowany interpreter poleceo kodu HTML, XHTML oraz CSS. Dyskusja na temat standardów sieciowych jest jedna z najczęściej przywoływanych w świecie biznesu internetowego. W jaki sposób standardy sieciowe wpływają na klientów branży wirtualnej? Przede wszystkim odpowiednio przestrzegane, umożliwiają redukcję kosztów związanych z trafnością i jakością dostarczanych informacji, z drugiej strony udostępniają użytkownikom większą swobodę w projektowaniu i budowaniu własnego wizerunku. FreshMail jest firmą dla której najważniejszymi celem jest funkcjonalnośd na najwyższym poziomie, oparta o kontakt z klientem w ramach wszystkich kanałów komunikacji, dlatego też prezentujemy Paostwu specyfikację będącą swoistym, praktycznym przygotowaniem do samodzielnego budowania szablonów mailingowych w oparciu o standardy sieciowe. 3 II. Budowa nagłówka wiadomości Poprawny kod nagłówka wiadomości: <!-- Element DOCTYPE jest przeważnie konwertowany przez większość klientów pocztowych, w związku z tym może być pominięty--> <html> <head> <!-- Definicja arkuszy stylowych--> <style type = text/css > a { <!-- Właściwości--> } body{ <!-- Właściwości--> } <!-- ETC--> </style> KOMENTARZ: definicja styli CSS pomiędzy znacznikami <HEAD> sprawia, że zostają one pomijane w niektórych aplikacjach takich jak Gmail, Hotmail czy też Interia.pl. Metoda odradzana. </head> III. Style kaskadowe CSS Atrybuty CSS, umożliwiają strukturalne wystylizowanie przygotowywanego mailingu. Dla poprawnego ich zaimplementowania doradza się stosowania tzw. style inline, oznaczającej definiowanie poszczególnych znaczników kodu HTML, XHTML za pomocą własności CSS w znaczniku body dokumentu.
3 Przykład poprawnego użycia: <td style="font-family:tahoma, Arial, Helvetica, sans-serif; font-size: 14px"> 4 IV. Budowa sekcji głównej szablonu Szablon mailingu powinien składad się z czterech podstawowych elementów: element pozycjonujący (wrapper) nagłówek (header) główna zawartość dokumentu (main body) stopka (footer) Kod dokumentu powinien byd oparty na tabelarycznej strukturze (table, tr, td). Dla poniższego przykładu stosujemy następujące właściwości: a. mailing jest wyśrodkowany w stosunku do obszaru okna b. szerokość dokumentu wynosi 610px Element pozycjonujący (wrapper): <html> <body> <!-- WRAPPER TABELA POZYCJONUJACA DOKUMENT--> <table width="610" border="0" align="center" cellpadding="0" cellspacing="0"> <td> <!-- HEADER (nagłówek) --> <!-- MAIN BODY (główna zawartość dokumentu) --> <!-- EOF MAIN BODY (koniec zawartości głównej dokumentu) --> </body> </html> 5 Nagłówek (header): <!-- HEADER (początek nagłówka) --> <!-- w tym przykładzie stosujemy tabelę dla nagłówka wypełnioną jednym elementem graficznym (układ jednokolumnowy)--> <img style= display:block src="link do elementu graficznego" alt="alt" width="610" height="40" border="0"> <!-- EOF HEADER (koniec nagłówka) --> KOMENTARZ: własność display:block dla atrybutu img zabezpiecza przed problemem pustych obszarów podczas umieszczania elementów graficznych wewnątrz tabeli. Główna część dokumentu (main body):!-- MAIN BODY CONTENT (zawartość główna dokumentu) --> <table width="610" border="0" cellpadding="0" cellspacing="0" bgcolor="#ffffff"> <td style="font-family:tahoma, Verdana, sans-serif; font-size: 11px" valign="top"> <!-- COLUMNS (kolumny) --> <table border="0" cellpadding="0" cellspacing="0" width="610"> <!-- LEFT COLUMN (lewa kolumna) --> <td valign="top" align="left" width="305" style="font-family:tahoma, Verdana, sans-serif; font-size:11px; > <!-- wypełnienie kolumny lewej-->
4 <!-- EOF LEFT COLUMN (koniec lewej kolumny) --> <!-- RIGHT COLUMN (prawa kolumna) --> <td valign="top" align="left" width="305" style="font-family:tahoma, Verdana, sans-serif; font-size:11px;"> <!-- wypełnienie kolumny prawej --> <!-- EOF RIGHT COLUMN (koniec prawej kolumny) --> <!-- EOF COLUMNS (koniec tabeli zawierającej kolumny) --> <!-- EOF MAIN BODY CONTENT (koniec zawartości głównej dokumentu) --> 6 Stopka (footer): <p style= font-size:10px > <resignlink> Link rezygnacji </resignlink> </p> <!-- EOF FOOTER (stopka) --> 7 PRZYKŁADOWY POPRAWNY KOD: <html> <body> <!-- WRAPPER TABELA POZYCJONUJACA DOKUMENT--> <table width="610" border="0" align="center" cellpadding="0" cellspacing="0"> <td> <!-- HEADER (początek nagłówka) --> <!-- w tym przykładzie stosujemy tabelę dla nagłówka wypełnioną jednym elementem graficznym (układ jednokolumnowy)--> <img style= display:block src="link do elementu graficznego" alt="alt" width="610" height="40" border="0"> <!-- EOF HEADER (koniec nagłówka) -->!-- MAIN BODY CONTENT (zawartość główna dokumentu) --> <table width="610" border="0" cellpadding="0" cellspacing="0" bgcolor="#ffffff"> <td style="font-family:tahoma, Verdana, sans-serif; font-size: 11px" valign="top"> <!-- COLUMNS (kolumny) --> <table border="0" cellpadding="0" cellspacing="0" width="610"> <!-- LEFT COLUMN (lewa kolumna) --> <td valign="top" align="left" width="305" style="font-family:tahoma, Verdana, sans-serif; font-size:11px; > <!-- wypełnienie kolumny lewej--> <!-- EOF LEFT COLUMN (koniec lewej kolumny) --> <!-- RIGHT COLUMN (prawa kolumna) --> <td valign="top" align="left" width="305" style="font-family:tahoma, Verdana, sans-serif; font-size:11px;"> <!-- wypełnienie kolumny prawej --> <!-- EOF RIGHT COLUMN (koniec prawej kolumny) --> <!-- EOF COLUMNS (koniec tabeli zawierającej kolumny) --> <p style= font-size:10px > <resignlink> Link rezygnacji </resignlink>
5 </p> <!-- EOF FOOTER (stopka) --> <!-- EOF MAIN BODY CONTENT (koniec zawartości głównej dokumentu) --> </body> </html> 8 V. Podsumowanie 1. Kodujemy w standardzie ISO (tzw. Latin-2). Pozostałe kodowania Windows-1250 oraz UTF 8 są zdecydowanie bardziej problematyczne, dlatego zalecamy korzystanie z tego pierwszego. 2. Przygotowany szablon powinien w całości opierad się na formie tabelarycznej odpowiednio sformatowanej przy pomocy stylów CSS. 3. Szerokośd maila, którą rekomendujemy to ok. 600 px. Zazwyczaj, możemy polecid przedział pomiędzy 500 a 600 pikseli. Większe kreacje u użytkowników, którzy korzystają z ekranów o mniejszej rozdzielczości, mogą wymagad przewijania w poziomie, a jak wiadomo jest to niezgodne z utartymi zasadami użyteczności i projektowania. 4. Konieczne, przy załączaniu w u elementów graficznych, jest stosowanie tagu alt, z odpowiednio przygotowaną treścią, przekonywującą do pobrania grafiki, gdy jest ona automatycznie blokowana (np. Pobierz grafikę i zobacz co przygotowaliśmy dla Ciebie ). Do każdego obrazka dodajemy border="0" i display:block. 5. Najlepiej stosowad czcionki Verdana, Tahoma, Arial lub Times New Roman z określeniem ich wielkości. 6. Zalecamy też aby nie używad atrybutu <style> w sekcji HEAD. 7. Grafiki umieszczane w tle (table>td> lub tr>) mogą byd niepoprawnie wyświetlane w niektórych programach pocztowych. Dlatego też zalecamy użycie atrybutu bgcolor. 8. Wiadomośd powinna posiadad link rezygnacji. Żeby go wstawid wystarczy aby w stopce dokumentu zamieścid link poprzez znacznik $$resignlink$$ lub zapisując dowolny tekst pomiędzy znacznikami <resignlink> i </resignlink>. 9. Wszelkie bloki dokumentu zawierające kod powiązany z językiem Javascript lub Flash są przeważnie pomijane przez większośd popularnych programów pocztowych. 10. Import własnego szablonu do systemu FreshMail polega na spakowaniu plików dokumentu w formacie ZIP. Struktura takiego katalogu po rozpakowaniu powinna zawierad plik główny z rozszerzeniem.html, oraz pliki graficzne w dowolnym formacie wskazanym w dokumencie. 11. Wiadomośd nie powinna mied więcej niż 100 kb aby nie zapychad skrzynek Twoich klientów :-) 12. Zamiast <p> lepiej użyd znacznika <span>. Sprawia mniej problemów.
6 13. Paddingi nie zadziałają. Wszelkie przestrzenie uzyskujemy tylko poprzesz zakodowanie pustych komórek tabel o określonych szerokościach. 14. Wszystkie szerokości tabel i komórek w nich zawartych muszą zgadzad się co do piksela i muszą byd określone (chodby HTML-owo). 15. Im więcej w newsletterze tekstu, tym lepiej. Obrazki nie zawsze otwierają się domyślnie. Czasami trzeba kliknąd "Pobierz obrazki", żeby je zobaczyd. Tekst widzimy od razu. Dlatego mailing, który powstał w oparciu tylko o obrazki to nie jest dobry pomysł. Ponadto, zbyt duże obrazki (rozmiarowo/wagowo) najprawdopodobniej spowodują, że newsletter wpadnie w spam. Jeżeli taka sytuacja się zdarzy, trzeba je pociąd na mniejsze. 16. Atrybut line-height jest bardzo trudny do kontrolowania. W każdym kliencie pocztowym interpretowany jest nieco inaczej. Dlatego nie zaleca się projektowania kreacji newsletterów, w których występują boksy otoczone borderem z zaokrąglonymi rogami. Tych ostatnich nie da się bowiem skodowad czystym HTML-em, czy CSS-em. Wstawianie borderów, jako grafiki jest z kolei bardzo ryzykownym przedsięwzięciem. * Wszelkie informacje dotyczące problemów, spostrzeżeo związanych z kodowaniem i przygotowywaniem szablonów mailingowych prosimy wysyład na nowo uruchomiony adres css@freshmail.pl 9
I. Dlaczego standardy kodowania mailingów są istotne?
1 Tabela zawartości: I. Dlaczego standardy kodowania mailingów są istotne? 3 II. Budowa nagłówka wiadomości. 4 III. Style kaskadowe CSS. 4 IV. Elementarna budowa szablonu. 6 V. Podsumowanie. 9 2 I. Dlaczego
Jak zaprojektować skuteczny mailing. Poradnik i specyfikacja.
Jak zaprojektować skuteczny mailing. Poradnik i specyfikacja. SPIS TREŚCI 1. Wprowadzenie:... 2 2. Tytuł i nazwa nadawcy:... 2 3. E-mail nadawcy i e-mail zwrotny... 3 4. Zasady projektowania skutecznych
Specyfikacja techniczna dot. mailingów HTML
Specyfikacja techniczna dot. mailingów HTML Informacje wstępne Wszystkie składniki mailingu (pliki graficzne, teksty, pliki HTML) muszą być przekazane do melog.com dwa dni albo maksymalnie dzień wcześniej
Mailingi HTML. Specyfikacja techniczna
Mailingi HTML Specyfikacja techniczna Informacje wstępne Grupa Morizon S.A. zastrzega sobie prawo do odmowy emisji materiałów reklamowych bez podania przyczyny, w szczególności gdy ich jakość techniczna
Tabele. Przykład 15a.htm. <HTML><HEAD><TITLE> Cennik</TITLE></HEAD><BODY><H3>Cennik</H3> <TABLE BORDER="1"> <TR>
Tabele Autorem niniejszego skryptu jest dr inż. Robert Kolud Tabele w HTML to nie tylko praktyczny sposób na przedstawianie zestawień informacji. Znacznie częściej jednak tabele są wygodnym narzędziem
Specyfikacja mailingu GG Network
Specyfikacja mailingu GG Network Styczeń 2012 2 Mailing założenia ogólne Do wysłanego mailingu konieczne jest dostarczenie: kreacji typu HTML (do 30 kb); tematu mailingu; nadawcy mailingu; danych reklamodawcy
Odsyłacze. Style nagłówkowe
Odsyłacze ... polecenie odsyłcza do dokumentu wskazywanego przez url. Dodatkowym parametrem jest opcja TARGET="...", która wskazuje na miejsce otwarcia wskazywanego dokumentu, a jej parametrami
Tworzenie stron internetowych w kodzie HTML Cz 5
Tworzenie stron internetowych w kodzie HTML Cz 5 5. Tabele 5.1. Struktura tabeli 5.1.1 Odcięcia Microsoft Internet Explorer 7.0 niepoprawnie interpretuje białe znaki w komórkach tabeli w przypadku tworzenia
Danuta ROZPŁOCH-NOWAKOWSKA Strona 1 2007-11-06. Moduł 4. Przykład 1. Przykład 2. HTML 4.01 Transitional).
Danuta ROZPŁOCH-NOWAKOWSKA Strona 1 2007-11-06 Moduł 4. Style Zajęcia poświęcone będą kaskadowym arkuszom stylów (por. slajdy 18.-27. z wykładu 2.) Wiele uwagi poświęcaliśmy do tej pory planowaniu szkieletu
2 Podstawy tworzenia stron internetowych
2 Podstawy tworzenia stron internetowych 2.1. HTML5 i struktura dokumentu Podstawą działania wszystkich stron internetowych jest język HTML (Hypertext Markup Language) hipertekstowy język znaczników. Dokument
HTML (HyperText Markup Language) hipertekstowy język znaczników
HTML (HyperText Markup Language) hipertekstowy język znaczników Struktura dokumentu tytuł strony
Zawartość specyfikacji:
Zawartość specyfikacji: Wielkość, waga i kodowanie Umieszczanie obrazków w kreacji Elementy niedopuszczalne Nazewnictwo plików Stopka mailingu Nie spełniam wymagań pracodawcy Waga, wielkość i kodowanie
Laboratorium 1: Szablon strony w HTML5
Laboratorium 1: Szablon strony w HTML5 Czas realizacji: 2 godziny Kurs: WYK01_HTML.pdf, WYK02_CSS.pdf Pliki:, Edytor: http://www.sublimetext.com/ stabilna wersja 2 (portable) Ćwiczenie 1. Szablon strony
za pomocą: definiujemy:
HTML CSS za pomocą: języka HTML arkusza CSS definiujemy: szkielet strony wygląd strony Struktura dokumentu html - znaczniki Znaczniki wyznaczają rodzaj zawartości. element strony
Young Programmer: HTML+PHP. Dr inż. Małgorzata Janik, Zajęcia #2
Young Programmer: HTML+PHP Dr inż. Małgorzata Janik, Zajęcia #2 Ramowy program warsztatów Zajęcia 1: Zajęcia wprowadzające, HTML Zajęcia 2: Style CSS (tabele i kaskadowe arkusze stylów) Zajęcia 3: Podstawy
Oczywiście występują także znaczniki, bez ich odpowiednika kończącego, np. <BR>
Język html to język znaczników inaczej tagów, czyli słów lub skrótów pochodzących z języka angielskiego ujętych w nawiasy ostrokątne , np.. . W większości przypadków spotykamy znaczniki początku (inaczej
Specyfikacja techniczna produktów reklamowych portali Grupy Cogito Sp. z o.o.
Specyfikacja techniczna produktów reklamowych portali Grupy Cogito Sp. z o.o. Produkt reklamowy Format Rozmiar waga Billboard jpg/png/gif/swf(flash) 1000x100px 50kB Duble Billboard jpg/png/gif/swf(flash)
Marketing Internetowy (cz. 13) - marketing cz. II
Marketing Internetowy (cz. 13) - E-mail marketing cz. II E-mail marketing jak przygotować poprawny mailing w HTML? Przed przystąpieniem do stworzenia profesjonalnej kampanii e-mail marketingowej należy
[ HTML ] Tabele. 1. Tabela, wiersze i kolumny
![[ HTML ] Tabele. 1. Tabela, wiersze i kolumny](/thumbs/70/62541125.jpg "[ HTML ] Tabele. 1. Tabela, wiersze i kolumny")
[ HTML ] Tabele 1. Tabela, wiersze i kolumny Opis tabeli znajdowad się powinien wewnątrz znaczników . W ich ramach umieszczone są definicje rzędów, komórek w rzędach oraz dane w komórkach.
Technologia CSS w aplikacjach pocztowych
Technologia CSS w aplikacjach pocztowych Wytyczne dla projektantów newsletterów Raport FreshMail Maj 2010 Spis treści Wstęp 03 Metodologia badao 04 Wyniki badao 07 21 praktycznych rad dla Front End Developerów
Specyfikacja standardów technicznych
SPECYFIKACJĘ DOSTOSOWANĄ DO PAŃSTWA POTRZEB DOSTARCZA Specyfikacja standardów technicznych E- mailing Video e- mailing Real- time e- mailing Video Landing Page Wersja z dn. 11.03.2016 r. Spis treści 1.
Programowanie WEB PODSTAWY HTML
Programowanie WEB PODSTAWY HTML Najprostsza strona HTML tytuł strony To jest moja pierwsza strona WWW. tytuł strony
HTML (HyperText Markup Language)
HTML (HyperText Markup Language) Struktura dokumentu tytuł strony sekcja nagłówka Tutaj wpisujemy
Dokument hipertekstowy
Dokument hipertekstowy Laboratorium 5 Box model i layouty mgr inż. Krzysztof Wróbel Katedra Lingwistyki Komputerowej Wysokość i szerokość domyślna szerokość elementu inline jest związana z jego zawartością
Zdefiniowane style mogą określać układ treści na stronie i sposób jej formatowania np. kolor czcionki, pogrubienia, tło tabel, rysunków itp.
Style CSS Wstęp Zdefiniowane style mogą określać układ treści na stronie i sposób jej formatowania np. kolor czcionki, pogrubienia, tło tabel, rysunków itp. Podstawową zaletą i zadaniem stylów jest oddzielenie
używane skróty: HTTP - protokół do transferu tekstu, hipertekstu, zbiorów binarnych URL - jednolity lokalizator zasobów
opracowanie I. K. używane skróty: HTTP - protokół do transferu tekstu, hipertekstu, zbiorów binarnych URL - jednolity lokalizator zasobów ISO-8859-2 - norma międzynarodowa określająca sposób kodowania
ABC języka HTML i XHTML / Maria Sokół. wyd. 2. Gliwice, cop Spis treści
ABC języka HTML i XHTML / Maria Sokół. wyd. 2. Gliwice, cop. 2012 Spis treści Wstęp 9 1 HTML 5 i XHTML w pytaniach i odpowiedziach 13 Co to jest HTML 5? 13 Co to jest XHTML? 15 Czy strony utworzone w HTML
HTML podstawowe polecenia Szkielet dokumentu: Proste kody html do szybkiego stosowania.
Proste kody html do szybkiego stosowania. Często, w trakcie pracy z blogiem czy portalem zachodzi potrzeba umieszczenia grafiki, linku zaszytego w grafice czy innych podobnych. Szczególnie w widgetach
Podstawowe znaczniki języka HTML.
Podstawowe znaczniki języka HTML. Struktura dokumentu. Sposób użycia i dokumentu. Między nimi umieszczana jest cała treść dokumentu. Sposób użycia Sekcja HEAD zawiera podstawowe
Specyfikacja techniczna produktów reklamowych serwisów Trader.com (Polska)
Specyfikacja techniczna produktów reklamowych serwisów Trader.com (Polska) Trader.com (Polska) Sp. z o.o. 00-732 Warszawa, Czerska 8/10, tel. (0-22) 455 33 00, faks (0-22) 455 33 01, NIP 522-010-28-53
Wprowadzenie do języka HTML
Radosław Rudnicki (joix@mat.umk.pl) 05.09.2009 r. Wprowadzenie do języka HTML Do tworzenia stron internetowych wystarczy użyd zwykłego Notatnika oferowanego przez system Windows, czy dowolny inny system
www.fwrl.pl/szkolenie
STRONA www.fwrl.pl/szkolenie MS WORD HTML HTML i dostarczają informację dla silnika przeglądarki o tym jak ma być zbudowana i wyświetlona strona HTML HTML HTML (warstwa logiczna co i gdzie ma być) (wastwa
Krótki przegląd własności języka CSS
Krótki przegląd własności języka CSS Stosując arkusze stylów CSS, w sposób wyraźny oddziela się formatowanie dokumentu XHTML od jego warstwy znaczeniowej umieszczonej w sekcji . Niżej zestawiono
Nazwa implementacji: CSS i box model. Autor: Opis implementacji: Poznajemy podstawy CSS oraz dowiadujemy się o rozmieszczaniu elementów na stronie.
Nazwa implementacji: CSS i box model Autor: Opis implementacji: Poznajemy podstawy CSS oraz dowiadujemy się o rozmieszczaniu elementów na stronie. Wprowadzenie CSS (kaskadowe arkusze stylów, ang. Cascading
Tworzenie stron internetowych w oparciu o język HTML
Ćwiczenie 1 Temat: Tworzenie stron internetowych w oparciu o język HTML Cel ćwiczenia: Celem ćwiczenia jest zapoznanie studenta z technologią tworzenia stron internetowych z wykorzystaniem języka HTML.
I. Formatowanie tekstu i wygląd strony
I. Formatowanie tekstu i wygląd strony Akapit: ... aby wyrównać tekst do lewego marginesu aby wyrównać tekst do prawego marginesu:
PROGRAMOWANIE. WNPiD UAM, Programowanie, inż. Piotr Jabłoński
PROGRAMOWANIE KASKADOWE ARKUSZE STYLÓW CASCADING STYLE SHEETS Za pomocą HTML tworzymy strukturę dokumentu, jego elementy oraz treść CSS służy do opisu wyglądu struktury dokumentu, elementów oraz treści
PROGRAMOWANIE. WNPiD UAM, Programowanie, inż. Piotr Jabłoński
PROGRAMOWANIE HTML W składni języka HTML wykorzystuje się charakterystyczne znaczniki. Każdy z nich zaczyna się i kończy ostrokątnym nawiasem a pomiędzy nimi znajduje się wyrażenie html. Rozróżniamy znaczniki
HTML5 Nowe znaczniki header nav article section aside footer
Specyfikacja HTML5 wprowadza nowe znaczniki pozwalające w łatwy i intuicyjny sposób budować szkielet strony, który przez zmniejszenie ilości kodu jest czytelniejszy i łatwiejszy w utrzymaniu, pozwala poza
Dostępne nośniki reklamowe
Dostępne nośniki reklamowe Nazwa Wymiar (px) Waga Format Billboard 750x100 40 kb gif, jpg, swf Doublebillboard 750x200 40 kb gif, jpg, swf Widebillboard 950x200 50 kb gif, jpg, swf Skyscraper 120x600 40
Ćwiczenie 9 - CSS i wstawianie CSS
Ćwiczenie 9 - CSS i wstawianie CSS Wprowadzenie: Od tego ćwiczenia zajmować się będziemy CSS czyli Kaskadowymi Arkuszami Stylów (Cascading Style Sheets). CSS stanowią uzupełnienie dla HTML-a. HTML odpowiada
Często używanym elementem języka HTML są tabele, które wykorzystuje się do wygodnego rozmieszczania informacji i obrazów.
Tabele Często używanym elementem języka HTML są tabele, które wykorzystuje się do wygodnego rozmieszczania informacji i obrazów. Ramy tabeli Ramy tabeli tworzone są za pomocą polecenia: Cała zawartość
Witryny i aplikacje internetowe
Test z przedmiotu Witryny i aplikacje internetowe Zadanie 1 Kod języka HTML przedstawi tabelę składającą się z dwóch
MAILING REKLAMOWY DO BAZY UŻYTKOWNIKÓW INTERAKTYWNIE.COM. Oferta reklamowa www.interaktywnie.com/reklama
MAILING REKLAMOWY DO BAZY UŻYTKOWNIKÓW INTERAKTYWNIE.COM www.interaktywnie.com/reklama Profil użytkownika Interaktywnie.com Zawód/branża: dział marketingu portal/wydawca internetowy agencja interaktywna
Widżety KIWIPortal. tworzenie umieszczanie na stronach internetowych opcje zaawansowane. Autor: Damian Rebuś Data: 29.06.2015 Wersja: 1.
Widżety KIWIPortal tworzenie umieszczanie na stronach internetowych opcje zaawansowane Autor: Damian Rebuś Data: 29.06.2015 Wersja: 1.3 Strona 1 z 17 1 SPIS TREŚCI 2 Metody osadzania widżetów... 3 2.1
Dzięki arkuszom zewnętrznym uzyskujemy centralne sterowanie wyglądem serwisu. Zewnętrzny arkusz stylów to plik tekstowy z rozszerzeniem css.
Kaskadowe arkusze stylów CSS Geneza - oddzielenie struktury dokumentu HTML od reguł prezentacji - poszerzenie samego HTML Korzyści - przejrzystość dokumentów - łatwe zarządzanie stylem (wyglądem) serwisu
Specyfikacja Techniczna Produktów Reklamowych esky.pl
Specyfikacja Techniczna Produktów Reklamowych esky.pl (wersja I: ) esky.pl Strona 1 z 13 Zawartość 1. Ogólne zasady tworzenia kreacji reklamowych... 3 1.1. Zasady ogólne... 3 1.2. Zasady ogólne dla poszczególnych
Pierwsza strona internetowa
HTML i CSS Pierwsza strona internetowa Rozpoczynając pracę na swoim komputerze powinieneś posiadać: dowolny edytor tekstowy (np. Notatnik), dostęp do Internetu, Microsoft Visual Studio. Podstawy formatowania
HTML5 i CSS. Deklaracja <!DOCTYPE> musi być na początki dokumentu napisanego w HTML5 przed tagiem <html>.
Dokumenty HTML5 Każda przeglądarka dostępna na rynku obsługuje HTML5 w różnym stopniu. Możesz sprawdzić swoją testerem dostępnym pod adresem (http://html5test.com). HTML5 wprowadza cały zestaw zupełnie
GRID LAYOUT. Waldemar Korłub. Aplikacje i Usługi Internetowe KASK ETI Politechnika Gdańska
GRID LAYOUT Waldemar Korłub Aplikacje i Usługi Internetowe KASK ETI Politechnika Gdańska Pozycjonowanie elementów na stronie 2 Atrybuty position/float Rozwiązania z czasów przed rewolucją mobilną FlexBox
Przy wstawianiu znacznika zamykającego nie przepisujemy już atrybutów.
JĘZYK - HTML Hipertekst - możliwośd przechodzenia między różnymi fragmentami tego samego lub różnych dokumentów, które zostały ze sobą powiązane. Jest systemem odnośników (tzw. Skrótów), działających na
Elementarz HTML i CSS
Elementarz HTML i CSS Znaczniki przydatne w pracy redaktora stron internetowych 1 Elementarz HTML i CSS Znaczniki przydatne w pracy redaktora stron internetowych Treść, korekta, skład i oprawa graficzna
HTML kurs podstawowy. nagłówek, linia pozioma, obraz, img, ramka, div, tabela, tabel, lista
HTML kurs podstawowy Wykład: język znaczników, atrybuty, XML, XHTML, rodzaje znaczników, wybór edytora, struktura dokumentu, head, title, body, kodowanie, utf-8, iso-8859-2, meta, link, akapit, font, color,
Wykład 2 TINT. XHTML tabele i ramki. Zofia Kruczkiewicz
Wykład 2 TINT XHTML tabele i ramki Zofia Kruczkiewicz 1. Tabele 1.1. Przykład tabeli zawierającej kalendarz na miesiąc marzec ... definiuje tabelę Atrybuty: border ="" obramowanie tabeli,
Tabela z komórkami nagłówkowymi (wyróżnionymi)
Tabela z komórkami nagłówkowymi (wyróżnionymi) Nagłówek poziomy ... ... Nagłówek pionowy ... ... Tytuł tabeli tytuł tabeli... gdzie
Kaskadowe arkusze stylów (CSS)
Kaskadowe arkusze stylów (CSS) CSS (Cascading Style Sheets) jest to język opisujący sposób, w jaki przeglądarki mają wyświetlać zawartość odpowiednich elementów HTML. Kaskadowe arkusze stylów służą do
Specyfikacja techniczna produktów reklamowych serwisów Trader.com (Polska)
Specyfikacja techniczna produktów reklamowych serwisów Trader.com (Polska) Trader.com (Polska) Sp. z o.o. 00-732 Warszawa, Czerska 8/10, tel. 22 455 33 00, faks 22 455 33 01, NIP 522-010-28-53 Utworzono:
Układy witryn internetowych
1. CEL ĆWICZENIA Celem ćwiczenia jest zapoznanie się z możliwościami kaskadowych arkuszy stylów CSS w zakresie kontrolowania położenia elementów na stronie. 2. MATERIAŁ NAUCZANIA W normalnym układzie opartym
STRONY INTERNETOWE mgr inż. Adrian Zapała
1 STRONY INTERNETOWE mgr inż. Adrian Zapała STRONY INTERNETOWE Rodzaje stron internetowych statyczne (statyczny HTML + CSS) dynamiczne (PHP, ASP, technologie Flash) 2 JĘZYKI STRON WWW HTML (ang. HyperText
Podstawy HTML i styli CSS. selektor {właściwość1: wartość1; właściwość2: wartość2}
Kaskadowe arkusze stylów (CSS) W trakcie projektowania własnego serwisu w języku HTML napotkamy problem z określeniem precyzyjnego pozycjonowania tekstu i grafiki oraz elastycznym formatowaniem tekstu.
29. Poprawność składniowa i strukturalna dokumentu XML
29. i strukturalna dokumentu XML 13 października 2015 1 2 Poprawny składniowo dokument XML powinien być tworzony zgodnie z poniżej przedstawionymi zasadami. Deklaracja XML Powinien zawierać deklarację
Rysunek otaczany przez tekst
Tekst i obrazy 1 Rysunek otaczany przez tekst Wprowadzanie obiektu graficznego Rozmiar ramki: width= 200 deklaruje się tylko
przygotował: mgr Szymon Szewczyk PODSTAWY
S t r o n a 1 PODSTAWY Każdy dokument musi być w całości zawarty między znacznikami - i (większość znaczników musi być odwołana ). Dokument HTML a składa się z dwóch części: - głowy
Tworzenie Stron Internetowych. odcinek 6
Tworzenie Stron Internetowych odcinek 6 CSS kaskadowe arkusze stylów CSS (Cascading Style Sheets), czyli Kaskadowe Arkusze Stylów "stylów" "arkusze" Reguły opisujące wygląd dokumentu opisanego za pomocą
OPIS FORM REKLAMOWYCH
OPIS FORM REKLAMOWYCH : KATARZYNA PIĄTEK 600-25-33-25 REKLAMA@DDWLOCLAWEK.PL OPIS ZAWARTOŚCI 1. BILLBOARD 2. BILLBOARD PODSTRONA 3. BILLBOARD ROZWIJANY 4. BILLBOARD PŁYWAJĄCY 5. PODWÓJNY BILLBOARD 6. BANNER
Wykład 2 Tabele i ramki 1. Tabele 1.1. Podstawy budowy tabel na stronach WWW
Wykład 2 Tabele i ramki 1. Tabele 1.1. Podstawy budowy tabel na stronach WWW Rys.1. Przykład prostej tabeli zawierającej kalendarz na miesiąc marzec ... definiuje tabelę Atrybuty: border
Języki programowania wysokiego poziomu. HTML cz.2.
Języki programowania wysokiego poziomu HTML cz.2. Model pudełkowy HTML Elementy blokowe w tym table oraz div są wyświetlane według tzw. modelu pudełkowego: Zawartość Odstęp (padding) Obramowanie (border)
I. Wstawianie rysunków
I. Wstawianie rysunków Wstawiane rysunku Bez parametrów: Tekst alternatywny Tytuł obrazka
Krok 1: Stylizowanie plakatu
HTML & CSS 1 Wanted! Każdy Klub Kodowania musi być zarejestrowany. Zarejestrowane kluby można zobaczyć na mapie na stronie codeclubworld.org - jeżeli nie ma tam twojego klubu sprawdź na stronie jumpto.cc/18cplpy
AUDYT DOSTĘPNOŚCI STRONY INTERNETOWEJ
Poznań, 2012-10-04 AUDYT DOSTĘPNOŚCI STRONY INTERNETOWEJ NAZWA ADRES STRONY ILOŚĆ BŁĘDÓW WCAG 33 ILOŚĆ OSTRZEŻEŃ WCAG 3 TYP DOKUMENTU UŻYTY FORMAT (X)HTML JĘZYK OWANIE STRONY Urząd Marszałkowski Województwa
Format HTML. Wybrane działy Informatyki Stosowanej. Definicja i przeznaczenie Struktura dokumentu Znaczniki Formularze i komponenty
Wybrane działy Informatyki Stosowanej Format HTML Definicja i przeznaczenie Struktura dokumentu Znaczniki Formularze i komponenty dr hab. inż. Andrzej Czerepicki 2019 Definicja HTML HyperText Markup Language
JAK W NAGŁÓWKU STRONY LUB BLOGA
JAK W NAGŁÓWKU STRONY LUB BLOGA WSTAWIĆ FORMULARZ AUTORESPONDERA? - DLA STRON ZAINSTALOWANYCH NA SYSTEMIE WORDPRESS - http://www.michalandrzejczak.pl Copyright 2014 http://www.michalandrzejczak.pl Wszystkie
ECDL/ICDL Web Editing Moduł S6 Sylabus - wersja 2.0
ECDL/ICDL Web Editing Moduł S6 Sylabus - wersja 2.0 Przeznaczenie Sylabusa Dokument ten zawiera szczegółowy Sylabus dla modułu ECDL/ICDL Web Editing. Sylabus opisuje zakres wiedzy i umiejętności, jakie
E.14.1 Tworzenie stron internetowych / Krzysztof T. Czarkowski, Ilona Nowosad. Warszawa, Spis treści
E.14.1 Tworzenie stron internetowych / Krzysztof T. Czarkowski, Ilona Nowosad. Warszawa, 2014 Spis treści Przewodnik po podręczniku 8 Wstęp 10 1. Hipertekstowe języki znaczników 1.1. Elementy i znaczniki
PRÓBNY EGZAMIN POTWIERDZAJĄCY KWALIFIKACJE W ZAWODZIE CZĘŚĆ PRAKTYCZNA
Nazwa kwalifikacji: Tworzenie aplikacji internetowych i baz danych oraz administrowanie bazami Oznaczenie kwalifikacji: E14 Numer zadania: 01 Wypełnia zdający Numer PESEL zadającego Czas trwania egzaminu:
Studia Podyplomowe Grafika komputerowa i Techniki Multimedialne, 2015, semestr II, dr inż. Robert Banasiak Projektowanie Stron WWW.
Ćwiczenie 2 Kaskadowe arkusze stylów CSS. Budowanie makiety strony i jej modyfikacja dr inż. Robert Banasiak 1 Materiały ćwiczeniowe Wszelkie materiały ćwiczeniowe: wykłady, instrukcje oraz pliki ćwiczeniowe
Zastosowanie kaskadowych arkuszy stylów (CSS - Cascading Style Sheets) w technologii JavaServer Faces
Zastosowanie kaskadowych arkuszy stylów (CSS - Cascading Style Sheets) w technologii JavaServer Faces wg http://www.w3.org/tr/css3-selectors/ http://courses.coreservlets.com/course-materials/pdf/jsf/jsf2/jsf2-
Podstawy HTML. 2. Komendy ujęte są w nawiasy ostre - < > i występują najczęściej parami.
Podstawy HTML 1. HTML - to język formatowania dokumentów elektronicznych, który pozwala uformować tekst oraz połączyć go z grafiką. Dokument HTML ma postać pliku tekstowego, gdzie tekst przeplatany jest
Elementy div i style CSS w praktyce
Elementy div i style CSS w praktyce Włodzimierz Gajda 23 listopada 2005 ver. 0.2 Streszczenie Artykuł omawia kulisy tworzenia strony internetowej wyłącznie w oparciu o elementy div oraz kaskadowe arkusze
Deklarowanie tytułu związanej z tabelą
Tabele 1 Deklarowanie tytułu związanej z tabelą Przychody w latach 2007-2010 Położenie pozbawione stylu Treść nagłówka Formatowanie położenia w stylach
EGZAMIN POTWIERDZAJĄCY KWALIFIKACJE W ZAWODZIE Rok 2016 CZĘŚĆ PRAKTYCZNA
Arkusz zawiera informacje prawnie Układ graficzny CKE 2016 chronione do momentu rozpoczęcia egzaminu CENTRALNA KOMISJA EGZAMINACYJNA Nazwa kwalifikacji: Twmzenie aplikacji internetowych i baz danych oraz
Sierpień 2015 rozwiązanie plik: index.htlm
Sierpień 2015 rozwiązanie plik: index.htlm strona główna //ustalamy położenie wyświetlania
LABORATORIUM 2 WSTĘP DO SIECI TELEINFORMATYCZNYCH TABELE I FORMULARZE
LABORATORIUM 2 WSTĘP DO SIECI TELEINFORMATYCZNYCH TABELE I FORMULARZE 1. TABELE 1.1. Definicja tabeli Definicja tabeli musi być umieszczona między znacznikami. W ich ramach umieszczane są definicje rzędów
2. Projektowanie stron WWW podstawowe informacje
1. Uczeń: Uczeń: 2. Projektowanie stron WWW podstawowe informacje a. 1. Cele lekcji i. a) Wiadomości zna podstawowe zasady tworzenia stron internetowych, rozróżnia tryb tekstowy tworzenia stron www od
TWORZENIE STRON WWW. Zasady opisu stron w języku HTML:
TWORZENIE STRON WWW Strony WWW definiowane są za pomocą języków opisu stron. Najpopularniejszym językiem tego typu jest język HTML (Hyper Text Markup Language). Zasady opisu stron w języku HTML: - opis
Przedmiot: Grafika komputerowa i projektowanie stron WWW
KARKONOSKA PAŃSTWOWA SZKOŁA WYŻSZA Kierunek: Dziennikarstwo i komunikacja społeczna Przedmiot: Grafika komputerowa i projektowanie stron WWW 1 opracował: dr inż. Jerzy Januszewicz HTML (HyperText Markup
Wstęp 5 Rozdział 1. Informacje podstawowe 9
Wstęp 5 Rozdział 1. Informacje podstawowe 9 Co to jest internet? 9 Co to jest WWW? 10 Jak komunikują się komputery w internecie? 11 Surfowanie i przeglądarka 12 Jeszcze kilka słów o adresach URL 13 Co
2. Prezentacja wizualna
2. Prezentacja wizualna 2.1. Opis rozdziału Rozdział ten przedstawia jak stworzyć przykładowy układ graficzny dla naszej gry w HTML5 i CSS3, które w dalszej części poradnika zostaną wykorzystane do stworzenia
Aplikacje WWW - laboratorium
Aplikacje WWW - laboratorium Język JavaScript Celem ćwiczenia jest przygotowanie formularza na stronie WWW z wykorzystaniem języka JavaScript. Formularz ten będzie sprawdzany pod względem zawartości przed
Tworzenie Stron Internetowych. odcinek 9
Tworzenie Stron Internetowych odcinek 9 Prosta galeria oparta na HTML Najprostszym sposobem zbudowania galerii zdjęć jest wykorzystanie tylko HTML i CSS. Strona główna galerii składa się miniatur zdjęć,
PRÓBNY EGZAMIN POTWIERDZAJĄCY KWALIFIKACJE W ZAWODZIE CZĘŚĆ PRAKTYCZNA
Nazwa kwalifikacji: Tworzenie aplikacji internetowych i baz danych oraz administrowanie bazami Oznaczenie kwalifikacji: E14 Numer zadania: 01 Wypełnia zdający Numer PESEL zadającego Czas trwania egzaminu:
Specyfikacja techniczna produktów reklamowych serwisów Trader.com (Polska)
Specyfikacja techniczna produktów reklamowych serwisów Trader.com (Polska) Trader.com (Polska) Sp. z o.o. 00-732 Warszawa, Czerska 8/10, tel. 22 455 33 00, faks 22 455 33 01, NIP 522-010-28-53 Utworzono:
Aplikacje WWW - laboratorium
Aplikacje WWW - laboratorium Język JavaScript Celem ćwiczenia jest przygotowanie formularza HTML z wykorzystaniem języka JavaScript. Formularz ten będzie sprawdzany pod względem zawartości przed wysłaniem
Cel ogólny lekcji: Wprowadzenie dodatkowych znaczników. Wprowadzenie odsyłacza, tabeli, listy numerowanej i wypunktowanej.
Piotr Chojnacki IV rok, informatyka chemiczna Liceum Ogólnokształcące Nr I we Wrocławiu Wrocław dn. 26 lutego 2006 roku Czas trwania zajęć: 90 minut, przedmiot: TI Temat lekcji: Tworzenie strony internetowej
Moduł IV Internet Tworzenie stron www
Ze strony internetowej www.kaze.zut.edu.pl z folderu BUDOWA JACHTÓW pobierz i zapisz je do własnego folderu następujące pliki: znak_drogowy.png, morze.jpg, logo_ecdl.gif, logobj.png ZADANIE 1 Podstawy
Podstawy pozycjonowania CSS
Podstawy pozycjonowania CSS Żeby pokazać w jaki sposób przeglądarka rozkłada elementy na stronie posłużę się prostym przykładowym fragmentem kodu html. div id="before"
Zakres treści Czas. 2 Określenie charakteru i tematyki strony. Rodzaje witryn. Projekt graficzny witryny. Opracowanie skryptów
Aplikacje internetowe KL. III Rok szkolny: 011/01 Nr programu: 31[01]/T,SP/MENIS/004.06.14 Okres kształcenia: łącznie ok. 180 godz. lekcyjne Wojciech Borzyszkowski Zenon Kreft Moduł Bok wprowadzający Podstawy
HTML cd. Ramki, tabelki
HTML cd. Ramki, tabelki Ramki Umożliwiają wyświetlanie kilku niezależnych dokumentów w tym samym oknie w układzie pionowym, poziomym lub mieszanym. Wady: kłopotliwe drukowanie, konieczność zapanowania
Czcionki. Rodzina czcionki [font-family]
![Czcionki. Rodzina czcionki [font-family]](/thumbs/27/10053051.jpg "Czcionki. Rodzina czcionki [font-family]")
Czcionki W tej lekcji nauczysz się o czcionkach i jak nimi manipulować przy pomocy CSS. Omówimy także pewien problem, gdzie wybrana czcionka jest przedstawiana na stronie tylko gdy jest ona zainstalowana