Web development

Still under the name ‘pottval’, we were out on the internet seas as office for digital communication from 2004 to 2011. The project name at that time was a homage to the flawless creature and inspired by Herman Melville’s novel Moby-Dick. Our love is web development with a clean, simple and smart design.

In 2021, we continue with ZEISE MEDIA and pursue a collaborative approach with short paths and communication at eye level. Our heart beats for independent (short) films and we offer web development from a single source and ensure an optimal user experience.

Projects

abbreviations, acronyms & codes

Both professionally and privately, you will stumble across abbreviations and wonder what it means. Especially in the traffic and transport sector, abbreviations are used to shorten repetitive standards for the transmission of information and thus to transmit them more quickly. With abbr.ac you can quickly look up the meanings of abbreviations, acronyms and codes.

Sperlink

With Sperlink you can generate short links with references to long internet addresses. Short and memorable links are easier to communicate and share with others. The use of Sperlink is characterised by the fact that there is no tracking. We aren't interested in who, how and from where your short links are called up. Optionally, there is only an anonymous counter upwards for each page view.

Previous projects

Aküfi

Both professionally and privately, you will stumble across one abbreviation or another and wonder what it means. Especially in the traffic and transport sector, abbreviations are used to shorten repetitive standards for the transmission of information and thus to transmit it more quickly.

The best known are probably the abbreviations of domain endings, airports, states, transport companies and distinguishing signs for vehicles. Railway stations are also abbreviated in different ways depending on the area of use: on the one hand, there is the international station number for clear identification, a separate abbreviation for the respective infrastructure operator and, for rough classification, the official abbreviation of the city based on the vehicle registration number. Aküfi helps you with this. The project will be integrated into abbr.ac.

ZE.is

With ZE.is you could generate short links and create a landing page with your favourite links (e.g. own website, special offers, social accounts, imprint) for your community. This page will be integrated into Sperlink.

ZEISE.cc

ZEISE.cc was the beginning of our search engine for abbreviations from the transport and traffic sector. Over the years, the service has been expanded to 23 languages. To bring the platform up to date, all entries will be moved to abbr.ac.

ZEISE.cloud

For all our own developments, we have set up a digital playground where we have deposited our collection of resources with styles and scripts. The public pages will be moved to ZEISE MEDIA, so that ZEISE.cloud will only contain the actual libraries.

Snippets

CSS gradient text

Lorem ipsum dolor sit amet consectetur adipisicing elit. Eligendi exercitationem quos, facere ipsum perspiciatis labore dolores, quibusdam, culpa numquam deleniti nihil ad. Tempore beatae nobis facere deserunt nam dicta earum.

HTML:

class="text-gradient"

Sass:

.text-gradient
    background-image: -webkit-linear-gradient(45deg, DarkSlateBlue 0%, Orchid 100%)
    display: inline-block
    -webkit-background-clip: text
    -webkit-text-fill-color: transparent

Multi-line text animated underlining

Lorem ipsum dolor sit amet consectetur adipisicing elit. Eligendi exercitationem quos, facere ipsum perspiciatis labore dolores, quibusdam, culpa numquam deleniti nihil ad. Tempore beatae nobis facere deserunt nam dicta earum.

HTML:

class="text-underline"

Sass:

.text-underline
    background:
        image: linear-gradient(currentColor, currentColor)
        position: 0% 100%
        repeat: no-repeat
        size: 0% 1px
    color: DarkSlateBlue
    text-decoration: none
    transition: background-size 0.3s ease-in-out, color 0s ease-in-out
    &:hover
        background:
            size: 100% 1px
        color: Orchid

Responsive square with CSS

Shoe-tossing in Prague :)

HTML:

class="bg-square" style="background-image: url('https://example.com/image.jpg');"

Sass:

.bg-square
    width: 50% // equal padding-bottom value
    &:after
        content: ""
        display: block
        padding-bottom: 50% // equal width value
        position: relative

Zoom background-image on hover

Shoe-tossing in Prague :)

HTML:

/* center by default */
class="bg-zoom-in" style="background-image: url('https://example.com/image.jpg');"

/* add position top right */
class="bg-zoom-in" style="[…]; background-position: top right;"
/* add position top left */
class="bg-zoom-in" style="[…]; background-position: top left;"
/* add position bottom right */
class="bg-zoom-in" style="[…]; background-position: bottom right;"
/* add position bottom left */
class="bg-zoom-in" style="[…]; background-position: bottom left;"

Sass:

.bg-zoom-in
    transition: all .3s ease-in-out
    background:
        color: plum
        position: center
        repeat: no-repeat
        size: 110%
    &:hover
        background:
            position: relative
            size: 100%

Tools

Sitemap Style Sheet

This website is still very manageable. But the beginning is made with our dynamic and responsive sitemap.xml. Download our theme for your sitemap.

URL Shortener

You can shorten URLs to make them easier to share. Our URL shortener was developed for the purpose of sharing subpages of ZEISE.cc, an search engine for railway and transport abbreviations.

Vector Flag Icons

Inspired by the Font Awesome toolkit, you can place Vector Flag Icons just about anywhere with the italic type HTML tag. You'll get all of 206 national flags of states in membership within the United Nations System – all optimized for speed and no hassle.

Great things

Bookmarks and link overview to smart resources and tools for web development or simply things that are found to be great.