Ocena użytkowników: 5 / 5

Gwiazdka aktywnaGwiazdka aktywnaGwiazdka aktywnaGwiazdka aktywnaGwiazdka aktywna
 

Podpisy można przygotować m.in. bezpośrednio w programie Outlook, Word lub zaprojektować atrakcyjną stopkę za pomocą HTML5 w dowolnym edytorze tekstu. Wszystkie czynności opisane poniżej w artykule wykonujemy z okna Preferencje programu Outlook (rys. 1.), aby go otworzyć z menu programu Outlook wybieramy Preferencje… (rys. 2.).

 

Preferencje programu Outlook 2016 MacRys. 1. Preferencje programu Outlook 2016 Mac

 

Uruchamianie okna Preferencje Outlook 2016 Mac Rys. 2. Uruchamianie okna Preferencje Outlook 2016 Mac

 

Zanim dodamy podpis HTML do programu Outlook należy sprawdzić, czy nasz program pocztowy może tworzyć wiadomości HTML (rys. 3.), wyświetlać pliki graficzne (rys. 4.).

 

Tworzenie wiadomości w formacie HTML – Outlook 2016 Mac Rys. 3. Tworzenie wiadomości w formacie HTML – Outlook 2016 Mac

 

Wyświetlanie obrazów z Internetu w email – Outlook 2016 MacRys. 4. Wyświetlanie obrazów z Internetu w email – Outlook 2016 Mac

 

Co warto wiedzieć przy tworzeniu podpisu HTML (Listing 1):

  • Layout najlepiej tworzyć za pomocą tabelki;
  • CSS dodajemy za pomocą atrybutu style w elementach HTML;
  • pamiętamy o zastępczym tekście, jeśli w programie pocztowym klienta pliki graficzne zostaną zablokowane. Atrybut alt elementu img;
  • sprawdzamy, jak wygląda odebrana wiadomość w kilku programach pocztowych (komputery, tablety, telefony).

 

Listing 1. Podpis dla programu Outlook 2016 w formacie HTML5, signature.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Signature Ten adres pocztowy jest chroniony przed spamowaniem. Aby go zobaczyć, konieczne jest włączenie w przeglądarce obsługi JavaScript.</title>
</head>
<body>
<!-- Podpis HTML Outlook 2016 Mac -->
<!-- www.wiedzanaplus.pl -->
<table style="width:100%;">
    <tr>
        <td style="padding-bottom: 10px;">
                <span style="font-size:13pt; font-weight: normal; color: #6c6c6c; font-family: Arial;">Pozdrawiam,</span><br />
                <span style="font-weight: normal; color: #066231; font-size:14pt; font-family: Arial;">mgr inż. Piotr Klimek</span>
        </td>
    </tr>
    <tr style="background-color: #066231;">
        <td style="padding:10px 5px;">
                <img src="http://www.obrazki.wiedzanaplus.pl/ikony/podpisy/mail-icon.png" alt="email:"/>&nbsp;
        <a style="color:#ffffff; font-size: 14pt; font-family: Arial;" href="mailto:Ten adres pocztowy jest chroniony przed spamowaniem. Aby go zobaczyć, konieczne jest włączenie w przeglądarce obsługi JavaScript.">Ten adres pocztowy jest chroniony przed spamowaniem. Aby go zobaczyć, konieczne jest włączenie w przeglądarce obsługi JavaScript.</a><br />
            <p style="margin-left:20px;">
            <a style="color:#ffffff; font-size:14pt; font-family: Arial;" href="http://www.wiedzanaplus.pl/" title="Wiedza Na Plus">WiedzaNaPlus.pl</a>
            &nbsp;&nbsp; &nbsp;&nbsp;
            <a style="color:#ffffff; font-size:14pt; font-family: Arial;" href="http://tests24.pl" title="Programy on-line">tests24.pl</a>
            &nbsp;&nbsp; &nbsp;&nbsp;
            <a style="color:#ffffff; font-size:14pt; font-family: Arial;" href="http://www.piksel-net.pl/" title="www.piksel-net.pl">Piksel-Net.pl</a>
            </p>
        </td>
    </tr>
    <tr style="background-color: #ebebeb;">
        <td style="padding:5px 20px;">
        <a href="https://facebook.com/wiedzanaplus" target="_blank">
            <img style="margin:5px 0;" src="http://www.obrazki.wiedzanaplus.pl/ikony/podpisy/facebook-icon.png" alt="facebook.com/wiedzanaplus"/>
        </a>
        </td>
    </tr>
</table>
</body>
</html> 

 

Dodanie podpisu do programu Outlook 2016:

  1. W oknie Preferencje (rys. 1.), wybieramy Podpisy (rys. 5.).
  2. W oknie Podpisy wybieramy przycisk (+) i zmieniamy nazwę podpisu na własną np. Ten adres pocztowy jest chroniony przed spamowaniem. Aby go zobaczyć, konieczne jest włączenie w przeglądarce obsługi JavaScript..
  3. Przechodzimy do pola tekstowego Podpis z prawej strony i wklejamy tam kod przekopiowany z okna przeglądarki (rys. 6.).
    1. Zaznaczamy całą zawartość okna przeglądarki Command-A.
    2. Przekopiowaną zawartość wklejamy do pola tekstowego Podpis (Command-V), następnie pojawi się ikona Opcje wklejania, w której wybieramy Zachowaj formatowanie źródłowe (rys. 7.).

 

Puste okno Podpisy – Outlook 2016 Mac Rys. 5. Puste okno Podpisy – Outlook 2016 Mac

 

Przygotowana stopka HTML, program Firefox Rys. 6. Przygotowana stopka HTML, program Firefox

 

Tworzenie podpisu Outlook 2016 MacRys. 7. Tworzenie podpisu Outlook 2016 Mac

Utworzony podpis można przypisać do wybranego konta email w części Wybierz podpis domyślny (rys. 8.). Ten sam podpis można przypisać do wszystkich wiadomości (rys. 9.). Jeśli utworzyliśmy podpis rozbudowany, to warto do odpisywania na wiadomości utworzyć krótszą wersję podpisu. Z dłuższej, wersji podpisu korzystać przy pierwszym kontakcie.

 

Przypisywanie podpisów dla wybranego konta email Rys. 8. Przypisywanie podpisów dla wybranego konta email

 

Tworzenie nowej wiadomości z podpisem Rys. 9. Tworzenie nowej wiadomości z podpisem

 

Pliki graficzne umieszczone w przykładzie pobrano z IconArchive, przed pobraniem interesującej nas ikony należy zapoznać się z licencją. Przykład umieszczony w artykule można znaleźć w pliku podpis-html-outlook-2016.zip.

 

Wybrane książki:

Książki Helion